Skip to content

Commit 21e6f71

Browse files
wklos-iohkwklos-iohk
authored
test(extension): add tests for paper wallet creation (#1408)
1 parent cbb7502 commit 21e6f71

24 files changed

+966
-55
lines changed

‎apps/browser-extension-wallet/src/views/browser-view/features/multi-wallet/create-wallet/steps/SavePaperWallet.tsx

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -125,6 +125,7 @@ export const SavePaperWallet: VFC = () => {
125125
w="$fill"
126126
label={i18n.t('paperWallet.savePaperWallet.downloadBtnLabel')}
127127
icon={<DownloadIcon />}
128+
data-testid="download-button"
128129
/>
129130
</a>
130131
<Button.Secondary
@@ -138,11 +139,16 @@ export const SavePaperWallet: VFC = () => {
138139
disabled={pdfInstance.loading || !!pdfInstance.error}
139140
icon={<PrinterIcon />}
140141
label={i18n.t('paperWallet.savePaperWallet.printBtnLabel')}
142+
data-testid="print-button"
141143
/>
142144
</Flex>
143145
<Flex flexDirection="column" w="$fill" gap="$8">
144146
{!hasStoredPaperWallet && (
145-
<Text.Label color="secondary" className={styles.centerAlign}>
147+
<Text.Label
148+
color="secondary"
149+
className={styles.centerAlign}
150+
data-testid="paper-wallet-save-or-print-label"
151+
>
146152
{i18n.t('paperWallet.savePaperWallet.pleaseSaveOrPrintLabel')}
147153
</Text.Label>
148154
)}
@@ -151,6 +157,7 @@ export const SavePaperWallet: VFC = () => {
151157
disabled={!hasStoredPaperWallet}
152158
w="$fill"
153159
label={i18n.t('core.walletSetupStep.enterWallet')}
160+
data-testid="open-wallet-button"
154161
/>
155162
</Flex>
156163
</Flex>

‎apps/browser-extension-wallet/src/views/browser-view/features/multi-wallet/restore-wallet/steps/ChooseRestoreMethod.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -111,13 +111,13 @@ export const ChooseRestoreMethod: VFC = () => {
111111
{optionElement}
112112
</Flex>
113113
<Box pl="$40">
114-
<Text.Body.Normal weight="$medium" color="secondary" data-testid="mpaper-wallet-description">
114+
<Text.Body.Normal weight="$medium" color="secondary" data-testid="paper-wallet-description">
115115
{i18n.t('paperWallet.chooseRecoveryMethod.paperWallet.description')}
116116
</Text.Body.Normal>
117117
</Box>
118118
</Flex>
119119
<Flex>
120-
<PaperWalletIcon className={styles.restoreIcon} data-testid="mpaper-wallet-icon" />
120+
<PaperWalletIcon className={styles.restoreIcon} data-testid="paper-wallet-icon" />
121121
</Flex>
122122
</Flex>
123123
</Card.Outlined>

‎packages/core/src/ui/components/PaperWallet/PaperWalletInfoCard/PaperWalletInfoCard.tsx

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -17,32 +17,36 @@ export const PaperWalletInfoCard = ({ walletName }: Props): JSX.Element => (
1717
<Flex gap="$8" alignItems="center">
1818
<DocumentIcon height={40} width={40} />
1919
<Flex flexDirection="column">
20-
<Text.Body.Normal weight="$semibold">{walletName}</Text.Body.Normal>
20+
<Text.Body.Normal weight="$semibold" data-testid={'paper-wallet-name'}>
21+
{walletName}
22+
</Text.Body.Normal>
2123
</Flex>
2224
</Flex>
2325
<Flex flexDirection="column" gap="$16" pt="$16" className={styles.infoSection}>
2426
<Flex>
25-
<Text.Label color="secondary">{i18n.t('core.paperWallet.savePaperWallet.contains')}</Text.Label>
27+
<Text.Label color="secondary" data-testid={'contains-label'}>
28+
{i18n.t('core.paperWallet.savePaperWallet.contains')}
29+
</Text.Label>
2630
</Flex>
2731
<Flex flexDirection="column" gap="$24">
2832
<Flex gap="$16">
29-
<QrCodeIcon width={24} height={24} />
33+
<QrCodeIcon width={24} height={24} data-testid="private-qr-code-icon" />
3034
<Flex flexDirection="column" w="$fill">
31-
<Text.Body.Normal weight="$medium">
35+
<Text.Body.Normal weight="$medium" data-testid="private-qr-code-title">
3236
{i18n.t('core.paperWallet.savePaperWallet.privateQrTitle')}
3337
</Text.Body.Normal>
34-
<Text.Body.Small weight="$medium" color="secondary">
38+
<Text.Body.Small weight="$medium" color="secondary" data-testid="private-qr-code-description">
3539
{i18n.t('core.paperWallet.savePaperWallet.privateQrDescription')}
3640
</Text.Body.Small>
3741
</Flex>
3842
</Flex>
3943
<Flex gap={'$16'}>
40-
<QrCodeIcon width={24} height={24} />
44+
<QrCodeIcon width={24} height={24} data-testid="public-qr-code-icon" />
4145
<Flex flexDirection="column" w="$fill">
42-
<Text.Body.Normal weight="$medium">
46+
<Text.Body.Normal weight="$medium" data-testid="public-qr-code-title">
4347
{i18n.t('core.paperWallet.savePaperWallet.publicQrTitle')}
4448
</Text.Body.Normal>
45-
<Text.Body.Small weight="$medium" color="secondary">
49+
<Text.Body.Small weight="$medium" color="secondary" data-testid="public-qr-code-description">
4650
{i18n.t('core.paperWallet.savePaperWallet.publicQrDescription')}
4751
</Text.Body.Small>
4852
</Flex>

‎packages/core/src/ui/components/PaperWallet/PgpPublicKeyEntry/PgpPublicKeyEntry.tsx

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -45,11 +45,17 @@ export const PgpPublicKeyEntry = ({
4545
<Flex className={styles.validation}>
4646
{validation.success && (
4747
<Flex gap="$4">
48-
<CheckIcon className={styles.success} />
49-
<Text.Label color="secondary">{validation.success}</Text.Label>
48+
<CheckIcon className={styles.success} data-testid={'fingerprint-icon'} />
49+
<Text.Label color="secondary" data-testid={'fingerprint-text'}>
50+
{validation.success}
51+
</Text.Label>
5052
</Flex>
5153
)}
52-
{validation.error && <Text.Label color="error">{validation.error}</Text.Label>}
54+
{validation.error && (
55+
<Text.Label color="error" data-testid={'validation-error'}>
56+
{validation.error}
57+
</Text.Label>
58+
)}
5359
</Flex>
5460
</Flex>
5561
);

‎packages/e2e-tests/src/assert/onboarding/ChooseRecoveryMethodPageAssert.ts

Lines changed: 71 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,77 @@
11
import OnboardingCommonAssert from './onboardingCommonAssert';
2+
import ChooseRecoveryMethodPage from '../../elements/onboarding/ChooseRecoveryMethodPage';
3+
import { t } from '../../utils/translationService';
4+
import { expect } from 'chai';
5+
import { TimelineSteps } from '../../enums/Onboarding';
26

37
class ChooseRecoveryMethodPageAssert extends OnboardingCommonAssert {
4-
async assertSeeChooseRecoveryMethodPage() {
5-
// TODO: add assertions for remaining elements
8+
async assertSeeChooseRecoveryMethodPage(flowType: 'Create' | 'Restore') {
9+
await this.assertSeeStepTitle(await t('paperWallet.chooseRecoveryMethod.title'));
10+
const expectedDescription =
11+
flowType === 'Create'
12+
? (await t('paperWallet.chooseRecoveryMethod.description')).replace('<a>', '').replace('</a>', '')
13+
: await t('paperWallet.chooseRestoreMethod.description');
14+
await this.assertSeeStepSubtitle(expectedDescription);
15+
if (flowType === 'Create') {
16+
await ChooseRecoveryMethodPage.learnMoreURL.waitForClickable();
17+
expect(await ChooseRecoveryMethodPage.learnMoreURL.getAttribute('href')).to.equal('https://www.lace.io/faq');
18+
}
19+
20+
await this.assertSeeRecoveryPhraseOption();
21+
await this.assertSeePaperWalletOption(flowType);
22+
23+
await this.assertSeeActiveStepOnProgressTimeline(TimelineSteps.RECOVERY_METHOD);
24+
25+
await this.assertSeeBackButton();
26+
await this.assertNextButtonTextEquals(await t('core.walletSetupStep.next'));
27+
await this.assertSeeHelpAndSupportButton();
28+
await this.assertSeeLegalLinks();
29+
}
30+
31+
private async assertSeePaperWalletOption(flowType: 'Create' | 'Restore') {
32+
await ChooseRecoveryMethodPage.paperWalletRadioButton.waitForDisplayed();
33+
await ChooseRecoveryMethodPage.paperWalletLabel.waitForDisplayed();
34+
expect(await ChooseRecoveryMethodPage.paperWalletLabel.getText()).to.equal(
35+
await t('paperWallet.chooseRestoreMethod.option.paper')
36+
);
37+
await ChooseRecoveryMethodPage.paperWalletDescription.waitForDisplayed();
38+
expect(await ChooseRecoveryMethodPage.paperWalletDescription.getText()).to.equal(
39+
await t('paperWallet.chooseRecoveryMethod.paperWallet.description')
40+
);
41+
await ChooseRecoveryMethodPage.paperWalletIcon.waitForDisplayed();
42+
if (flowType === 'Create') {
43+
await ChooseRecoveryMethodPage.paperWalletAdvancedBadge.waitForDisplayed();
44+
expect(await ChooseRecoveryMethodPage.paperWalletAdvancedBadge.getText()).to.equal(
45+
await t('paperWallet.chooseRecoveryMethod.advanced')
46+
);
47+
await ChooseRecoveryMethodPage.paperWalletPGPKeysIcon.waitForDisplayed();
48+
await ChooseRecoveryMethodPage.paperWalletPGPKeysNotice.waitForDisplayed();
49+
expect(await ChooseRecoveryMethodPage.paperWalletPGPKeysNotice.getText()).to.equal(
50+
await t('paperWallet.chooseRecoveryMethod.pgpKeysRequired')
51+
);
52+
}
53+
}
54+
55+
private async assertSeeRecoveryPhraseOption() {
56+
await ChooseRecoveryMethodPage.recoveryPhraseRadioButton.waitForDisplayed();
57+
await ChooseRecoveryMethodPage.recoveryPhraseLabel.waitForDisplayed();
58+
expect(await ChooseRecoveryMethodPage.recoveryPhraseLabel.getText()).to.equal(
59+
await t('core.walletSetupStep.recoveryPhrase')
60+
);
61+
await ChooseRecoveryMethodPage.recoveryPhraseDescription.waitForDisplayed();
62+
expect(await ChooseRecoveryMethodPage.recoveryPhraseDescription.getText()).to.equal(
63+
await t('paperWallet.chooseRecoveryMethod.mnemonicDescription')
64+
);
65+
await ChooseRecoveryMethodPage.recoveryPhraseIcon.waitForDisplayed();
66+
}
67+
68+
async assertRecoveryMethodIsSelected(method: 'Recovery phrase' | 'Paper wallet') {
69+
expect(await ChooseRecoveryMethodPage.recoveryPhraseRadioButton.getAttribute('data-state')).to.equal(
70+
method === 'Recovery phrase' ? 'checked' : 'unchecked'
71+
);
72+
expect(await ChooseRecoveryMethodPage.paperWalletRadioButton.getAttribute('data-state')).to.equal(
73+
method === 'Paper wallet' ? 'checked' : 'unchecked'
74+
);
675
}
776
}
877

‎packages/e2e-tests/src/assert/onboarding/SaveYourPaperWalletPageAssert.ts

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
import OnboardingCommonAssert from './onboardingCommonAssert';
2+
import { t } from '../../utils/translationService';
3+
import { TimelineSteps } from '../../enums/Onboarding';
4+
import SaveYourPaperWalletPage from '../../elements/onboarding/SaveYourPaperWalletPage';
5+
import { expect } from 'chai';
6+
7+
class SaveYourPaperWalletPageAssert extends OnboardingCommonAssert {
8+
async assertSeeSaveYourPaperWalletPage(expectedPaperWalletName: string) {
9+
await this.assertSeeStepTitle(await t('paperWallet.savePaperWallet.title'));
10+
await this.assertSeeStepSubtitle(await t('paperWallet.savePaperWallet.description'));
11+
await this.assertSeeActiveStepOnProgressTimeline(TimelineSteps.WALLET_SETUP);
12+
13+
await SaveYourPaperWalletPage.paperWalletName.waitForDisplayed();
14+
expect(await SaveYourPaperWalletPage.paperWalletName.getText()).to.equal(expectedPaperWalletName);
15+
await SaveYourPaperWalletPage.containsLabel.waitForDisplayed();
16+
17+
expect(await SaveYourPaperWalletPage.containsLabel.getText()).to.equal(
18+
await t('core.paperWallet.savePaperWallet.contains')
19+
);
20+
await SaveYourPaperWalletPage.privateQrCodeIcon.waitForDisplayed();
21+
await SaveYourPaperWalletPage.privateQrCodeTitle.waitForDisplayed();
22+
expect(await SaveYourPaperWalletPage.privateQrCodeTitle.getText()).to.equal(
23+
await t('core.paperWallet.savePaperWallet.privateQrTitle')
24+
);
25+
await SaveYourPaperWalletPage.privateQrCodeDescription.waitForDisplayed();
26+
expect(await SaveYourPaperWalletPage.privateQrCodeDescription.getText()).to.equal(
27+
await t('core.paperWallet.savePaperWallet.privateQrDescription')
28+
);
29+
await SaveYourPaperWalletPage.publicQrCodeIcon.waitForDisplayed();
30+
await SaveYourPaperWalletPage.publicQrCodeTitle.waitForDisplayed();
31+
expect(await SaveYourPaperWalletPage.publicQrCodeTitle.getText()).to.equal(
32+
await t('core.paperWallet.savePaperWallet.publicQrTitle')
33+
);
34+
await SaveYourPaperWalletPage.publicQrCodeDescription.waitForDisplayed();
35+
expect(await SaveYourPaperWalletPage.publicQrCodeDescription.getText()).to.equal(
36+
await t('core.paperWallet.savePaperWallet.publicQrDescription')
37+
);
38+
39+
await SaveYourPaperWalletPage.downloadButton.waitForClickable();
40+
expect(await SaveYourPaperWalletPage.downloadButton.getText()).to.equal(
41+
await t('paperWallet.savePaperWallet.downloadBtnLabel')
42+
);
43+
await SaveYourPaperWalletPage.printButton.waitForClickable();
44+
expect(await SaveYourPaperWalletPage.printButton.getText()).to.equal(
45+
await t('paperWallet.savePaperWallet.printBtnLabel')
46+
);
47+
48+
await SaveYourPaperWalletPage.downloadOrSaveLabel.waitForDisplayed();
49+
expect(await SaveYourPaperWalletPage.downloadOrSaveLabel.getText()).to.equal(
50+
await t('paperWallet.savePaperWallet.pleaseSaveOrPrintLabel')
51+
);
52+
53+
await SaveYourPaperWalletPage.openWalletButton.waitForDisplayed();
54+
expect(await SaveYourPaperWalletPage.openWalletButton.getText()).to.equal(
55+
await t('core.walletSetupStep.enterWallet')
56+
);
57+
58+
await this.assertSeeHelpAndSupportButton();
59+
await this.assertSeeLegalLinks();
60+
}
61+
62+
async assertOpenWalletButtonEnabled(shouldBeEnabled: boolean): Promise<void> {
63+
await SaveYourPaperWalletPage.openWalletButton.waitForEnabled({ reverse: !shouldBeEnabled });
64+
}
65+
}
66+
67+
export default new SaveYourPaperWalletPageAssert();

‎packages/e2e-tests/src/assert/onboarding/SecureYourPaperWalletPageAssert.ts

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
import OnboardingCommonAssert from './onboardingCommonAssert';
2+
import { TimelineSteps } from '../../enums/Onboarding';
3+
import { t } from '../../utils/translationService';
4+
import SecureYourPaperWalletPage from '../../elements/onboarding/SecureYourPaperWalletPage';
5+
import { expect } from 'chai';
6+
7+
class SecureYourPaperWalletPageAssert extends OnboardingCommonAssert {
8+
async assertSeeSecureYourPaperWalletPage() {
9+
await this.assertSeeStepTitle(await t('paperWallet.securePaperWallet.title'));
10+
await this.assertSeeStepSubtitle(await t('paperWallet.securePaperWallet.description'));
11+
await this.assertSeeActiveStepOnProgressTimeline(TimelineSteps.RECOVERY_SETUP);
12+
13+
await SecureYourPaperWalletPage.pgpKeyNameInputLabel.waitForDisplayed();
14+
expect(await SecureYourPaperWalletPage.pgpKeyNameInputLabel.getText()).to.equal(
15+
await t('core.paperWallet.securePaperWallet.pgpPublicKeyReference')
16+
);
17+
await SecureYourPaperWalletPage.pgpKeyNameInput.waitForDisplayed();
18+
await SecureYourPaperWalletPage.yourPublicPgpKeyBlockInputLabel.waitForDisplayed();
19+
expect(await SecureYourPaperWalletPage.yourPublicPgpKeyBlockInputLabel.getText()).to.equal(
20+
await t('core.paperWallet.securePaperWallet.pgpPublicKeyLabel')
21+
);
22+
await SecureYourPaperWalletPage.yourPublicPgpKeyBlockInput.waitForDisplayed();
23+
24+
await this.assertSeeBackButton();
25+
await this.assertNextButtonTextEquals(await t('core.walletSetupStep.next'));
26+
await this.assertSeeHelpAndSupportButton();
27+
await this.assertSeeLegalLinks();
28+
}
29+
30+
async assertSeeFingerprint(expectedFingerprint: string) {
31+
await SecureYourPaperWalletPage.fingerprintIcon.waitForDisplayed();
32+
await SecureYourPaperWalletPage.fingerprintText.waitForDisplayed();
33+
expect(await SecureYourPaperWalletPage.fingerprintText.getText()).to.equal(expectedFingerprint);
34+
}
35+
36+
async assertSeeErrorMessage(expectedErrorType: 'malformed' | 'private' | 'too weak') {
37+
let translationKey;
38+
switch (expectedErrorType) {
39+
case 'malformed':
40+
translationKey = 'pgp.error.misformedArmoredText';
41+
break;
42+
case 'private':
43+
translationKey = 'pgp.error.privateKeySuppliedInsteadOfPublic';
44+
break;
45+
case 'too weak':
46+
translationKey = 'pgp.error.rsaKeyTooWeak';
47+
break;
48+
default:
49+
throw new Error(`Unsupported error type: ${expectedErrorType}`);
50+
}
51+
await SecureYourPaperWalletPage.validationError.waitForDisplayed();
52+
expect(await SecureYourPaperWalletPage.validationError.getText()).to.equal(await t(translationKey));
53+
}
54+
55+
async assertPgpKeyName(expectedPgpKeyName: string) {
56+
expect(await SecureYourPaperWalletPage.pgpKeyNameInput.getValue()).to.equal(expectedPgpKeyName);
57+
}
58+
59+
async assertPublicPgpKey(expectedPublicPgpKey: string) {
60+
await SecureYourPaperWalletPage.yourPublicPgpKeyBlockInput.waitForStable();
61+
expect(await SecureYourPaperWalletPage.yourPublicPgpKeyBlockInput.getValue()).to.equal(expectedPublicPgpKey.trim());
62+
}
63+
}
64+
65+
export default new SecureYourPaperWalletPageAssert();

‎packages/e2e-tests/src/assert/onboarding/onboardingCommonAssert.ts

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -61,9 +61,6 @@ class OnboardingCommonAssert {
6161
await this.commonOnboardingElements.activeStepIndicator.waitForDisplayed();
6262
let expectedStepTitle;
6363
switch (step) {
64-
case 'Recovery phrase':
65-
expectedStepTitle = await t('core.walletSetupStep.recoveryPhrase');
66-
break;
6764
case 'Wallet setup':
6865
expectedStepTitle = await t('core.walletSetupStep.walletSetup');
6966
break;
@@ -73,12 +70,12 @@ class OnboardingCommonAssert {
7370
case 'Connect device':
7471
expectedStepTitle = await t('core.walletSetupStep.connectWallet');
7572
break;
76-
case 'Recovery details':
77-
expectedStepTitle = await t('core.walletSetup.recoveryDetails');
78-
break;
7973
case 'Recovery method':
8074
expectedStepTitle = await t('core.walletSetup.recoveryMethod');
8175
break;
76+
case 'Recovery setup':
77+
expectedStepTitle = await t('core.walletSetup.recoveryDetails');
78+
break;
8279
default:
8380
throw new Error(`Unsupported step: ${step}`);
8481
}

‎packages/e2e-tests/src/assert/onboarding/onboardingWalletSetupPageAssert.ts

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -35,9 +35,12 @@ class OnboardingWalletSetupPageAssert extends OnboardingCommonAssert {
3535
await this.assertNextButtonEnabled(true);
3636
}
3737

38-
async assertSeeEnterWalletButton() {
38+
async assertSeeEnterWalletButton(isCreatingPaperWallet = false) {
3939
await walletSetupPage.enterWalletButton.waitForDisplayed();
40-
await this.assertNextButtonTextEquals(await t('core.walletNameAndPasswordSetupStep.enterWallet'));
40+
const translationKey = isCreatingPaperWallet
41+
? 'core.walletNameAndPasswordSetupStep.generatePaperWallet'
42+
: 'core.walletNameAndPasswordSetupStep.enterWallet';
43+
await this.assertNextButtonTextEquals(await t(translationKey));
4144
}
4245

4346
async assertSeePasswordRecommendation(expectedMessage: string, shouldSee: boolean) {
@@ -69,13 +72,14 @@ class OnboardingWalletSetupPageAssert extends OnboardingCommonAssert {
6972
}
7073
}
7174

72-
async assertSeeWalletSetupPage() {
75+
async assertSeeWalletSetupPage(isCreatingPaperWallet = false): Promise<void> {
7376
await this.assertSeeStepTitle(await t('core.walletNameAndPasswordSetupStep.title'));
7477
await this.assertSeeStepSubtitle(await t('core.walletNameAndPasswordSetupStep.description'));
7578
await this.assertSeeWalletNameInput();
7679
await this.assertSeePasswordInput();
7780
await this.assertSeeBackButton();
78-
await this.assertSeeEnterWalletButton();
81+
82+
await this.assertSeeEnterWalletButton(isCreatingPaperWallet);
7983

8084
await this.assertSeeLegalLinks();
8185
await this.assertSeeHelpAndSupportButton();

0 commit comments

Comments
 (0)