refactoring(e2e): Use viewport arg for electron and allow snapshots v…

…alidations

minor refactoring of elecotron launch methods

packages/suite-desktop-core/e2e/playwright.config.ts

@@ -22,8 +22,6 @@ const config: PlaywrightTestConfig = {
             name: PlaywrightProjects.Desktop,
             use: {},
             grepInvert: /@webOnly/,
-            //TODO: #16073 We cannot set resolution for Electron. Once solved, remove ignoreSnapshots
-            ignoreSnapshots: true,
         },
     ],
     testDir: 'tests',

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

@@ -19,7 +19,8 @@ type LaunchSuiteParams = {
     bridgeDaemon?: boolean;
     locale?: string;
     colorScheme?: 'light' | 'dark' | 'no-preference' | null | undefined;
-    videoFolder?: string;
+    videoFolder: string;
+    viewport: { width: number; height: number };
 };
 
 const formatErrorLogMessage = (data: string) => {
@@ -29,7 +30,7 @@ const formatErrorLogMessage = (data: string) => {
     return `${red}${data}${reset}`;
 };
 
-export const launchSuiteElectronApp = async (params: LaunchSuiteParams = {}) => {
+export const launchSuiteElectronApp = async (params: LaunchSuiteParams) => {
     const defaultParams = {
         rmUserData: true,
         bridgeLegacyTest: true,
@@ -38,7 +39,8 @@ export const launchSuiteElectronApp = async (params: LaunchSuiteParams = {}) =>
     const options = Object.assign(defaultParams, params);
 
     const appDir = path.join(__dirname, '../../../suite-desktop');
-    const desiredLogLevel = process.env.LOGLEVEL ?? 'error';
+    const logLevelArgument = `--log-level=${process.env.LOGLEVEL ?? 'error'}`;
+    const viewportArgument = `--width=${options.viewport.width} --height=${options.viewport.height}`;
     if (!options.bridgeDaemon) {
         // TODO: #15646 Find out why currently pw fails to see node-bridge so we default to legacy bridge.
         await TrezorUserEnvLink.startBridge(LEGACY_BRIDGE_VERSION);
@@ -49,15 +51,14 @@ export const launchSuiteElectronApp = async (params: LaunchSuiteParams = {}) =>
             path.join(appDir, './dist/app.js'),
             disableHashCheckArgument,
             showDebugMenuArgument,
-            `--log-level=${desiredLogLevel}`,
+            viewportArgument,
+            logLevelArgument,
             ...(options.bridgeLegacyTest ? ['--bridge-legacy', '--bridge-test'] : []),
             ...(options.bridgeDaemon ? ['--bridge-daemon', '--skip-new-bridge-rollout'] : []),
         ],
         colorScheme: params.colorScheme,
         locale: params.locale,
-        ...(params.videoFolder && {
-            recordVideo: { dir: params.videoFolder, size: { width: 1280, height: 720 } },
-        }),
+        recordVideo: { dir: options.videoFolder, size: options.viewport },
     });
 
     const localDataDir = await electronApp.evaluate(({ app }) => app.getPath('userData'));
@@ -98,7 +99,7 @@ export const launchSuiteElectronApp = async (params: LaunchSuiteParams = {}) =>
     return electronApp;
 };
 
-export const launchSuite = async (params: LaunchSuiteParams = {}) => {
+export const launchSuite = async (params: LaunchSuiteParams) => {
     const electronApp = await launchSuiteElectronApp(params);
     const window = await electronApp.firstWindow();
 

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

@@ -70,15 +70,7 @@ const test = base.extend<Fixtures>({
         await use(TrezorUserEnvLinkProxy);
     },
     electronWindow: async (
-        {
-            trezorUserEnvLink,
-            startEmulator,
-            setupEmulator,
-            emulatorStartConf,
-            emulatorSetupConf,
-            locale,
-            colorScheme,
-        },
+        { trezorUserEnvLink, startEmulator, setupEmulator, emulatorStartConf, emulatorSetupConf },
         use,
         testInfo,
     ) => {
@@ -96,9 +88,10 @@ const test = base.extend<Fixtures>({
 
         if (isDesktopProject(testInfo)) {
             const suite = await launchSuite({
-                locale,
-                colorScheme,
+                locale: testInfo.project.use.locale,
+                colorScheme: testInfo.project.use.colorScheme,
                 videoFolder: testInfo.outputDir,
+                viewport: testInfo.project.use.viewport!,
             });
             await use(suite.window);
             await suite.electronApp.close(); // Ensure cleanup after tests

packages/suite-desktop-core/e2e/tests/bridge-thor/spawn-bridge-daemon.test.ts

@@ -13,18 +13,23 @@ test.describe.serial('Bridge', { tag: ['@group=suite', '@desktopOnly'] }, () =>
         await trezorUserEnvLink.stopBridge();
     });
 
-    test('App in daemon mode spawns bridge', async ({ request }) => {
+    test('App in daemon mode spawns bridge', async ({ request }, testInfo) => {
         const daemonApp = await launchSuiteElectronApp({
             bridgeDaemon: true,
             bridgeLegacyTest: false,
+            videoFolder: testInfo.outputDir,
+            viewport: testInfo.project.use.viewport!,
         });
 
         await expect(async () => {
             await expectBridgeToBeRunning(request);
         }).toPass({ timeout: 3_000 });
 
         // launch UI
-        const suite = await launchSuite();
+        const suite = await launchSuite({
+            videoFolder: testInfo.outputDir,
+            viewport: testInfo.project.use.viewport!,
+        });
         const title = await suite.window.title();
         expect(title).toContain('Trezor Suite');
 

packages/suite-desktop-core/e2e/tests/bridge-thor/spawn-bridge.test.ts

@@ -18,8 +18,13 @@ test.describe.serial('Bridge', { tag: ['@group=suite', '@desktopOnly'] }, () =>
     });
 
     // #15646 This test is failing and has no values since the launchSuite starts legacy bridge in emulator anyway
-    test.skip('App spawns bundled bridge and stops it after app quit', async ({ request }) => {
-        const suite = await launchSuite();
+    test.skip('App spawns bundled bridge and stops it after app quit', async ({
+        request,
+    }, testInfo) => {
+        const suite = await launchSuite({
+            videoFolder: testInfo.outputDir,
+            viewport: testInfo.project.use.viewport!,
+        });
         const title = await suite.window.title();
         expect(title).toContain('Trezor Suite');
 
@@ -51,7 +56,10 @@ test.describe.serial('Bridge', { tag: ['@group=suite', '@desktopOnly'] }, () =>
         await trezorUserEnvLink.setupEmu({});
         await trezorUserEnvLink.startBridge(LEGACY_BRIDGE_VERSION);
 
-        const suite = await launchSuite();
+        const suite = await launchSuite({
+            videoFolder: testInfo.outputDir,
+            viewport: testInfo.project.use.viewport!,
+        });
         await suite.window.title();
 
         const devicePrompt = new DevicePromptActions(suite.window);

packages/suite-desktop-core/e2e/tests/bridge-thor/spawn-tor.test.ts

@@ -33,16 +33,21 @@ const turnOnTorInSettings = async (window: Page, shouldEnableTor = true) => {
 };
 
 test.describe.skip('Tor loading screen', { tag: ['@group=suite', '@desktopOnly'] }, () => {
-    test('Tor loading screen: happy path', async () => {
+    /* eslint-disable-next-line no-empty-pattern */
+    test('Tor loading screen: happy path', async ({}, testInfo) => {
+        const suiteArgs = {
+            videoFolder: testInfo.outputDir,
+            viewport: testInfo.project.use.viewport!,
+        };
         test.setTimeout(timeout);
 
-        let suite = await launchSuite();
+        let suite = await launchSuite(suiteArgs);
 
         await turnOnTorInSettings(suite.window);
 
         suite.electronApp.close();
 
-        suite = await launchSuite();
+        suite = await launchSuite(suiteArgs);
 
         await suite.window.waitForSelector('[data-testid="@tor-loading-screen"]', {
             state: 'visible',
@@ -53,18 +58,22 @@ test.describe.skip('Tor loading screen', { tag: ['@group=suite', '@desktopOnly']
         suite.electronApp.close();
     });
 
-    test('Tor loading screen: making sure that all the request go throw Tor', async () => {
-        test.setTimeout(timeout);
+    /* eslint-disable-next-line no-empty-pattern */
+    test('Tor loading screen: making sure that all the request go throw Tor', async ({}, testInfo) => {
+        const suiteArgs = {
+            videoFolder: testInfo.outputDir,
+            viewport: testInfo.project.use.viewport!,
+        };
 
         const networkAnalyzer = new NetworkAnalyzer();
 
-        let suite = await launchSuite();
+        let suite = await launchSuite(suiteArgs);
 
         await turnOnTorInSettings(suite.window);
 
         suite.electronApp.close();
 
-        suite = await launchSuite();
+        suite = await launchSuite(suiteArgs);
         // Start network analyzer after making sure tor is going to be running.
         networkAnalyzer.start();
 
@@ -82,16 +91,21 @@ test.describe.skip('Tor loading screen', { tag: ['@group=suite', '@desktopOnly']
         suite.electronApp.close();
     });
 
-    test('Tor loading screen: disable tor while loading', async () => {
+    /* eslint-disable-next-line no-empty-pattern */
+    test('Tor loading screen: disable tor while loading', async ({}, testInfo) => {
+        const suiteArgs = {
+            videoFolder: testInfo.outputDir,
+            viewport: testInfo.project.use.viewport!,
+        };
         test.setTimeout(timeout);
 
-        let suite = await launchSuite();
+        let suite = await launchSuite(suiteArgs);
 
         await turnOnTorInSettings(suite.window);
 
         suite.electronApp.close();
 
-        suite = await launchSuite();
+        suite = await launchSuite(suiteArgs);
 
         await suite.window.waitForSelector('[data-testid="@tor-loading-screen"]', {
             state: 'visible',