e2e improve metamask tests stability (#426)

Author: rolandmoldovan

tests/config.ts

@@ -2,7 +2,7 @@ export const TEST_CONFIG = {
   /* Retry on CI only */
   retries: process.env.CI ? 1 : 0,
   /* Parallel tests on CI only. */
-  workers: 10,
+  workers: 5,
   /* Timeout for each test */
   timeout: 120_000,
   /* Timeout for locators */

tests/support/metaMask/handleMetaMaskSnap.ts

@@ -3,7 +3,7 @@ import { getPageAndWaitForLoad } from '../template/getPageAndWaitForLoad';
 import { waitUntilStable } from '../template/waitUntilStable';
 
 const RETRY_DELAY_BASE_MS = 500;
-const CLICK_TIMEOUT_MS = 2500;
+const CLICK_TIMEOUT_MS = 6000;
 
 const sleep = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms));
 

tests/support/metaMask/waitForMetaMaskLoad.ts

@@ -1,10 +1,10 @@
 import { errors, Page } from '@playwright/test';
+import { WaitForMetaMaskLoadOptions } from '../template/types';
 import { waitUntilStable } from '../template/waitUntilStable';
 
 const DEFAULT_TIMEOUT = 10_000;
-const DEFAULT_POST_DELAY_MS = 300;
+const DEFAULT_CONCURRENCY = 3;
 
-// Core loading indicators commonly found in MetaMask screens
 const BASE_LOADING_SELECTORS: readonly string[] = [
   '.loading-logo',
   '.loading-spinner',
@@ -20,71 +20,73 @@ const BASE_LOADING_SELECTORS: readonly string[] = [
   '.spinner'
 ];
 
-type WaitForMetaMaskLoadOptions = {
-  // Per-selector timeout while waiting to become hidden (defaults to 10s).
-  selectorTimeoutMs?: number;
-  // Additional page selectors that should also be hidden before continuing.
-  extraLoadingSelectors?: string[];
-  // Milliseconds to sleep after the page looks ready (defaults to 300ms).
-  postDelayMs?: number;
-  // Skip the initial stable wait if you’ve already done it.
-  skipInitialStabilityWait?: boolean;
-};
-
-// Waits for MetaMask UI to become usable:
-// 1) (optionally) waits for DOM/network to settle
-// 2) waits for known loading indicators to disappear (best-effort)
-// 3) small post-delay to avoid flakiness on slow CI
+/**
+ * Waits for MetaMask UI to be usable:
+ * 1) (optional) wait for page stability
+ * 2) wait for known loading indicators to hide (best-effort)
+ * 3) brief post delay (conditional)
+ */
 export async function waitForMetaMaskLoad(
   page: Page,
-  options: WaitForMetaMaskLoadOptions = {}
-): Promise<Page> {
+  options: WaitForMetaMaskLoadOptions
+): Promise<void> {
   const {
     selectorTimeoutMs = DEFAULT_TIMEOUT,
     extraLoadingSelectors = [],
-    postDelayMs = DEFAULT_POST_DELAY_MS,
-    skipInitialStabilityWait = false
+    skipInitialStabilityWait = false,
+    concurrency = DEFAULT_CONCURRENCY // how many selectors to wait on in parallel
   } = options;
 
   try {
     if (!skipInitialStabilityWait) {
       await waitUntilStable(page);
     }
 
-    const selectors = [...BASE_LOADING_SELECTORS, ...extraLoadingSelectors];
+    const selectors = Array.from(
+      new Set([...BASE_LOADING_SELECTORS, ...extraLoadingSelectors])
+    );
 
-    await waitForSelectorsHidden(page, selectors, selectorTimeoutMs);
+    await waitSelectorsHiddenWithConcurrency(
+      page,
+      selectors,
+      selectorTimeoutMs,
+      concurrency
+    );
   } catch (err) {
-    // Don’t fail the test — UI might still be interactive
     const msg = err instanceof Error ? err.message : String(err);
     console.warn(`[waitForMetaMaskLoad] Non-fatal warning: ${msg}`);
   }
-
-  await page.waitForTimeout(postDelayMs);
-  return page;
 }
 
-// Wait until each selector is hidden; ignore timeouts (selector may not exist on this screen).
-async function waitForSelectorsHidden(
+async function waitSelectorsHiddenWithConcurrency(
   page: Page,
   selectors: string[],
-  perSelectorTimeoutMs: number
-): Promise<void> {
-  await Promise.all(
-    selectors.map(async (selector) => {
-      try {
-        await waitUntilStable(page);
-        await page.waitForSelector(selector, {
-          state: 'hidden',
-          timeout: perSelectorTimeoutMs
-        });
-      } catch (err) {
-        if (err instanceof errors.TimeoutError) {
-          // OK: selector may never appear on this view; continue
-          return;
+  perSelectorTimeoutMs: number,
+  concurrency: number
+) {
+  // One stability wait per batch, not per selector
+  await waitUntilStable(page);
+
+  // Process selectors with a small concurrency to reduce polling in CI/CD
+  let i = 0;
+  while (i < selectors.length) {
+    const batch = selectors.slice(i, i + Math.max(1, concurrency));
+    await Promise.all(
+      batch.map(async (selector) => {
+        try {
+          await page.waitForSelector(selector, {
+            state: 'hidden',
+            timeout: perSelectorTimeoutMs
+          });
+        } catch (err) {
+          if (err instanceof errors.TimeoutError) {
+            // OK if a selector never appears on this screen
+            return;
+          }
+          throw err;
         }
-        throw err;
-      }
-    })
-  );
+      })
+    );
+    i += batch.length;
+  }
 }

tests/support/template/getPageAndWaitForLoad.ts

@@ -36,8 +36,14 @@ export async function getPageAndWaitForLoad(
     } catch (error) {
       retries++;
       const message = error instanceof Error ? error.message : 'Unknown error';
+      const openedPageUrls = context
+        .pages()
+        .map((p) => p.url())
+        .filter(Boolean);
       console.warn(
-        `[getPageAndWaitForLoad] Retry ${retries}/3 after error: ${message}`
+        `[getPageAndWaitForLoad] Retry ${retries}/3 after error: ${message}. Open pages (${
+          openedPageUrls.length
+        }): ${openedPageUrls.join(', ')}`
       );
 
       if (retries >= maxRetries) throw error;

tests/support/template/types.ts

@@ -10,6 +10,10 @@ export interface AuthenticateWithKeystoreType {
   keystorePassword: string;
 }
 
+export interface ConnectPasskeyWalletType {
+  page: Page;
+}
+
 export interface InMemoryProviderType {
   page: Page;
   loginMethod: InMemoryProviderLoginMethodType;
@@ -171,3 +175,10 @@ export type GetPageAndWaitForLoad = (
   urlSubstring: string | RegExp,
   options?: GetPageAndWaitForLoadOptions
 ) => Promise<Page>;
+
+export type WaitForMetaMaskLoadOptions = {
+  selectorTimeoutMs?: number;
+  extraLoadingSelectors?: string[];
+  skipInitialStabilityWait?: boolean;
+  concurrency?: number;
+};