Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Tests: add sidebar tests -p3 #3211

Merged
merged 1 commit into from
Feb 7, 2024
Merged

Tests: add sidebar tests -p3 #3211

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 11 additions & 0 deletions cypress/e2e/pages/assets.pages.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,8 @@ const hiddenTokenSaveBtn = 'span[data-track="assets: Save hide dialog"]'
const hiddenTokenCancelBtn = 'span[data-track="assets: Cancel hide dialog"]'
const hiddenTokenDeselectAllBtn = 'span[data-track="assets: Deselect all hide dialog"]'
const hiddenTokenIcon = 'svg[data-testid="VisibilityOffOutlinedIcon"]'
const currencySelector = '[data-testid="currency-selector"]'
const currencyItem = '[data-testid="currency-item"]'

const hideTokenDefaultString = 'Hide tokens'
const assetNameSortBtnStr = 'Asset'
Expand Down Expand Up @@ -91,6 +93,15 @@ export const currentcyGnosisFormat = '< 0.00001 GNO'
export const currencyOx = /^0x$/
export const currentcyOxFormat = '1.003 ZRX'

function clickOnCurrencySelector() {
cy.get(currencySelector).click()
}

export function changeCurrency(currency) {
clickOnCurrencySelector()
cy.get(currencyItem).contains(currency).click()
}

export function clickOnSendBtn(index) {
cy.get('button')
.contains(sendBtnStr)
Expand Down
3 changes: 3 additions & 0 deletions cypress/e2e/pages/navigation.page.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,9 @@ const sentinelStart = 'div[data-testid="sentinelStart"]'
const disconnectBtnStr = 'Disconnect'
const notConnectedStatus = 'Connect'

export function verifyTxBtnStatus(status) {
cy.get(newTxBtn).should(status)
}
export function clickOnSideNavigation(option) {
cy.get(option).should('exist').click()
}
Expand Down
41 changes: 24 additions & 17 deletions cypress/e2e/pages/sidebar.pages.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ const sideBarListItem = '[data-testid="sidebar-list-item"]'
const sideBarListItemWhatsNew = '[data-testid="list-item-whats-new"]'
const sideBarListItemNeedHelp = '[data-testid="list-item-need-help"]'
const sideSafeListItem = '[data-testid="safe-list-item"]'
const sidebarSafeHeader = '[data-testid="sidebar-safe-header"]'
const sidebarSafeHeader = '[data-testid="safe-header-info"]'
const sidebarSafeContainer = '[data-testid="sidebar-safe-container"]'
const safeItemOptionsBtn = '[data-testid="safe-options-btn"]'
const safeItemOptionsRenameBtn = '[data-testid="rename-btn"]'
Expand All @@ -26,6 +26,8 @@ const cancelBtn = '[data-testid="cancel-btn"]'
const deleteBtn = '[data-testid="delete-btn"]'
const readOnlyVisibility = '[data-testid="read-only-visibility"]'
const currencySection = '[data-testid="currency-section"]'
const missingSignatureInfo = '[data-testid="missing-signature-info"]'
const queuedTxInfo = '[data-testid="queued-tx-info"]'

export const addedSafesGnosis = ['0x17b3...98C8', '0x11A6...F1BB', '0xB8d7...642A']
export const addedSafesSepolia = ['0x6d0b...6dC1', '0x5912...fFdb', '0x0637...708e', '0xD157...DE9a']
Expand Down Expand Up @@ -120,27 +122,26 @@ export function verifySafesByNetwork(netwrok, safes) {
})
}

function getSafeItemByName(name) {
return cy.get(sidebarSafeContainer).find(sideSafeListItem).contains(name).parents('li')
}

export function verifySafeReadOnlyState(safe) {
cy.get(sidebarSafeContainer).within(() => {
cy.get(sideSafeListItem)
.contains(safe)
.parents('li')
.within(() => {
cy.get(readOnlyVisibility).should('exist')
})
})
getSafeItemByName(safe).find(readOnlyVisibility).should('exist')
}

export function verifyMissingSignature(safe) {
getSafeItemByName(safe).find(missingSignatureInfo).should('exist')
}

export function verifyQueuedTx(safe) {
return getSafeItemByName(safe).find(queuedTxInfo).should('exist')
}

function clickOnSafeItemOptionsBtn(name) {
cy.get(sidebarSafeContainer).within(() => {
cy.get(sideSafeListItem)
.contains(name)
.parents('li')
.within(() => {
cy.get(safeItemOptionsBtn).click()
})
})
getSafeItemByName(name).find(safeItemOptionsBtn).click()
}

export function renameSafeItem(oldName, newName) {
clickOnSafeItemOptionsBtn(oldName)
clickOnRenameBtn()
Expand Down Expand Up @@ -188,3 +189,9 @@ export function clickOnSaveBtn() {
function verifyModalRemoved() {
main.verifyElementsCount(modal.modalTitle, 0)
}

export function checkCurrencyInHeader(currency) {
cy.get(sidebarSafeHeader).within(() => {
cy.get(currencySection).contains(currency)
})
}
21 changes: 19 additions & 2 deletions cypress/e2e/regression/sidebar_2.cy.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,14 +2,16 @@ import * as constants from '../../support/constants'
import * as main from '../pages/main.page'
import * as sideBar from '../pages/sidebar.pages'
import * as ls from '../../support/localstorage_data.js'
import * as assets from '../pages/assets.pages.js'

const newSafeName = 'Added safe 3'
const oldSafeName = 'Added safe 2'
const oldSafeName = 'Added safe 900'
const staticSafe100 = 'Added safe 100'
const staticSafe200 = 'Added safe 200'

describe('Sidebar added sidebar tests', () => {
beforeEach(() => {
cy.visit(constants.homeUrl + constants.SEPOLIA_TEST_SAFE_13)
cy.visit(constants.BALANCE_URL + constants.SEPOLIA_TEST_SAFE_13)
cy.wait(2000)
cy.clearLocalStorage()
main.acceptCookies()
Expand Down Expand Up @@ -45,4 +47,19 @@ describe('Sidebar added sidebar tests', () => {
sideBar.openSidebar()
sideBar.verifySafeReadOnlyState(staticSafe100)
})

it('Verify Fiat currency changes when edited in the assets tab', () => {
assets.changeCurrency(constants.currencies.cad)
sideBar.checkCurrencyInHeader(constants.currencies.cad)
})

it('Verify "wallet" tag counter if the safe has tx ready for execution', () => {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This test description is not correct. That counter counts how many tx in queue the current connected owner can sign, not necesarely they can be executed.
Change it to something like "Verify "wallet" tag counter of tx that need signature from current owner"

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is original test title taken from our hub of tests and scheduled for automation, the implementation is according to the title. If there are changes needed in updating test title, we can do this later, outside of the scope of this task.

sideBar.openSidebar()
sideBar.verifyMissingSignature(staticSafe200)
})

it('Verify "Wallet" tag counter only shows for owners', () => {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Same with this description, is not correct. The gray tag with the "check" icon shows how many tx are in queue for everyone (owners, non-owners, disconnected users)

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is original test title taken from our hub of tests and scheduled for automation, the implementation is according to the title. If there are changes needed in updating test title, we can do this later, outside of the scope of this task.

sideBar.openSidebar()
sideBar.verifyQueuedTx(staticSafe200)
})
})
29 changes: 29 additions & 0 deletions cypress/e2e/regression/sidebar_nonowner.cy.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
import * as constants from '../../support/constants.js'
import * as main from '../pages/main.page.js'
import * as sideBar from '../pages/sidebar.pages.js'
import * as navigation from '../pages/navigation.page.js'
import * as ls from '../../support/localstorage_data.js'

const addedOwner = 'Added owner'
const addedNonowner = 'Added non-owner'

describe('Sidebar non-owner tests', () => {
beforeEach(() => {
cy.visit(constants.homeUrl + constants.SEPOLIA_TEST_SAFE_17_SIDEBAR_NONOWNER)
cy.wait(2000)
cy.clearLocalStorage()
main.acceptCookies()
main.addToLocalStorage(constants.localStorageKeys.SAFE_v2__addedSafes, ls.addedSafes.set3)
main.addToLocalStorage(constants.localStorageKeys.SAFE_v2__addressBook, ls.addressBookData.addedSafes)
})

it('Verify New Transaction button enabled for users with Spending limits allowed', () => {
navigation.verifyTxBtnStatus(constants.enabledStates.enabled)
})

it('Verify tag counting queue tx show for owners and non-owners', () => {
sideBar.openSidebar()
sideBar.verifyQueuedTx(addedOwner).contains(2)
sideBar.verifyQueuedTx(addedNonowner).contains(2)
})
})
6 changes: 6 additions & 0 deletions cypress/support/constants.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@ export const SEPOLIA_TEST_SAFE_14 = 'sep:0xC23e061252BFc7967203D054136d8fA7c7df2
// SAFE 15 is a safe with native tokens but the automation user is not its owner
export const SEPOLIA_TEST_SAFE_15_TOKEN = 'sep:0xfC0A7ac73Fde7547ac0792Cca1D8A50CE0AFC4Df'
export const SEPOLIA_TEST_SAFE_16_CREATE_TX = 'sep:0xc2F3645bfd395516d1a18CA6ad9298299d328C01'
export const SEPOLIA_TEST_SAFE_17_SIDEBAR_NONOWNER = 'sep:0x10B45a24640E2170B6AA63ea3A289D723a0C9cba'
export const SEPOLIA_CONTRACT_SHORT = '0x11AB...34aF'
export const SEPOLIA_RECIPIENT_ADDR_SHORT = '0x4DD4...7bde'
export const GNO_TEST_SAFE = 'gno:0xB8d760a90a5ed54D3c2b3EFC231277e99188642A'
Expand Down Expand Up @@ -134,6 +135,11 @@ export const tokenAbbreviation = {
link: 'LINK',
}

export const currencies = {
cad: 'CAD',
aud: 'AUD',
}

export const appNames = {
walletConnect: 'walletconnect',
customContract: 'compose custom contract',
Expand Down
49 changes: 48 additions & 1 deletion cypress/support/localstorage_data.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -319,9 +319,14 @@ export const addressBookData = {
addedSafes: {
100: {
'0x17b34aEf1428A358bA2eA360a098b8A3BEb698C8': 'Added safe 1',
'0x11A6B41322C57Bd0e56cEe06abB11A1E5c1FF1BB': 'Added safe 2',
'0x11A6B41322C57Bd0e56cEe06abB11A1E5c1FF1BB': 'Added safe 900',
'0xB8d760a90a5ed54D3c2b3EFC231277e99188642A': 'Added safe 100',
},
11155111: {
'0x0A0EEb6fBCc7c82259E548Fc4617175A357b3e71': 'Added safe 200',
'0xF21445699e91aC6F2EeeAF1a19510AC4197e59aB': 'Added owner',
'0x9E6DAfe829431e1892EcF8461FDAd02665170c31': 'Added non-owner',
},
},
}

Expand Down Expand Up @@ -507,6 +512,22 @@ export const addedSafes = {
threshold: 1,
ethBalance: '0',
},
'0x0A0EEb6fBCc7c82259E548Fc4617175A357b3e71': {
owners: [
{
value: '0x8aEf2f5c3F17261F6F1C4dA058D022BE92776af8',
name: null,
logoUri: null,
},
{
value: '0xC16Db0251654C0a72E91B190d81eAD367d2C6fED',
name: null,
logoUri: null,
},
],
threshold: 2,
ethBalance: '0',
},
},
100: {
'0x17b34aEf1428A358bA2eA360a098b8A3BEb698C8': {
Expand All @@ -526,6 +547,32 @@ export const addedSafes = {
},
},
},
set3: {
11155111: {
'0xF21445699e91aC6F2EeeAF1a19510AC4197e59aB': {
owners: [
{
value: '0xC16Db0251654C0a72E91B190d81eAD367d2C6fED',
name: null,
logoUri: null,
},
],
threshold: 2,
ethBalance: '0',
},
'0x9E6DAfe829431e1892EcF8461FDAd02665170c31': {
owners: [
{
value: '0x96D4c6fFC338912322813a77655fCC926b9A5aC5',
name: null,
logoUri: null,
},
],
threshold: 2,
ethBalance: '0',
},
},
},
}

export const pinnedApps = {
Expand Down
3 changes: 2 additions & 1 deletion src/components/balances/CurrencySelect/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,7 @@ const CurrencySelect = (): ReactElement => {
<InputLabel id="currency-label">Currency</InputLabel>

<Select
data-testid="currency-selector"
labelId="currency-label"
id="currency"
value={currency.toUpperCase()}
Expand All @@ -43,7 +44,7 @@ const CurrencySelect = (): ReactElement => {
onClose={() => handleTrack('Close')}
>
{fiatCurrencies.map((item) => (
<MenuItem key={item} value={item} sx={{ overflow: 'hidden' }}>
<MenuItem data-testid="currency-item" key={item} value={item} sx={{ overflow: 'hidden' }}>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Not a big fan of having a data test id that should be unique in several elements. Is there a way to have it being "currency-item-1", "currency-item-2", ... ?
Same with other elements like "missing-signature-info" and "queued-tx-info"

Not a blocker if not possible/too cumbersome to do

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I suggest to keep these data-testeds as is, this is a common practise to assign data-testid for the same element types which can be accessed through Cypress in more precise way.

{item.toUpperCase()}
</MenuItem>
))}
Expand Down
2 changes: 2 additions & 0 deletions src/components/sidebar/PendingActions/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,6 +45,7 @@ const PendingActionButtons = ({
<NextLink href={queueLink} passHref legacyBehavior>
<Tooltip title={`${shortAddress} can confirm ${totalToSign} transaction(s)`} placement="top" arrow>
<ButtonBase
data-testid="missing-signature-info"
className={classnames(css.pendingButton, css.missingSignatures)}
onClick={closeDrawer}
sx={{
Expand All @@ -65,6 +66,7 @@ const PendingActionButtons = ({
<NextLink href={queueLink} passHref legacyBehavior>
<Tooltip title={`${totalQueued} transactions in the queue`} placement="top" arrow>
<ButtonBase
data-testid="queued-tx-info"
className={classnames(css.pendingButton, css.queued)}
onClick={closeDrawer}
sx={{
Expand Down
Loading