feat(e2e): Converts cy to pw test suite t2t1-settings

packages/suite-desktop-core/e2e/support/fixtures.ts

@@ -111,8 +111,8 @@ const test = base.extend<Fixtures>({
         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) => {

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' });
+        });
+    }
 }

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();

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)
+});