From f6083c5788b217eb30bedce9750c8365cc379559 Mon Sep 17 00:00:00 2001 From: Steven Straatemans Date: Wed, 16 Oct 2024 15:22:07 +0200 Subject: [PATCH 1/4] add a read the terms checkbox --- .../components/ConnectWalletStep.tsx | 83 ++++++++++++------- 1 file changed, 53 insertions(+), 30 deletions(-) diff --git a/spirekey/src/components/Registration/components/ConnectWalletStep.tsx b/spirekey/src/components/Registration/components/ConnectWalletStep.tsx index 8ffa0668..6b448da6 100644 --- a/spirekey/src/components/Registration/components/ConnectWalletStep.tsx +++ b/spirekey/src/components/Registration/components/ConnectWalletStep.tsx @@ -6,7 +6,7 @@ import { FLOWTYPE } from '@/components/OnBoarding/components/OnBoardingStepper/u import { ConnectWalletAnimation } from '@/components/RegistrationAnimations/ConnectWalletAnimation'; import { WalletAnimation } from '@/components/RegistrationAnimations/WalletAnimation'; import { useWallet } from '@/hooks/useWallet'; -import { Button, Stack } from '@kadena/kode-ui'; +import { Button, Checkbox, Stack } from '@kadena/kode-ui'; import { FC, useState } from 'react'; interface IProps { @@ -27,6 +27,7 @@ export const ConnectWalletStep: FC = ({ steps, }) => { const [activeStep, setActiveStep] = useState(undefined); + const [hasReadToS, setHasReadTos] = useState(false); const [hoveredConnectWallet, setHoveredConnectWallet] = useState(false); const [hoveredCreateWallet, setHoveredCreateWallet] = useState(false); const { getWallet } = useWallet(); @@ -54,7 +55,8 @@ export const ConnectWalletStep: FC = ({ = ({ - { - setHoveredConnectWallet(true); - }} - onMouseLeave={() => { - setHoveredConnectWallet(false); - }} - > - - + + + setHasReadTos((v) => !v)} + key="HasReadToS" + value="true" + aria-label="I have read & agree to the Terms of Service" + > + I have read & agree to the + + + Terms of Service + + - {!hasWallet && ( - { - setHoveredCreateWallet(true); - }} - onMouseLeave={() => { - setHoveredCreateWallet(false); - }} - > - + + { + setHoveredConnectWallet(true); + }} + onMouseLeave={() => { + setHoveredConnectWallet(false); + }} + > + + + + {!hasWallet && ( + { + setHoveredCreateWallet(true); + }} + onMouseLeave={() => { + setHoveredCreateWallet(false); + }} + > + + + )} - )} + ); From 3dfd125ffb30abb724637f1c416610762a19502e Mon Sep 17 00:00:00 2001 From: Steven Straatemans Date: Wed, 16 Oct 2024 16:31:20 +0200 Subject: [PATCH 2/4] fix tests --- spirekey/e2e/page-objects/pages/connect.page.ts | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/spirekey/e2e/page-objects/pages/connect.page.ts b/spirekey/e2e/page-objects/pages/connect.page.ts index f41b3bf4..905bf8cf 100644 --- a/spirekey/e2e/page-objects/pages/connect.page.ts +++ b/spirekey/e2e/page-objects/pages/connect.page.ts @@ -11,6 +11,7 @@ export class ConnectPage { private createWalletButton: Locator; private connectWalletButton: Locator; private createAccountButton: Locator; + private termsCheckBox: Locator; private completeButton: Locator; private webauthnHelper: WebAuthNHelper; @@ -26,6 +27,9 @@ export class ConnectPage { this.connectWalletButton = page.getByRole('button', { name: 'Connect' }); this.createAccountButton = page.getByRole('button', { name: 'Create' }); this.completeButton = page.getByRole('button', { name: 'Complete' }); + this.termsCheckBox = page.getByRole('checkbox', { + name: 'I have read & agree to the', + }); this.webauthnHelper = new WebAuthNHelper(); } @@ -73,7 +77,16 @@ export class ConnectPage { await this.recoverButton.click(); } + async acceptTerms() { + await this.termsCheckBox.waitFor(); + await this.termsCheckBox.click({ force: true }); + } + async createNewWallet() { + await this.createWalletButton.isDisabled(); + + await this.acceptTerms(); + await !this.createWalletButton.isDisabled(); await this.createWalletButton.click(); } From f06ec4c424a65b696f1b3445b1bf8c898c4ecd77 Mon Sep 17 00:00:00 2001 From: Steven Straatemans Date: Wed, 16 Oct 2024 16:49:32 +0200 Subject: [PATCH 3/4] fix other tests --- spirekey/e2e/page-objects/pages/register.page.ts | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/spirekey/e2e/page-objects/pages/register.page.ts b/spirekey/e2e/page-objects/pages/register.page.ts index c423e47b..6c20f175 100644 --- a/spirekey/e2e/page-objects/pages/register.page.ts +++ b/spirekey/e2e/page-objects/pages/register.page.ts @@ -4,11 +4,15 @@ export class RegisterPage { private page: Page; private continueButton: Locator; private createWalletButton: Locator; + private termsCheckBox: Locator; constructor(page: Page) { this.page = page; this.continueButton = this.page.getByRole('button', { name: 'Create' }); this.createWalletButton = this.page.getByRole('button', { name: 'Create' }); + this.termsCheckBox = page.getByRole('checkbox', { + name: 'I have read & agree to the', + }); } async setNetworkTo( @@ -20,7 +24,15 @@ export class RegisterPage { .click(); } + async acceptTerms() { + await this.termsCheckBox.waitFor(); + await this.termsCheckBox.click({ force: true }); + } + async createWallet(): Promise { + await this.createWalletButton.isDisabled(); + await this.acceptTerms(); + await !this.createWalletButton.isDisabled(); await this.createWalletButton.click(); } From 3d3657c82fe28d225329bd4d9c03711ae6ad6985 Mon Sep 17 00:00:00 2001 From: Steven Straatemans Date: Wed, 16 Oct 2024 16:58:58 +0200 Subject: [PATCH 4/4] connect wallet test --- spirekey/e2e/page-objects/pages/connect.page.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/spirekey/e2e/page-objects/pages/connect.page.ts b/spirekey/e2e/page-objects/pages/connect.page.ts index 905bf8cf..b6f85b3e 100644 --- a/spirekey/e2e/page-objects/pages/connect.page.ts +++ b/spirekey/e2e/page-objects/pages/connect.page.ts @@ -58,6 +58,8 @@ export class ConnectPage { } async connectWallet() { + await this.connectWalletButton.isDisabled(); + await this.acceptTerms(); await this.connectWalletButton.click(); }