diff --git a/packages/ui/cypress/support/commands.ts b/packages/ui/cypress/support/commands.ts index 1f4ae392..ff12d5ce 100644 --- a/packages/ui/cypress/support/commands.ts +++ b/packages/ui/cypress/support/commands.ts @@ -4,6 +4,7 @@ import { AuthRequests, Extension, TxRequests } from './Extension' import { MultisigInfo, rejectCurrentMultisigTxs } from '../utils/rejectCurrentMultisigTxs' import { testAccounts, InjectedAccountWitMnemonic } from '../fixtures/testAccounts' import 'cypress-wait-until' +import { settingsPage } from './page-objects/settingsPage' const LOCALSTORAGE_ACCOUNT_NAMES_KEY = 'multix.accountNames' const LOCALSTORAGE_WATCHED_ACCOUNTS_KEY = 'multix.watchedAccount' @@ -109,6 +110,16 @@ Cypress.Commands.add('connectAccounts', (accountAddresses = [Account1] as string }) }) +Cypress.Commands.add('addWatchAccount', (address: string, name?: string) => { + settingsPage.accountAddressInput().type(`${address}{enter}`, { delay: 20 }) + + if (name) { + settingsPage.accountNameInput().type(name) + } + + settingsPage.addButton().click() +}) + interface IVisitWithLocalStorage { url: string watchedAccounts?: string[] @@ -222,6 +233,8 @@ declare global { * @example cy.visitWithLocalStorage({url: http://localhost:3333, watchedAccounts: ['0x0c691601793de060491dab143dfae19f5f6413d4ce4c363637e5ceacb2836a4e'], watchedAccounts: {"0x0c691601793de060491dab143dfae19f5f6413d4ce4c363637e5ceacb2836a4e":"my custom name"}}) */ visitWithLocalStorage: (params: IVisitWithLocalStorage) => void + + addWatchAccount: (address: string, name?: string) => void } } } diff --git a/packages/ui/cypress/support/page-objects/topMenuItems.ts b/packages/ui/cypress/support/page-objects/topMenuItems.ts index 8576b3a8..e711e9d1 100644 --- a/packages/ui/cypress/support/page-objects/topMenuItems.ts +++ b/packages/ui/cypress/support/page-objects/topMenuItems.ts @@ -9,6 +9,7 @@ export const topMenuItems = { multiproxySelector: () => cy.get('[data-cy=select-multiproxy]', { timeout: 20000 }), multiproxySelectorInput: () => cy.get('[data-cy=input-select-multiproxy]', { timeout: 10000 }), multiproxySelectorOption: () => cy.get('[data-cy=select-multiproxy-option]'), + multiproxyLoader: () => cy.get('[data-cy=proxy-selection-loader]', { timeout: 10000 }), networkSelector: () => cy.get('[data-cy=select-networks]'), networkSelectorOption: (networkName: string) => cy.get(`[data-cy=select-network-option-${networkName}]`) diff --git a/packages/ui/cypress/tests/network-switch.cy.ts b/packages/ui/cypress/tests/network-switch.cy.ts new file mode 100644 index 00000000..8d4b5eb7 --- /dev/null +++ b/packages/ui/cypress/tests/network-switch.cy.ts @@ -0,0 +1,40 @@ +import { accountDisplay } from '../support/page-objects/components/accountDisplay' +import { landingPageUrl } from '../fixtures/landingData' +import { landingPage } from '../support/page-objects/landingPage' +import { settingsPage } from '../support/page-objects/settingsPage' +import { testAccounts } from '../fixtures/testAccounts' +import { topMenuItems } from '../support/page-objects/topMenuItems' + +const { name: testAccountName, address: testAccountAddress } = + testAccounts['Multisig Member Account 1'] + +describe('Network can be switched', () => { + it('should switch account using menu', () => { + cy.visit(landingPageUrl) + + landingPage.watchAccountButton().click() + + cy.url().should('contain', 'settings?network=rococo') + cy.addWatchAccount(testAccountAddress, testAccountName) + + settingsPage.accountContainer().within(() => { + accountDisplay.identicon().should('be.visible') + accountDisplay.nameLabel().should('contain', testAccountName) + accountDisplay.addressLabel().contains(testAccountAddress.slice(0, 5)) + }) + + topMenuItems.desktopMenu().within(() => topMenuItems.networkSelector().click()) + topMenuItems.networkSelectorOption('kusama').click() + topMenuItems + .desktopMenu() + .within(() => cy.waitUntil(() => topMenuItems.multiproxyLoader().should('not.be.visible'))) + + cy.url().should('contain', 'settings?network=kusama') + + settingsPage.accountContainer().within(() => { + accountDisplay.identicon().should('be.visible') + accountDisplay.nameLabel().should('contain', testAccountName) + accountDisplay.addressLabel().contains('Hbiow') + }) + }) +}) diff --git a/packages/ui/cypress/tests/setIdentity.cy.ts b/packages/ui/cypress/tests/setIdentity.cy.ts index 7442a54b..1c5bf363 100644 --- a/packages/ui/cypress/tests/setIdentity.cy.ts +++ b/packages/ui/cypress/tests/setIdentity.cy.ts @@ -1,5 +1,5 @@ import { InjectedAccountWitMnemonic } from '../fixtures/testAccounts' -import { landingPageAddressUrl, landingPageNetwork, landingPageUrl } from '../fixtures/landingData' +import { landingPageNetwork, landingPageUrl } from '../fixtures/landingData' import { setIdentityMultisigs } from '../fixtures/setIdentity/setIdentityMultisigs' import { setIdentitySignatories } from '../fixtures/setIdentity/setIdentitySignatories' import { multisigPage } from '../support/page-objects/multisigPage' diff --git a/packages/ui/cypress/tests/watched-accounts.cy.ts b/packages/ui/cypress/tests/watched-accounts.cy.ts index 72be1eef..d53ba223 100644 --- a/packages/ui/cypress/tests/watched-accounts.cy.ts +++ b/packages/ui/cypress/tests/watched-accounts.cy.ts @@ -12,16 +12,6 @@ import { multisigPage } from '../support/page-objects/multisigPage' import { editNamesModal } from '../support/page-objects/modals/editNamesModal' import { testAccounts } from '../fixtures/testAccounts' -const addWatchAccount = (address: string, name?: string) => { - settingsPage.accountAddressInput().type(`${address}{enter}`, { delay: 20 }) - - if (name) { - settingsPage.accountNameInput().type(name) - } - - settingsPage.addButton().click() -} - const { name: testAccountName, address: testAccountAddress } = testAccounts['Multisig Member Account 1'] @@ -29,7 +19,7 @@ describe('Watched Accounts', () => { it('can add an account to the watch list', () => { cy.visit(landingPageUrl) landingPage.watchAccountButton().click() - addWatchAccount(testAccountAddress, testAccountName) + cy.addWatchAccount(testAccountAddress, testAccountName) settingsPage.accountContainer().within(() => { accountDisplay.identicon().should('be.visible') accountDisplay.addressLabel().should('be.visible') @@ -41,7 +31,7 @@ describe('Watched Accounts', () => { it('can remove an account from the watch list', () => { // add an account first cy.visit(settingsPageWatchAccountUrl) - addWatchAccount(testAccountAddress) + cy.addWatchAccount(testAccountAddress) // now remove it settingsPage.accountContainer().within(() => { settingsPage.accountDeleteButton().click() @@ -54,10 +44,10 @@ describe('Watched Accounts', () => { it('can see error when attempting to add same address more than once', () => { // add an account first cy.visit(settingsPageWatchAccountUrl) - addWatchAccount(testAccountAddress) + cy.addWatchAccount(testAccountAddress) settingsPage.accountContainer().should('have.length', 1) // attempt to add the same account again - addWatchAccount(testAccountAddress) + cy.addWatchAccount(testAccountAddress) settingsPage.errorLabel().should('be.visible').should('have.text', 'Account already added') settingsPage.accountContainer().should('have.length', 1) settingsPage.addButton().should('be.disabled') @@ -65,7 +55,7 @@ describe('Watched Accounts', () => { it('can see error when attempting to add an invalid address', () => { cy.visit(settingsPageWatchAccountUrl) - addWatchAccount('123') + cy.addWatchAccount('123') settingsPage.errorLabel().should('be.visible').should('have.text', 'Invalid address') settingsPage.accountContainer().should('have.length', 0) settingsPage.addButton().should('be.disabled') diff --git a/packages/ui/src/components/select/MultiProxySelection.tsx b/packages/ui/src/components/select/MultiProxySelection.tsx index bb0c7e63..c0077084 100644 --- a/packages/ui/src/components/select/MultiProxySelection.tsx +++ b/packages/ui/src/components/select/MultiProxySelection.tsx @@ -129,7 +129,10 @@ const MultiProxySelection = ({ className }: Props) => { if (isLoading) { return ( - + ) }