From ecbf01e82c38e421d05e59004f93f4962e20d74b Mon Sep 17 00:00:00 2001 From: Martin Vere Cihlar Date: Thu, 12 Dec 2024 08:20:29 +0100 Subject: [PATCH] feat(e2e): Converts cy to pw test suite t2t1-settings (#15922) * feat(e2e): Converts cy to pw test suite t2t1-settings * fix(e2e): Resolving type error --- .../e2e/support/fixtures.ts | 4 +- .../support/pageActions/settingsActions.ts | 50 ++++++- .../settings/t2b1-device-settings.test.ts | 54 ++----- .../settings/t2t1-device-settings.test.ts | 66 +++++++++ .../settings/t2t1-device-settings.test.ts | 140 ------------------ 5 files changed, 130 insertions(+), 184 deletions(-) create mode 100644 packages/suite-desktop-core/e2e/tests/settings/t2t1-device-settings.test.ts delete mode 100644 packages/suite-web/e2e/tests/settings/t2t1-device-settings.test.ts diff --git a/packages/suite-desktop-core/e2e/support/fixtures.ts b/packages/suite-desktop-core/e2e/support/fixtures.ts index ec935a7af32..86cb1e92b0d 100644 --- a/packages/suite-desktop-core/e2e/support/fixtures.ts +++ b/packages/suite-desktop-core/e2e/support/fixtures.ts @@ -111,8 +111,8 @@ const test = base.extend({ const dashboardPage = new DashboardActions(window); await use(dashboardPage); }, - settingsPage: async ({ window }, use) => { - const settingsPage = new SettingsActions(window); + settingsPage: async ({ window, apiURL }, use) => { + const settingsPage = new SettingsActions(window, apiURL); await use(settingsPage); }, suiteGuidePage: async ({ window }, use) => { diff --git a/packages/suite-desktop-core/e2e/support/pageActions/settingsActions.ts b/packages/suite-desktop-core/e2e/support/pageActions/settingsActions.ts index c3adb3ba763..d24d4e800cf 100644 --- a/packages/suite-desktop-core/e2e/support/pageActions/settingsActions.ts +++ b/packages/suite-desktop-core/e2e/support/pageActions/settingsActions.ts @@ -2,6 +2,7 @@ import { Locator, Page, test } from '@playwright/test'; import { BackendType, NetworkSymbol } from '@suite-common/wallet-config'; import { capitalizeFirstLetter } from '@trezor/utils'; +import { TrezorUserEnvLink } from '@trezor/trezor-user-env-link'; import { expect } from '../customMatchers'; @@ -19,8 +20,20 @@ const languageMap = { es: 'Español', }; +const backgroundImages = { + original_t2t1: { + path: 'static/images/homescreens/COLOR_240x240/original_t2t1.jpg', + locator: '@modal/gallery/color_240x240/original_t2t1', + }, + circleweb: { + path: 'static/images/homescreens/BW_64x128/circleweb.png', + locator: '@modal/gallery/bw_64x128/circleweb', + }, +}; + export class SettingsActions { private readonly window: Page; + private readonly apiURL: string; private readonly TIMES_CLICK_TO_SET_DEBUG_MODE = 5; readonly settingsMenuButton: Locator; readonly settingsHeader: Locator; @@ -34,6 +47,10 @@ export class SettingsActions { readonly earlyAccessSkipButton: Locator; readonly settingsCloseButton: Locator; readonly modal: Locator; + readonly deviceLabelInput: Locator; + readonly deviceLabelSubmit: Locator; + readonly confirmOnDevicePrompt: Locator; + readonly homescreenGalleryButton: Locator; //coin Advance settings readonly coinNetworkButton = (coin: NetworkSymbol) => this.window.getByTestId(`@settings/wallet/network/${coin}`); @@ -51,8 +68,9 @@ export class SettingsActions { readonly languageInputOption = (language: Language) => this.window.getByTestId(`@settings/language-select/option/${language}`); - constructor(window: Page) { + constructor(window: Page, apiURL: string) { this.window = window; + 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'); @@ -69,6 +87,12 @@ export class SettingsActions { 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( + '@settings/device/homescreen-gallery', + ); //coin Advance settings this.coinBackendSelector = this.window.getByTestId('@settings/advance/select-type/input'); this.coinAddressInput = this.window.getByTestId('@settings/advance/url'); @@ -159,4 +183,28 @@ export class SettingsActions { }).toPass({ timeout: 10_000 }); }); } + + async changeDeviceName(newDeviceName: string) { + await this.deviceLabelInput.clear(); + await this.deviceLabelInput.fill(newDeviceName); + await this.deviceLabelSubmit.click(); + await expect(this.confirmOnDevicePrompt).toBeVisible(); + await TrezorUserEnvLink.pressYes(); + await this.confirmOnDevicePrompt.waitFor({ state: 'detached' }); + } + + 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( + `${this.apiURL}${backgroundImages[image].path}`, + ); + await this.homescreenGalleryButton.click(); + await buttonImageLoad; + await this.window.getByTestId(backgroundImages[image].locator).click(); + await expect(this.confirmOnDevicePrompt).toBeVisible(); + await TrezorUserEnvLink.pressYes(); + await this.confirmOnDevicePrompt.waitFor({ state: 'detached' }); + }); + } } diff --git a/packages/suite-desktop-core/e2e/tests/settings/t2b1-device-settings.test.ts b/packages/suite-desktop-core/e2e/tests/settings/t2b1-device-settings.test.ts index 69d911a2189..c736c1196ef 100644 --- a/packages/suite-desktop-core/e2e/tests/settings/t2b1-device-settings.test.ts +++ b/packages/suite-desktop-core/e2e/tests/settings/t2b1-device-settings.test.ts @@ -15,51 +15,23 @@ test.describe.serial('T2B1 - Device settings', { tag: ['@group=settings'] }, () await settingsPage.navigateTo(); await settingsPage.deviceTabButton.click(); }); - /* - * Test case: - * 1. Navigate to settings/device screen and wait for it to load - * 2. open the firmware update modal - * 3. verify it by clicking on the close btn - * 4. change the trezor's name via its input - * 5. verify the name from top left wallet overview btn - * 6. change the device's background - * 7. change the device's rotation - */ - test('change all possible device settings', async ({ - trezorUserEnvLink, - window: page, - apiURL, - }) => { - const newDeviceName = 'TREVOR!'; - // verify firmware modal - await page.getByTestId('@settings/device/update-button').click(); - await page.getByTestId('@modal/close-button').click(); + test('change all possible device settings', async ({ settingsPage, window: page }) => { + await test.step('Verify firmware modal', async () => { + await page.getByTestId('@settings/device/update-button').click(); + await page.getByTestId('@modal/close-button').click(); + }); - // change device's name - await page.getByTestId('@settings/device/label-input').fill(newDeviceName); - await page.getByTestId('@settings/device/label-submit').click(); - await expect(page.getByTestId('@prompts/confirm-on-device')).toBeVisible(); - await trezorUserEnvLink.pressYes(); - await page.getByTestId('@prompts/confirm-on-device').waitFor({ state: 'detached' }); - - // verify the name change - await expect(page.getByTestId('@menu/device/label')).toHaveText(newDeviceName); + await test.step("Change and verify device's name", async () => { + const newDeviceName = 'TREVOR!'; + await settingsPage.changeDeviceName(newDeviceName); + await expect(page.getByTestId('@menu/device/label')).toHaveText(newDeviceName); + }); - // change background - // On Web the there is instability, Playwright keeps clicking the button too soon. - const buttonImageLoad = page.waitForResponse( - `${apiURL}static/images/homescreens/BW_64x128/circleweb.png`, - ); - await page.getByTestId('@settings/device/homescreen-gallery').click(); - await buttonImageLoad; - await page.getByTestId(`@modal/gallery/bw_64x128/circleweb`).click(); - await expect(page.getByTestId('@prompts/confirm-on-device')).toBeVisible(); - await trezorUserEnvLink.pressYes(); - await page.getByTestId('@prompts/confirm-on-device').waitFor({ state: 'detached' }); + await settingsPage.changeDeviceBackground('circleweb'); }); - test('wipe device', async ({ window: page, trezorUserEnvLink }) => { + test('Device Wipe', async ({ window: page, trezorUserEnvLink }) => { await page.getByTestId('@settings/device/open-wipe-modal-button').click(); await page.getByTestId('@wipe/checkbox-1').click(); await page.getByTestId('@wipe/checkbox-2').click(); @@ -68,7 +40,7 @@ test.describe.serial('T2B1 - Device settings', { tag: ['@group=settings'] }, () //TODO: Verification? }); - test('backup in settings', async ({ window: page }) => { + test('Backup in settings', async ({ window: page }) => { await expect(page.getByTestId('@settings/device/check-seed-button')).toBeEnabled(); await page.getByTestId('@settings/device/failed-backup-row').waitFor({ state: 'detached' }); await page.getByTestId('@settings/device/check-seed-button').click(); diff --git a/packages/suite-desktop-core/e2e/tests/settings/t2t1-device-settings.test.ts b/packages/suite-desktop-core/e2e/tests/settings/t2t1-device-settings.test.ts new file mode 100644 index 00000000000..6a8f441c60f --- /dev/null +++ b/packages/suite-desktop-core/e2e/tests/settings/t2t1-device-settings.test.ts @@ -0,0 +1,66 @@ +import { test, expect } from '../../support/fixtures'; + +test.describe('T2T1 - Device settings', { tag: ['@group=settings'] }, () => { + test.use({ emulatorStartConf: { wipe: true, model: 'T2T1' } }); + test.beforeEach(async ({ onboardingPage, settingsPage }) => { + await onboardingPage.completeOnboarding(); + await settingsPage.navigateTo(); + await settingsPage.deviceTabButton.click(); + }); + + test('change all possible device settings', async ({ + window: page, + settingsPage, + trezorUserEnvLink, + }) => { + await test.step('Verify firmware modal', async () => { + await page.getByTestId('@settings/device/update-button').click(); + await page.getByTestId('@modal/close-button').click(); + }); + + await test.step("Change and verify device's name", async () => { + const newDeviceName = 'TREVOR!'; + await settingsPage.changeDeviceName(newDeviceName); + await expect(page.getByTestId('@menu/device/label')).toHaveText(newDeviceName); + }); + + await test.step('Change display rotation', async () => { + await page.getByTestId('select-bar/East').click(); + await expect(page.getByTestId('@prompts/confirm-on-device')).toBeVisible(); + await trezorUserEnvLink.pressYes(); + await page.getByTestId('@prompts/confirm-on-device').waitFor({ state: 'detached' }); + }); + }); + + test('Device Wipe', async ({ window: page, trezorUserEnvLink }) => { + await page.getByTestId('@settings/device/open-wipe-modal-button').click(); + await page.getByTestId('@wipe/checkbox-1').click(); + await page.getByTestId('@wipe/checkbox-2').click(); + await page.getByTestId('@wipe/wipe-button').click(); + await trezorUserEnvLink.pressYes(); + //TODO: Any verification? + }); + + test('Backup in settings', async ({ window: page }) => { + await expect(page.getByTestId('@settings/device/check-seed-button')).toBeVisible(); + await page.getByTestId('@settings/device/failed-backup-row').waitFor({ state: 'detached' }); + await page.getByTestId('@settings/device/check-seed-button').click(); + await expect(page.getByTestId('@modal')).toBeVisible(); + //TODO: Verification? Should we actually do the backup? + }); + + test('Can change homescreen background in firmware >= 2.5.4', async ({ settingsPage }) => { + await settingsPage.changeDeviceBackground('original_t2t1'); + }); + + test.describe('T2T1 - older firmware < 2.5.4', { tag: ['@group=settings'] }, () => { + test.use({ emulatorStartConf: { wipe: true, model: 'T2T1', version: '2.5.3' } }); + test('Cannot change homescreen in firmware < 2.5.4', async ({ window: page }) => { + await expect(page.getByTestId('@settings/device/homescreen-gallery')).toBeDisabled(); + await expect(page.getByTestId('@settings/device/homescreen-upload')).toBeDisabled(); + }); + }); + + // TODO: upload custom image + // TODO: set auto-lock (needs pin) +}); diff --git a/packages/suite-web/e2e/tests/settings/t2t1-device-settings.test.ts b/packages/suite-web/e2e/tests/settings/t2t1-device-settings.test.ts deleted file mode 100644 index 95ca2a9760c..00000000000 --- a/packages/suite-web/e2e/tests/settings/t2t1-device-settings.test.ts +++ /dev/null @@ -1,140 +0,0 @@ -// @group_settings -// @retry=2 - -import { onNavBar } from '../../support/pageObjects/topBarObject'; - -describe('T2T1 - Device settings', () => { - beforeEach(() => { - cy.viewport(1920, 1080).resetDb(); - cy.task('startBridge'); - }); - // TODO: cypress open: seems like entering urls (/settings/device) directly does not work anymore? - /* - * Test case: - * 1. Navigate to settings/device screen and wait for it to load - * 2. open the firmware update modal - * 3. verify it by clicking on the close btn - * 4. change the trezor's name via its input - * 5. verify the name from top left wallet overview btn - * 6. change the device's rotation - */ - it('change all possible device settings', () => { - // - // Test preparation & constants - // - const newDeviceName = 'TREVOR!'; - const editNameBtn = '@settings/device/label-submit'; - - cy.task('startEmu', { wipe: true }); - cy.task('setupEmu'); - // navigate to device settings page - cy.prefixedVisit('/'); - cy.passThroughInitialRun(); - // navigate to device settings page - onNavBar.openSettings(); - cy.getTestElement('@settings/menu/device').click(); - - // - // Test execution - // - - // verify firmware modal - cy.log('open firmware modal and close it again'); - cy.getTestElement('@settings/device/update-button') - .should('be.visible') - .click({ scrollBehavior: false }); - cy.getTestElement('@modal/close-button').click(); - - // change device's name - cy.log(`-> Filling in ${newDeviceName} as new trezor's name.`); - cy.getTestElement('@settings/device/label-input').clear(); - cy.getTestElement('@settings/device/label-input').type(newDeviceName); - cy.getTestElement(editNameBtn).should('be.enabled'); - cy.getTestElement(editNameBtn).click(); - cy.getConfirmActionOnDeviceModal(); - cy.task('pressYes'); - cy.getConfirmActionOnDeviceModal().should('not.exist'); - cy.log('-> Done.'); - - // verify the name change - cy.getTestElement('@menu/switch-device').contains(newDeviceName); - - // change display rotation - cy.log('change display rotation'); - cy.getTestElement('select-bar/East').click(); - cy.getConfirmActionOnDeviceModal(); - cy.task('pressYes'); - cy.getConfirmActionOnDeviceModal().should('not.exist'); - }); - - it('unable to change homescreen in firmware < 2.5.4', () => { - cy.task('startEmu', { wipe: true, model: 'T2T1', version: '2.5.3' }); - cy.task('setupEmu'); - - cy.prefixedVisit('/'); - cy.passThroughInitialRun(); - onNavBar.openSettings(); - cy.getTestElement('@settings/menu/device').click(); - - cy.log('Try to change device homescreen'); - cy.getTestElement('@device-settings/homescreen').scrollIntoView(); - - cy.getTestElement('@settings/device/homescreen-gallery').should('be.disabled'); - cy.getTestElement('@settings/device/homescreen-upload').should('be.disabled'); - }); - - it('able to change homescreen in firmware >= 2.5.4', () => { - cy.task('startEmu', { wipe: true, model: 'T2T1', version: '2-latest' }); - cy.task('setupEmu'); - - cy.prefixedVisit('/'); - - cy.passThroughInitialRun(); - onNavBar.openSettings(); - cy.getTestElement('@settings/menu/device').click(); - - cy.log('Try to change device homescreen'); - cy.getTestElement('@device-settings/homescreen').scrollIntoView(); - - cy.getTestElement('@settings/device/homescreen-gallery').click(); - cy.get('#original_t2t1').should('exist'); - }); - - it('backup in settings', () => { - cy.task('startEmu', { wipe: true }); - cy.task('setupEmu', { needs_backup: false }); - - // navigate to device settings page - cy.prefixedVisit('/'); - cy.passThroughInitialRun(); - onNavBar.openSettings(); - cy.getTestElement('@settings/menu/device').click(); - - cy.getTestElement('@settings/device/check-seed-button', { timeout: 10_000 }).should( - 'be.visible', - ); - cy.getTestElement('@settings/device/failed-backup-row').should('not.exist'); - cy.getTestElement('@settings/device/check-seed-button').click({ scrollBehavior: false }); - cy.getTestElement('@modal'); - }); - - it('wipe device', () => { - cy.task('startEmu', { wipe: true }); - cy.task('setupEmu'); - - // navigate to device settings page - cy.prefixedVisit('/'); - cy.passThroughInitialRun(); - onNavBar.openSettings(); - cy.getTestElement('@settings/menu/device').click(); - - cy.getTestElement('@settings/device/open-wipe-modal-button').click(); - cy.getTestElement('@wipe/checkbox-1').click(); - cy.getTestElement('@wipe/checkbox-2').click(); - cy.getTestElement('@wipe/wipe-button').click(); - cy.task('pressYes'); - }); - - // TODO: upload custom image - // TODO: set auto-lock (needs pin) -});