Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

refactor(e2e): Renames core playwright object - page #15938

Open
wants to merge 1 commit into
base: develop
Choose a base branch
from
Open

refactor(e2e): Renames core playwright object - page #15938

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions packages/suite-desktop-core/e2e/support/analytics.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,11 @@ import { Requests, EventPayload } from '@trezor/suite-web/e2e/support/types';
import { urlSearchParams } from '@trezor/suite/src/utils/suite/metadata';

export class AnalyticsFixture {
private window: Page;
private page: Page;
requests: Requests = [];

constructor(window: Page) {
this.window = window;
constructor(page: Page) {
this.page = page;
}

//TODO: #15811 To be refactored
Expand All @@ -25,7 +25,7 @@ export class AnalyticsFixture {

//TODO: #15811 To be refactored
async interceptAnalytics() {
await this.window.route('**://data.trezor.io/suite/log/**', route => {
await this.page.route('**://data.trezor.io/suite/log/**', route => {
const url = route.request().url();
const params = urlSearchParams(url);
this.requests.push(params);
Expand Down
4 changes: 2 additions & 2 deletions packages/suite-desktop-core/e2e/support/bridge.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,6 @@ export const expectBridgeToBeStopped = async (request: APIRequestContext) => {
// Bridge should be ready to check `/status` endpoint.
export const waitForAppToBeInitialized = async (suite: any) =>
await Promise.race([
expect(suite.window.getByTestId('@welcome/title')).toBeVisible(),
expect(suite.window.getByTestId('@dashboard/graph')).toBeVisible(),
expect(suite.page.getByTestId('@welcome/title')).toBeVisible(),
expect(suite.page.getByTestId('@dashboard/graph')).toBeVisible(),
]);
53 changes: 26 additions & 27 deletions packages/suite-desktop-core/e2e/support/fixtures.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
/* eslint-disable react-hooks/rules-of-hooks */
import { test as base, ElectronApplication, Page } from '@playwright/test';
import { test as base, Page } from '@playwright/test';

import {
SetupEmu,
Expand All @@ -23,8 +23,8 @@ type Fixtures = {
emulatorSetupConf: SetupEmu;
apiURL: string;
trezorUserEnvLink: TrezorUserEnvLinkClass;
appContext: ElectronApplication | undefined;
window: Page;
electronWindow: Page | undefined;
page: Page;
dashboardPage: DashboardActions;
settingsPage: SettingsActions;
suiteGuidePage: SuiteGuide;
Expand All @@ -44,7 +44,7 @@ const test = base.extend<Fixtures>({
trezorUserEnvLink: async ({}, use) => {
await use(TrezorUserEnvLink);
},
appContext: async (
electronWindow: async (
{
trezorUserEnvLink,
startEmulator,
Expand All @@ -71,7 +71,7 @@ const test = base.extend<Fixtures>({
colorScheme,
videoFolder: testInfo.outputDir,
});
await use(suite.electronApp);
await use(suite.window);
await suite.electronApp.close(); // Ensure cleanup after tests
} else {
if (startEmulator) {
Expand All @@ -80,14 +80,13 @@ const test = base.extend<Fixtures>({
await use(undefined);
}
},
window: async ({ appContext, page }, use, testInfo) => {
if (appContext) {
await page.close(); // Close the default chromium page
const window = await appContext.firstWindow();
await window.context().tracing.start({ screenshots: true, snapshots: true });
await use(window);
page: async ({ electronWindow, page: webPage }, use, testInfo) => {
if (electronWindow) {
await webPage.close(); // Close the default chromium page
await electronWindow.context().tracing.start({ screenshots: true, snapshots: true });
await use(electronWindow);
const tracePath = `${testInfo.outputDir}/trace.electron.zip`;
await window.context().tracing.stop({ path: tracePath });
await electronWindow.context().tracing.stop({ path: tracePath });
testInfo.attachments.push({
name: 'trace',
path: tracePath,
Expand All @@ -99,40 +98,40 @@ const test = base.extend<Fixtures>({
contentType: 'video/webm',
});
} else {
await page.context().addInitScript(() => {
await webPage.context().addInitScript(() => {
// Tells the app to attach Redux Store to window object. packages/suite-web/src/support/useCypress.ts
window.Playwright = true;
});
await page.goto('./');
await use(page);
await webPage.goto('./');
await use(webPage);
}
},
dashboardPage: async ({ window }, use) => {
const dashboardPage = new DashboardActions(window);
dashboardPage: async ({ page }, use) => {
const dashboardPage = new DashboardActions(page);
await use(dashboardPage);
},
settingsPage: async ({ window, apiURL }, use) => {
const settingsPage = new SettingsActions(window, apiURL);
settingsPage: async ({ page, apiURL }, use) => {
const settingsPage = new SettingsActions(page, apiURL);
await use(settingsPage);
},
suiteGuidePage: async ({ window }, use) => {
const suiteGuidePage = new SuiteGuide(window);
suiteGuidePage: async ({ page }, use) => {
const suiteGuidePage = new SuiteGuide(page);
await use(suiteGuidePage);
},
walletPage: async ({ window }, use) => {
const walletPage = new WalletActions(window);
walletPage: async ({ page }, use) => {
const walletPage = new WalletActions(page);
await use(walletPage);
},
onboardingPage: async ({ window, emulatorStartConf }, use, testInfo) => {
onboardingPage: async ({ page, emulatorStartConf }, use, testInfo) => {
const onboardingPage = new OnboardingActions(
window,
page,
emulatorStartConf.model ?? TrezorUserEnvLink.defaultModel,
testInfo,
);
await use(onboardingPage);
},
analytics: async ({ window }, use) => {
const analytics = new AnalyticsFixture(window);
analytics: async ({ page }, use) => {
const analytics = new AnalyticsFixture(page);
await use(analytics);
},
});
Expand Down
30 changes: 15 additions & 15 deletions packages/suite-desktop-core/e2e/support/pageActions/dashboardActions.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,32 +3,32 @@ import { Locator, Page, expect } from '@playwright/test';
import { NetworkSymbol } from '@suite-common/wallet-config';

export class DashboardActions {
private readonly window: Page;
private readonly page: Page;
readonly dashboardMenuButton: Locator;
readonly discoveryHeader: Locator;
readonly discoveryBar: Locator;
readonly dashboardGraph: Locator;
readonly deviceSwitchingOpenButton: Locator;
readonly modal: Locator;
readonly walletAtIndex = (index: number) =>
this.window.getByTestId(`@switch-device/wallet-on-index/${index}`);
this.page.getByTestId(`@switch-device/wallet-on-index/${index}`);
readonly walletAtIndexEjectButton = (index: number) =>
this.window.getByTestId(`@switch-device/wallet-on-index/${index}/eject-button`);
this.page.getByTestId(`@switch-device/wallet-on-index/${index}/eject-button`);
readonly confirmDeviceEjectButton: Locator;
readonly addStandardWalletButton: Locator;
readonly balanceOfNetwork = (symbol: NetworkSymbol) =>
this.window.getByTestId(`@wallet/coin-balance/value-${symbol}`);

constructor(window: Page) {
this.window = window;
this.dashboardMenuButton = this.window.getByTestId('@suite/menu/suite-index');
this.discoveryHeader = this.window.getByRole('heading', { name: 'Dashboard' });
this.discoveryBar = this.window.getByTestId('@wallet/discovery-progress-bar');
this.dashboardGraph = this.window.getByTestId('@dashboard/graph');
this.deviceSwitchingOpenButton = this.window.getByTestId('@menu/switch-device');
this.modal = this.window.getByTestId('@modal');
this.confirmDeviceEjectButton = this.window.getByTestId('@switch-device/eject');
this.addStandardWalletButton = this.window.getByTestId('@switch-device/add-wallet-button');
this.page.getByTestId(`@wallet/coin-balance/value-${symbol}`);

constructor(page: Page) {
this.page = page;
this.dashboardMenuButton = this.page.getByTestId('@suite/menu/suite-index');
this.discoveryHeader = this.page.getByRole('heading', { name: 'Dashboard' });
this.discoveryBar = this.page.getByTestId('@wallet/discovery-progress-bar');
this.dashboardGraph = this.page.getByTestId('@dashboard/graph');
this.deviceSwitchingOpenButton = this.page.getByTestId('@menu/switch-device');
this.modal = this.page.getByTestId('@modal');
this.confirmDeviceEjectButton = this.page.getByTestId('@switch-device/eject');
this.addStandardWalletButton = this.page.getByTestId('@switch-device/add-wallet-button');
}

async navigateTo() {
Expand Down
24 changes: 12 additions & 12 deletions packages/suite-desktop-core/e2e/support/pageActions/onboardingActions.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,29 +20,29 @@ export class OnboardingActions {
isModelWithSecureElement = () => ['T2B1', 'T3T1'].includes(this.model);

constructor(
public window: Page,
public page: Page,
model: Model,
testInfo: TestInfo,
) {
this.model = model;
this.testInfo = testInfo;
this.welcomeTitle = this.window.getByTestId('@welcome/title');
this.analyticsHeading = this.window.getByTestId('@analytics/consent/heading');
this.analyticsContinueButton = this.window.getByTestId('@analytics/continue-button');
this.onboardingContinueButton = this.window.getByTestId('@onboarding/exit-app-button');
this.onboardingViewOnlySkipButton = this.window.getByTestId('@onboarding/viewOnly/skip');
this.viewOnlyTooltipGotItButton = this.window.getByTestId('@viewOnlyTooltip/gotIt');
this.connectDevicePrompt = this.window.getByTestId('@connect-device-prompt');
this.authenticityStartButton = this.window.getByTestId('@authenticity-check/start-button');
this.authenticityContinueButton = this.window.getByTestId(
this.welcomeTitle = this.page.getByTestId('@welcome/title');
this.analyticsHeading = this.page.getByTestId('@analytics/consent/heading');
this.analyticsContinueButton = this.page.getByTestId('@analytics/continue-button');
this.onboardingContinueButton = this.page.getByTestId('@onboarding/exit-app-button');
this.onboardingViewOnlySkipButton = this.page.getByTestId('@onboarding/viewOnly/skip');
this.viewOnlyTooltipGotItButton = this.page.getByTestId('@viewOnlyTooltip/gotIt');
this.connectDevicePrompt = this.page.getByTestId('@connect-device-prompt');
this.authenticityStartButton = this.page.getByTestId('@authenticity-check/start-button');
this.authenticityContinueButton = this.page.getByTestId(
'@authenticity-check/continue-button',
);
}

async optionallyDismissFwHashCheckError() {
await expect(this.welcomeTitle).toBeVisible({ timeout: 10000 });
// dismisses the error modal only if it appears (handle it async in parallel, not necessary to block the rest of the flow)
this.window
this.page
.$('[data-testid="@device-compromised/back-button"]')
.then(dismissFwHashCheckButton => dismissFwHashCheckButton?.click());
}
Expand All @@ -67,7 +67,7 @@ export class OnboardingActions {
// Desktop starts with already disabled firmware hash check. Web needs to disable it.
await expect(this.welcomeTitle).toBeVisible({ timeout: 10000 });
// eslint-disable-next-line @typescript-eslint/no-shadow
await this.window.evaluate(SuiteActions => {
await this.page.evaluate(SuiteActions => {
window.store.dispatch({
type: SuiteActions.DEVICE_FIRMWARE_HASH_CHECK,
payload: { isDisabled: true },
Expand Down
68 changes: 34 additions & 34 deletions packages/suite-desktop-core/e2e/support/pageActions/settingsActions.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ const backgroundImages = {
};

export class SettingsActions {
private readonly window: Page;
private readonly page: Page;
private readonly apiURL: string;
private readonly TIMES_CLICK_TO_SET_DEBUG_MODE = 5;
readonly settingsMenuButton: Locator;
Expand All @@ -59,56 +59,56 @@ export class SettingsActions {
readonly pinSubmitButton: Locator;
//coin Advance settings
readonly networkButton = (symbol: NetworkSymbol) =>
this.window.getByTestId(`@settings/wallet/network/${symbol}`);
this.page.getByTestId(`@settings/wallet/network/${symbol}`);
readonly networkSymbolAdvanceSettingsButton = (symbol: NetworkSymbol) =>
this.window.getByTestId(`@settings/wallet/network/${symbol}/advance`);
this.page.getByTestId(`@settings/wallet/network/${symbol}/advance`);
readonly coinBackendSelector: Locator;
readonly coinBackendSelectorOption = (backend: BackendType) =>
this.window.getByTestId(`@settings/advance/${backend}`);
this.page.getByTestId(`@settings/advance/${backend}`);
readonly coinAddressInput: Locator;
readonly coinAdvanceSettingSaveButton: Locator;
readonly themeInput: Locator;
readonly themeInputOption = (theme: Theme) =>
this.window.getByTestId(`@theme/color-scheme-select/option/${theme}`);
this.page.getByTestId(`@theme/color-scheme-select/option/${theme}`);
readonly languageInput: Locator;
readonly languageInputOption = (language: Language) =>
this.window.getByTestId(`@settings/language-select/option/${language}`);
readonly pinInput = (index: number) => this.window.getByTestId(`@pin/input/${index}`);
this.page.getByTestId(`@settings/language-select/option/${language}`);
readonly pinInput = (index: number) => this.page.getByTestId(`@pin/input/${index}`);

constructor(window: Page, apiURL: string) {
this.window = window;
constructor(page: Page, apiURL: string) {
this.page = page;
this.apiURL = apiURL;
this.settingsMenuButton = this.window.getByTestId('@suite/menu/settings');
this.settingsHeader = this.window.getByTestId('@settings/menu/title');
this.debugTabButton = this.window.getByTestId('@settings/menu/debug');
this.applicationTabButton = this.window.getByTestId('@settings/menu/general');
this.deviceTabButton = this.window.getByTestId('@settings/menu/device');
this.coinsTabButton = this.window.getByTestId('@settings/menu/wallet');
this.earlyAccessJoinButton = this.window.getByTestId('@settings/early-access-join-button');
this.earlyAccessConfirmCheck = this.window.getByTestId(
this.settingsMenuButton = this.page.getByTestId('@suite/menu/settings');
this.settingsHeader = this.page.getByTestId('@settings/menu/title');
this.debugTabButton = this.page.getByTestId('@settings/menu/debug');
this.applicationTabButton = this.page.getByTestId('@settings/menu/general');
this.deviceTabButton = this.page.getByTestId('@settings/menu/device');
this.coinsTabButton = this.page.getByTestId('@settings/menu/wallet');
this.earlyAccessJoinButton = this.page.getByTestId('@settings/early-access-join-button');
this.earlyAccessConfirmCheck = this.page.getByTestId(
'@settings/early-access-confirm-check',
);
this.earlyAccessConfirmButton = this.window.getByTestId(
this.earlyAccessConfirmButton = this.page.getByTestId(
'@settings/early-access-confirm-button',
);
this.earlyAccessSkipButton = this.window.getByTestId('@settings/early-access-skip-button');
this.settingsCloseButton = this.window.getByTestId('@settings/menu/close');
this.modal = this.window.getByTestId('@modal');
this.deviceLabelInput = this.window.getByTestId('@settings/device/label-input');
this.deviceLabelSubmit = this.window.getByTestId('@settings/device/label-submit');
this.confirmOnDevicePrompt = this.window.getByTestId('@prompts/confirm-on-device');
this.homescreenGalleryButton = this.window.getByTestId(
this.earlyAccessSkipButton = this.page.getByTestId('@settings/early-access-skip-button');
this.settingsCloseButton = this.page.getByTestId('@settings/menu/close');
this.modal = this.page.getByTestId('@modal');
this.deviceLabelInput = this.page.getByTestId('@settings/device/label-input');
this.deviceLabelSubmit = this.page.getByTestId('@settings/device/label-submit');
this.confirmOnDevicePrompt = this.page.getByTestId('@prompts/confirm-on-device');
this.homescreenGalleryButton = this.page.getByTestId(
'@settings/device/homescreen-gallery',
);
this.notificationSuccessToast = this.window.getByTestId('@toast/settings-applied').first();
this.coinBackendSelector = this.window.getByTestId('@settings/advance/select-type/input');
this.coinAddressInput = this.window.getByTestId('@settings/advance/url');
this.coinAdvanceSettingSaveButton = this.window.getByTestId(
this.notificationSuccessToast = this.page.getByTestId('@toast/settings-applied').first();
this.coinBackendSelector = this.page.getByTestId('@settings/advance/select-type/input');
this.coinAddressInput = this.page.getByTestId('@settings/advance/url');
this.coinAdvanceSettingSaveButton = this.page.getByTestId(
'@settings/advance/button/save',
);
this.themeInput = this.window.getByTestId('@theme/color-scheme-select/input');
this.languageInput = this.window.getByTestId('@settings/language-select/input');
this.pinSubmitButton = this.window.getByTestId('@pin/submit-button');
this.themeInput = this.page.getByTestId('@theme/color-scheme-select/input');
this.languageInput = this.page.getByTestId('@settings/language-select/input');
this.pinSubmitButton = this.page.getByTestId('@pin/submit-button');
}

async navigateTo() {
Expand Down Expand Up @@ -205,12 +205,12 @@ export class SettingsActions {
async changeDeviceBackground(image: keyof typeof backgroundImages) {
await test.step('Change display background image', async () => {
// To solve the flakiness of the test, we need to wait for the image to load
const buttonImageLoad = this.window.waitForResponse(
const buttonImageLoad = this.page.waitForResponse(
`${this.apiURL}${backgroundImages[image].path}`,
);
await this.homescreenGalleryButton.click();
await buttonImageLoad;
await this.window.getByTestId(backgroundImages[image].locator).click();
await this.page.getByTestId(backgroundImages[image].locator).click();
await expect(this.confirmOnDevicePrompt).toBeVisible();
await TrezorUserEnvLink.pressYes();
await this.confirmOnDevicePrompt.waitFor({ state: 'detached' });
Expand Down
Loading
Loading