Skip to content

Commit f23ca6e

Browse files
wklos-iohkwklos-iohk
authored
test/lw-11886 (#1569)
* test(extension): add tests for LW-11165, LW-11168, LW-11169 * test(extension): add step for camera access permission Signed-off-by: wklos-iohk <wojciech.klos@iohk.io> * test(extension): add assertions for different camera access states Signed-off-by: wklos-iohk <wojciech.klos@iohk.io> --------- Signed-off-by: wklos-iohk <wojciech.klos@iohk.io>
1 parent 24a5a90 commit f23ca6e

File tree

10 files changed

+151
-10
lines changed

10 files changed

+151
-10
lines changed

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

Lines changed: 19 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -216,16 +216,20 @@ export const ScanShieldedMessage: VFC = () => {
216216
if (scanState === 'blocked') {
217217
return (
218218
<Flex flexDirection="column" alignItems="center">
219-
<SadEmojiIcon height={40} width={40} />
220-
<Text.Label color="secondary">{i18n.t('paperWallet.scanShieldedMessage.cameraAccessBlocked')}</Text.Label>
219+
<SadEmojiIcon height={40} width={40} data-testid={'sad-emoji-icon'} />
220+
<Text.Label color="secondary" data-testid={'camera-access-blocked-label'}>
221+
{i18n.t('paperWallet.scanShieldedMessage.cameraAccessBlocked')}
222+
</Text.Label>
221223
</Flex>
222224
);
223225
}
224226
if (scanState === 'waiting') {
225227
return (
226228
<Flex flexDirection="column" alignItems="center">
227-
<CameraIcon height={40} width={40} />
228-
<Text.Label color="secondary">{i18n.t('paperWallet.scanShieldedMessage.waitingForCameraAccess')}</Text.Label>
229+
<CameraIcon height={40} width={40} data-testid={'camera-icon'} />
230+
<Text.Label color="secondary" data-testid={'camera-access-prompt-label'}>
231+
{i18n.t('paperWallet.scanShieldedMessage.waitingForCameraAccess')}
232+
</Text.Label>
229233
</Flex>
230234
);
231235
}
@@ -257,6 +261,7 @@ export const ScanShieldedMessage: VFC = () => {
257261
ref={videoRef}
258262
autoPlay
259263
playsInline
264+
data-testid={'camera-preview-box'}
260265
/>
261266
<canvas ref={canvasRef} className={styles.hidden} />
262267
</Box>
@@ -269,6 +274,7 @@ export const ScanShieldedMessage: VFC = () => {
269274
onChange={handleDeviceChange}
270275
showArrow
271276
zIndex={99_999}
277+
id={'camera-selection-box'}
272278
>
273279
{VideoDeviceSelectOptions}
274280
</Select.Root>
@@ -285,21 +291,26 @@ export const ScanShieldedMessage: VFC = () => {
285291
}}
286292
label={i18n.t('core.walletSetupStep.back')}
287293
title={i18n.t('core.walletSetupStep.back')}
294+
data-testid="wallet-setup-step-btn-back"
288295
/>
289296
{scanState === 'scanning' && !validation.error && (
290297
<Flex alignItems="center" gap="$8" h="$48">
291298
<Loader className={styles.loader} />
292-
<Text.Label color="secondary">{i18n.t('paperWallet.scanShieldedMessage.lookingForWallet')}</Text.Label>
299+
<Text.Label color="secondary" data-testid={'loader-label'}>
300+
{i18n.t('paperWallet.scanShieldedMessage.lookingForWallet')}
301+
</Text.Label>
293302
</Flex>
294303
)}
295304
{!!validation.error && (
296305
<Flex alignItems="center" gap="$8" h="$48">
297-
<WarningIcon width={24} height={24} />
306+
<WarningIcon width={24} height={24} data-testid={'error-icon'} />
298307
<Flex flexDirection="column">
299-
<Text.Body.Small color="secondary" weight="$bold">
308+
<Text.Body.Small color="secondary" weight="$bold" data-testid={'error-title'}>
300309
{validation.error.title}
301310
</Text.Body.Small>
302-
<Text.Label color="secondary">{validation.error.description}</Text.Label>
311+
<Text.Label color="secondary" data-testid={'error-description'}>
312+
{validation.error.description}
313+
</Text.Label>
303314
</Flex>
304315
</Flex>
305316
)}

‎apps/browser-extension-wallet/src/views/browser-view/features/send-transaction/components/SendTransactionDrawer/AddressFormFooter.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ export const AddressFormFooter = withAddressBookContext(() => {
3838
disabled={!addressToEdit.name || !addressToEdit.address}
3939
onClick={() => onFormSubmit()}
4040
>
41-
Save
41+
{t('browserView.transaction.send.footer.save')}
4242
</Button>
4343
<Button size="large" block className={styles.cancel} onClick={() => setPrevSection()}>
4444
{t('browserView.transaction.send.footer.cancel')}

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

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
import ScanYourPrivateQrCodePage from '../../elements/onboarding/ScanYourPrivateQrCodePage';
2+
import { expect } from 'chai';
3+
import { t } from '../../utils/translationService';
4+
import OnboardingCommonAssert from './onboardingCommonAssert';
5+
import { TimelineSteps } from '../../enums/Onboarding';
6+
7+
class ScanYourPrivateQrCodePageAssert extends OnboardingCommonAssert {
8+
async assertSeeScanYourPrivateQrCodePage(permission: 'granted' | 'denied' | 'prompted') {
9+
await this.assertSeeStepTitle(await t('paperWallet.scanShieldedMessage.title'));
10+
const expectedDescription = (await t('paperWallet.scanShieldedMessage.description'))
11+
.replace('<strong>', '')
12+
.replace('</strong>', '');
13+
await this.assertSeeStepSubtitle(expectedDescription);
14+
await this.assertSeeActiveStepOnProgressTimeline(TimelineSteps.RECOVERY_SETUP);
15+
16+
if (permission === 'granted') {
17+
await ScanYourPrivateQrCodePage.cameraPreviewBox.waitForDisplayed();
18+
await ScanYourPrivateQrCodePage.loaderImage.waitForDisplayed();
19+
await ScanYourPrivateQrCodePage.loaderLabel.waitForDisplayed();
20+
expect(await ScanYourPrivateQrCodePage.loaderLabel.getText()).to.equal(
21+
await t('paperWallet.scanShieldedMessage.lookingForWallet')
22+
);
23+
}
24+
25+
if (permission === 'denied') {
26+
await ScanYourPrivateQrCodePage.sadEmojiIcon.waitForDisplayed();
27+
await ScanYourPrivateQrCodePage.cameraAccessBlockedLabel.waitForDisplayed();
28+
expect(await ScanYourPrivateQrCodePage.cameraAccessBlockedLabel.getText()).to.equal(
29+
await t('paperWallet.scanShieldedMessage.cameraAccessBlocked')
30+
);
31+
}
32+
33+
if (permission === 'prompted') {
34+
await ScanYourPrivateQrCodePage.cameraIcon.waitForDisplayed();
35+
await ScanYourPrivateQrCodePage.cameraAccessPromptLabel.waitForDisplayed();
36+
expect(await ScanYourPrivateQrCodePage.cameraAccessPromptLabel.getText()).to.equal(
37+
await t('paperWallet.scanShieldedMessage.waitingForCameraAccess')
38+
);
39+
}
40+
41+
await this.assertSeeBackButton();
42+
}
43+
}
44+
45+
export default new ScanYourPrivateQrCodePageAssert();

‎packages/e2e-tests/src/elements/onboarding/ScanYourPrivateQrCodePage.ts

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
/* eslint-disable no-undef */
2+
import { ChainablePromiseElement } from 'webdriverio';
3+
import CommonOnboardingElements from './commonOnboardingElements';
4+
5+
class ScanYourPrivateQrCodePage extends CommonOnboardingElements {
6+
private SAD_EMOJI_ICON = '[data-testid="sad-emoji-icon"]';
7+
private CAMERA_ACCESS_BLOCKED_LABEL = '[data-testid="camera-access-blocked-label"]';
8+
private CAMERA_ICON = '[data-testid="camera-icon"]';
9+
private CAMERA_ACCESS_PROMPT_LABEL = '[data-testid="camera-access-prompt-label"]';
10+
private CAMERA_PREVIEW_BOX = '[data-testid="camera-preview-box"]';
11+
private LOADER_IMAGE = '[data-testid="loader-image"]';
12+
private LOADER_LABEL = '[data-testid="loader-label"]';
13+
14+
get sadEmojiIcon(): ChainablePromiseElement<WebdriverIO.Element> {
15+
return $(this.SAD_EMOJI_ICON);
16+
}
17+
18+
get cameraAccessBlockedLabel(): ChainablePromiseElement<WebdriverIO.Element> {
19+
return $(this.CAMERA_ACCESS_BLOCKED_LABEL);
20+
}
21+
22+
get cameraIcon(): ChainablePromiseElement<WebdriverIO.Element> {
23+
return $(this.CAMERA_ICON);
24+
}
25+
26+
get cameraAccessPromptLabel(): ChainablePromiseElement<WebdriverIO.Element> {
27+
return $(this.CAMERA_ACCESS_PROMPT_LABEL);
28+
}
29+
30+
get cameraPreviewBox(): ChainablePromiseElement<WebdriverIO.Element> {
31+
return $(this.CAMERA_PREVIEW_BOX);
32+
}
33+
34+
get loaderImage(): ChainablePromiseElement<WebdriverIO.Element> {
35+
return $(this.LOADER_IMAGE);
36+
}
37+
38+
get loaderLabel(): ChainablePromiseElement<WebdriverIO.Element> {
39+
return $(this.LOADER_LABEL);
40+
}
41+
}
42+
43+
export default new ScanYourPrivateQrCodePage();

‎packages/e2e-tests/src/features/OnboardingRestorePaperWallet.feature

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
@OnboardingRestorePaperWallet @Onboarding @Testnet @Mainnet
2+
Feature: Onboarding - Paper Wallet - Restore wallet
3+
4+
@LW-11168
5+
Scenario: Onboarding - Restore - Choose a recovery method - Paper Wallet - click "Next" button
6+
When I click "Restore" button on wallet setup page
7+
And I select "Paper wallet" as a recovery method
8+
And I click "Next" button during wallet setup
9+
Then "Scan your private QR code" page is displayed with camera access permission set as "prompted"
10+
11+
@LW-11169
12+
Scenario: Onboarding - Restore - Choose a recovery method - Paper Wallet - click "Back" button
13+
When I click "Create" button on wallet setup page
14+
And I click "Back" button during wallet setup
15+
Then "Get started" page is displayed

‎packages/e2e-tests/src/features/OnboardingRestoreWallet.part2.feature

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -111,3 +111,8 @@ Feature: Onboarding - Restore wallet
111111
Then I see clipboard tooltip with information about copying and pasting words
112112
And I click on "clipboard tooltip link"
113113
Then I see a "FAQ" article with title "Best practices for using the “copy to clipboard” and “paste from clipboard” recovery phrase features"
114+
115+
@LW-11165
116+
Scenario: Onboarding - Restore - "Choose a recovery method" page is displayed
117+
When I click "Restore" button on wallet setup page
118+
Then "Choose recovery method" page is displayed on "Restore" flow

‎packages/e2e-tests/src/hooks/beforeTagHooks.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ Before({ tags: '@pending or @Pending' }, async () => 'skipped');
2929

3030
Before(
3131
{
32-
tags: '@OnboardingCreateWallet or @Staking-initial-E2E or @OnboardingRestoreWallet or @OnboardingHardwareWallet or @TrezorOnboarding or @OnboardingCreatePaperWallet'
32+
tags: '@OnboardingCreateWallet or @Staking-initial-E2E or @OnboardingRestoreWallet or @OnboardingHardwareWallet or @TrezorOnboarding or @OnboardingCreatePaperWallet or @OnboardingRestorePaperWallet'
3333
},
3434
async () => {
3535
await extendedView.visit();

‎packages/e2e-tests/src/steps/commonSteps.ts

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,7 @@ import {
5050
} from '../fixture/walletRepositoryInitializer';
5151
import MainLoader from '../elements/MainLoader';
5252
import Modal from '../elements/modal';
53+
import { setCameraAccessPermission } from '../utils/browserPermissionsUtils';
5354

5455
Given(/^Lace is ready for test$/, async () => {
5556
await MainLoader.waitUntilLoaderDisappears();
@@ -425,3 +426,12 @@ Then(
425426
When(/^I wait for main loader to disappear$/, async () => {
426427
await MainLoader.waitUntilLoaderDisappears();
427428
});
429+
430+
// FIXME: does not work while executed on CI
431+
When(
432+
/^Set camera access permission: (granted|denied|prompted)$/,
433+
async (permission: 'granted' | 'denied' | 'prompted') => {
434+
await setCameraAccessPermission(permission);
435+
await browser.refresh();
436+
}
437+
);

‎packages/e2e-tests/src/steps/onboardingSteps.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@ import SecureYourPaperWalletPageAssert from '../assert/onboarding/SecureYourPape
3434
import SecureYourPaperWalletPage from '../elements/onboarding/SecureYourPaperWalletPage';
3535
import SaveYourPaperWalletPageAssert from '../assert/onboarding/SaveYourPaperWalletPageAssert';
3636
import SaveYourPaperWalletPage from '../elements/onboarding/SaveYourPaperWalletPage';
37+
import ScanYourPrivateQrCodePageAssert from '../assert/onboarding/ScanYourPrivateQrCodePageAssert';
3738

3839
const mnemonicWords: string[] = getTestWallet(TestWalletName.TestAutomationWallet).mnemonic ?? [];
3940
const invalidMnemonicWords: string[] = getTestWallet(TestWalletName.InvalidMnemonic).mnemonic ?? [];
@@ -541,3 +542,10 @@ When(
541542
await SaveYourPaperWalletPage.clickOnButton(button);
542543
}
543544
);
545+
546+
Then(
547+
/^"Scan your private QR code" page is displayed with camera access permission set as "(granted|denied|prompted)"$/,
548+
async (permission: 'granted' | 'denied' | 'prompted') => {
549+
await ScanYourPrivateQrCodePageAssert.assertSeeScanYourPrivateQrCodePage(permission);
550+
}
551+
);

‎packages/e2e-tests/src/utils/browserPermissionsUtils.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,7 @@
11
export const setClipboardReadPermission = async (state: 'denied' | 'granted' | 'prompted'): Promise<void> => {
22
await driver.setPermissions({ name: 'clipboard-read' }, state);
33
};
4+
5+
export const setCameraAccessPermission = async (state: 'denied' | 'granted' | 'prompted'): Promise<void> => {
6+
await driver.setPermissions({ name: 'camera' }, state);
7+
};

0 commit comments

Comments
 (0)