diff --git a/.github/workflows/ui_tests.yml b/.github/workflows/ui_tests.yml index 6f2ab26af4..e23a7b7bb4 100644 --- a/.github/workflows/ui_tests.yml +++ b/.github/workflows/ui_tests.yml @@ -23,7 +23,7 @@ jobs: ui_tests: name: 'Playwright Tests' runs-on: ubuntu-latest - timeout-minutes: 5 + timeout-minutes: 10 steps: - name: checkout uses: actions/checkout@v3 diff --git a/apps/laboratory/tests/connect.spec.ts b/apps/laboratory/tests/connect.spec.ts index 6bf7d1aa35..ff7d8ea123 100644 --- a/apps/laboratory/tests/connect.spec.ts +++ b/apps/laboratory/tests/connect.spec.ts @@ -31,3 +31,23 @@ testMW( await modalValidator.expectRejectedSign() } ) + +testMW( + 'it should switch networks and sign', + async ({ modalPage, walletPage, modalValidator, walletValidator }) => { + let targetChain = 'Polygon' + await modalPage.switchNetwork(targetChain) + await modalPage.sign() + await walletValidator.expectReceivedSign({ chainName: targetChain }) + await walletPage.handleRequest({ accept: true }) + await modalValidator.expectAcceptedSign() + + // Switch to Ethereum + targetChain = 'Ethereum' + await modalPage.switchNetwork(targetChain) + await modalPage.sign() + await walletValidator.expectReceivedSign({ chainName: targetChain }) + await walletPage.handleRequest({ accept: true }) + await modalValidator.expectAcceptedSign() + } +) diff --git a/apps/laboratory/tests/shared/pages/ModalPage.ts b/apps/laboratory/tests/shared/pages/ModalPage.ts index 075ced2017..bcfde2ce5b 100644 --- a/apps/laboratory/tests/shared/pages/ModalPage.ts +++ b/apps/laboratory/tests/shared/pages/ModalPage.ts @@ -33,4 +33,11 @@ export class ModalPage { async sign() { await this.page.getByTestId('sign-message-button').click() } + + async switchNetwork(network: string) { + await this.page.getByTestId('account-button').click() + await this.page.getByTestId('w3m-account-select-network').click() + await this.page.getByTestId(`w3m-network-switch-${network}`).click() + await this.page.getByTestId(`w3m-header-close`).click() + } } diff --git a/packages/scaffold/src/partials/w3m-header/index.ts b/packages/scaffold/src/partials/w3m-header/index.ts index f9e9b2d74d..1290b8b150 100644 --- a/packages/scaffold/src/partials/w3m-header/index.ts +++ b/packages/scaffold/src/partials/w3m-header/index.ts @@ -79,6 +79,7 @@ export class W3mHeader extends LitElement { ?disabled=${this.buffering} icon="close" @click=${this.onClose.bind(this)} + data-testid="w3m-header-close" > ${this.separatorTemplate()} diff --git a/packages/scaffold/src/views/w3m-account-view/index.ts b/packages/scaffold/src/views/w3m-account-view/index.ts index 49ed93971e..de686ace36 100644 --- a/packages/scaffold/src/views/w3m-account-view/index.ts +++ b/packages/scaffold/src/views/w3m-account-view/index.ts @@ -133,6 +133,7 @@ export class W3mAccountView extends LitElement { imageSrc=${ifDefined(networkImage)} ?chevron=${this.isAllowedNetworkSwitch()} @click=${this.onNetworks.bind(this)} + data-testid="w3m-account-select-network" > ${this.network?.name ?? 'Unknown'} diff --git a/packages/scaffold/src/views/w3m-networks-view/index.ts b/packages/scaffold/src/views/w3m-networks-view/index.ts index 446249ce31..f3a80f8fe8 100644 --- a/packages/scaffold/src/views/w3m-networks-view/index.ts +++ b/packages/scaffold/src/views/w3m-networks-view/index.ts @@ -94,6 +94,7 @@ export class W3mNetworksView extends LitElement { name=${network.name ?? network.id} @click=${() => this.onSwitchNetwork(network)} .disabled=${!supportsAllNetworks && !approvedIds?.includes(network.id)} + data-testid=${`w3m-network-switch-${network.name ?? network.id}`} > ` )