diff --git a/apps/laboratory/src/components/Ethers/EthersConnectButton.tsx b/apps/laboratory/src/components/Ethers/EthersConnectButton.tsx
index 3080c56e78..04d7963f72 100644
--- a/apps/laboratory/src/components/Ethers/EthersConnectButton.tsx
+++ b/apps/laboratory/src/components/Ethers/EthersConnectButton.tsx
@@ -15,7 +15,7 @@ export function EthersConnectButton() {
const signer = new JsonRpcSigner(provider, address)
const signature = await signer?.signMessage('Hello Web3Modal Ethers')
- toast({ title: 'Succcess', description: signature, status: 'success', isClosable: true })
+ toast({ title: 'Success', description: signature, status: 'success', isClosable: true })
} catch {
toast({
title: 'Error',
@@ -29,7 +29,11 @@ export function EthersConnectButton() {
return (
<>
- {isConnected ? : null}
+ {isConnected ? (
+
+ ) : null}
>
)
}
diff --git a/apps/laboratory/src/components/Wagmi/WagmiConnectButton.tsx b/apps/laboratory/src/components/Wagmi/WagmiConnectButton.tsx
index b55bd18a94..5cf1123759 100644
--- a/apps/laboratory/src/components/Wagmi/WagmiConnectButton.tsx
+++ b/apps/laboratory/src/components/Wagmi/WagmiConnectButton.tsx
@@ -48,7 +48,7 @@ export function WagmiConnectButton() {
async function onSignMessage() {
try {
const signature = await signMessageAsync()
- toast({ title: 'Succcess', description: signature, status: 'success', isClosable: true })
+ toast({ title: 'Success', description: signature, status: 'success', isClosable: true })
} catch {
toast({
title: 'Error',
@@ -67,7 +67,7 @@ export function WagmiConnectButton() {
primaryType: 'Mail',
types
})
- toast({ title: 'Succcess', description: signature, status: 'success', isClosable: true })
+ toast({ title: 'Success', description: signature, status: 'success', isClosable: true })
} catch {
toast({
title: 'Error',
@@ -83,8 +83,12 @@ export function WagmiConnectButton() {
{isConnected ? (
<>
-
-
+
+
>
) : null}
>
diff --git a/apps/laboratory/tests/connect.spec.ts b/apps/laboratory/tests/connect.spec.ts
index 9d084b95dd..79eae58ac6 100644
--- a/apps/laboratory/tests/connect.spec.ts
+++ b/apps/laboratory/tests/connect.spec.ts
@@ -1,14 +1,28 @@
import { DEFAULT_SESSION_PARAMS } from './shared/constants'
import { testMW } from './shared/fixtures/w3m-wallet-fixture'
-// Initialize the connection
testMW.beforeEach(async ({ modalPage, walletPage }) => {
await modalPage.copyConnectUriToClipboard()
await walletPage.connect()
await walletPage.handleSessionProposal(DEFAULT_SESSION_PARAMS)
})
-testMW('Should connect', async ({ modalValidator, walletValidator }) => {
- await modalValidator.expectConnected()
- await walletValidator.expectConnected()
+testMW.afterEach(async ({ modalPage, modalValidator, walletValidator }) => {
+ await modalPage.disconnect()
+ await modalValidator.expectDisconnected()
+ await walletValidator.expectDisconnected()
})
+
+testMW(
+ 'Should connect and sign',
+ async ({ modalPage, walletPage, modalValidator, walletValidator }) => {
+ await modalValidator.expectConnected()
+ await walletValidator.expectConnected()
+
+ // Sign
+ await modalPage.sign()
+ await walletValidator.expectRecievedSign({})
+ 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 b82aeed7f3..075ced2017 100644
--- a/apps/laboratory/tests/shared/pages/ModalPage.ts
+++ b/apps/laboratory/tests/shared/pages/ModalPage.ts
@@ -10,7 +10,7 @@ export class ModalPage {
public readonly page: Page,
public readonly library: string
) {
- this.connectButton = this.page.getByText('Connect Wallet')
+ this.connectButton = this.page.getByTestId('connect-button')
}
async load() {
@@ -24,4 +24,13 @@ export class ModalPage {
await this.page.waitForTimeout(2000)
await this.page.getByTestId('copy-wc2-uri').click()
}
+
+ async disconnect() {
+ await this.page.getByTestId('account-button').click()
+ await this.page.getByTestId('disconnect-button').click()
+ }
+
+ async sign() {
+ await this.page.getByTestId('sign-message-button').click()
+ }
}
diff --git a/apps/laboratory/tests/shared/pages/WalletPage.ts b/apps/laboratory/tests/shared/pages/WalletPage.ts
index 5837a3c05e..07775fdd9d 100644
--- a/apps/laboratory/tests/shared/pages/WalletPage.ts
+++ b/apps/laboratory/tests/shared/pages/WalletPage.ts
@@ -36,12 +36,15 @@ export class WalletPage {
*/
async handleSessionProposal(opts: SessionParams) {
const variant = opts.accept ? `approve` : `reject`
+ await this.page.getByTestId(`session-${variant}-button`).isEnabled()
await this.page.getByTestId(`session-${variant}-button`).focus()
await this.page.keyboard.press('Space')
}
async handleRequest({ accept }: { accept: boolean }) {
const variant = accept ? `approve` : `reject`
- await this.page.getByTestId(`request-button-${variant}`).click()
+ await this.page.getByTestId(`session-${variant}-button`).isEnabled()
+ await this.page.getByTestId(`session-${variant}-button`).focus()
+ await this.page.keyboard.press('Space')
}
}
diff --git a/apps/laboratory/tests/shared/validators/ModalValidator.ts b/apps/laboratory/tests/shared/validators/ModalValidator.ts
index 859698b7e7..a7b0d680de 100644
--- a/apps/laboratory/tests/shared/validators/ModalValidator.ts
+++ b/apps/laboratory/tests/shared/validators/ModalValidator.ts
@@ -5,6 +5,20 @@ export class ModalValidator {
constructor(public readonly page: Page) {}
async expectConnected() {
- await expect(this.page.getByText('Sign Message')).toBeVisible()
+ await expect(this.page.getByTestId('account-button')).toBeVisible()
+ }
+
+ async expectDisconnected() {
+ await expect(this.page.getByTestId('account-button')).not.toBeVisible()
+ }
+
+ async expectAcceptedSign() {
+ await expect(this.page.getByText('Success')).toBeVisible()
+ }
+
+ async expectRejectedSign() {
+ await this.page.waitForTimeout(4000)
+ await this.page.screenshot({ path: 'failure.png' })
+ await expect(this.page.getByText('Error')).toBeVisible()
}
}
diff --git a/apps/laboratory/tests/shared/validators/WalletValidator.ts b/apps/laboratory/tests/shared/validators/WalletValidator.ts
index 8c7fbf2925..e1d5563115 100644
--- a/apps/laboratory/tests/shared/validators/WalletValidator.ts
+++ b/apps/laboratory/tests/shared/validators/WalletValidator.ts
@@ -13,4 +13,16 @@ export class WalletValidator {
await this.gotoSessions.click()
await expect(this.page.getByTestId('session-card')).toBeVisible()
}
+
+ async expectDisconnected() {
+ await this.page.waitForTimeout(1000)
+ await this.page.reload()
+ await this.gotoSessions.click()
+ await expect(this.page.getByTestId('session-card')).not.toBeVisible()
+ }
+
+ async expectRecievedSign({ chainName = 'Ethereum' }) {
+ await expect(this.page.getByTestId('session-approve-button')).toBeVisible()
+ await expect(this.page.getByTestId('request-details-chain')).toHaveText(chainName)
+ }
}
diff --git a/packages/scaffold/src/modal/w3m-account-button/index.ts b/packages/scaffold/src/modal/w3m-account-button/index.ts
index 658297a289..d2bb3b3d2c 100644
--- a/packages/scaffold/src/modal/w3m-account-button/index.ts
+++ b/packages/scaffold/src/modal/w3m-account-button/index.ts
@@ -78,6 +78,7 @@ export class W3mAccountButton extends LitElement {
? CoreHelperUtil.formatBalance(this.balanceVal, this.balanceSymbol)
: ''}
@click=${this.onClick.bind(this)}
+ data-testid="account-button"
>
`
diff --git a/packages/scaffold/src/modal/w3m-button/index.ts b/packages/scaffold/src/modal/w3m-button/index.ts
index f055fcf318..5c42549070 100644
--- a/packages/scaffold/src/modal/w3m-button/index.ts
+++ b/packages/scaffold/src/modal/w3m-button/index.ts
@@ -53,7 +53,6 @@ export class W3mButton extends LitElement {
size=${ifDefined(this.size)}
label=${ifDefined(this.label)}
loadingLabel=${ifDefined(this.loadingLabel)}
- data-testid="connect-button"
>
`
}
diff --git a/packages/scaffold/src/modal/w3m-connect-button/index.ts b/packages/scaffold/src/modal/w3m-connect-button/index.ts
index 437e9210a9..1a00d4c9d7 100644
--- a/packages/scaffold/src/modal/w3m-connect-button/index.ts
+++ b/packages/scaffold/src/modal/w3m-connect-button/index.ts
@@ -45,6 +45,7 @@ export class W3mConnectButton extends LitElement {
size=${ifDefined(this.size)}
.loading=${isLoading}
@click=${this.onClick.bind(this)}
+ data-testid="connect-button"
>
${isLoading ? this.loadingLabel : this.label}
diff --git a/packages/scaffold/src/views/w3m-account-view/index.ts b/packages/scaffold/src/views/w3m-account-view/index.ts
index 9624616e02..49ed93971e 100644
--- a/packages/scaffold/src/views/w3m-account-view/index.ts
+++ b/packages/scaffold/src/views/w3m-account-view/index.ts
@@ -154,6 +154,7 @@ export class W3mAccountView extends LitElement {
?chevron=${false}
.loading=${this.disconecting}
@click=${this.onDisconnect.bind(this)}
+ data-testid="disconnect-button"
>
Disconnect