playwrigth: make dismiss toast more reliable

playwright/widget/test-helpers.ts

@@ -142,9 +142,7 @@ export class TestHelpers {
       timeout: 15000,
     });
 
-    await this.maybeDismissBrowserNotSupportedToast(page);
+    await this.dismissStartupToasts(page);
-    await this.maybeDismissServiceWorkerWarningToast(page);
-    await this.maybeDismissBackupChat(page);
 
     await TestHelpers.setDevToolElementCallDevUrl(page);
 
@@ -155,73 +153,39 @@ export class TestHelpers {
     return { page, clientHandle, mxId };
   }
 
-  private static async maybeDismissBrowserNotSupportedToast(
+  // Dismisses any toasts that appear on startup, such as "Failed to load service worker" or "Back up your chats".
-    page: Page,
+  // Toast can be stacked, and only the top one can be dismiss, so just look at what is on top and
-  ): Promise<void> {
+  // dismiss (if part of expected toats)
-    const browserUnsupportedToast = page
+  public static async dismissStartupToasts(page: Page): Promise<void> {
-      .getByText("Element does not support this browser")
+    const expectedToasts = [
-      .locator("..")
+      { title: "Failed to load service worker", button: "OK" },
-      .locator("..");
+      { title: "Back up your chats", button: "Dismiss" },
+      { title: "Element does not support this browser", button: "Dismiss" },
+    ];
 
-    // Dismiss incompatible browser toast
+    const toast = page.locator(".mx_Toast_toast");
-    const dismissButton = browserUnsupportedToast.getByRole("button", {
-      name: "Dismiss",
-    });
-    try {
-      await expect(dismissButton).toBeVisible({ timeout: 700 });
-      await dismissButton.click();
-    } catch {
-      // dismissButton not visible, continue as normal
-    }
-  }
 
-  private static async maybeDismissServiceWorkerWarningToast(
+    // eslint-disable-next-line no-constant-condition
-    page: Page,
+    while (true) {
-  ): Promise<void> {
+      try {
-    const toast = page
+        await toast.waitFor({ state: "visible", timeout: 700 });
-      .locator(".mx_Toast_toast")
+        const title = await toast.locator(".mx_Toast_title h2").textContent();
-      .getByText("Failed to load service worker");
 
-    try {
+        // Find the matching toast config
-      await expect(toast).toBeVisible({ timeout: 700 });
+        const toastConfig = expectedToasts.find((t) =>
-      await page
+          title?.includes(t.title),
-        .locator(".mx_Toast_toast")
+        );
-        .getByRole("button", { name: "OK" })
-        .click();
-    } catch {
-      // toast not visible, continue as normal
-    }
-  }
 
-  private static async maybeDismissBackupChat(page: Page): Promise<void> {
+        if (toastConfig) {
-    const toast = page
+          await toast.getByRole("button", { name: toastConfig.button }).click();
-      .locator(".mx_Toast_toast")
+        } else {
-      .getByText("Back up your chats");
+          // Unknown toast. We don't want to act on unknown toasts
-
+          break;
-    try {
+        }
-      await expect(toast).toBeVisible({ timeout: 700 });
+      } catch {
-      await page
+        // No toast visible, exit loop
-        .locator(".mx_Toast_toast")
+        break;
-        .getByRole("button", { name: "Dismiss" })
+      }
-        .click();
-    } catch {
-      // toast not visible, continue as normal
-    }
-  }
-
-  public static async maybeDismissKeyBackupToast(page: Page): Promise<void> {
-    const toast = page
-      .locator(".mx_Toast_toast")
-      .getByText("Back up your chats");
-
-    try {
-      await expect(toast).toBeVisible({ timeout: 700 });
-      await page
-        .locator(".mx_Toast_toast")
-        .getByRole("button", { name: "Dismiss" })
-        .click();
-    } catch {
-      // toast not visible, continue as normal
     }
   }
 
@@ -244,7 +208,7 @@ export class TestHelpers {
       timeout: 10000,
     });
     await expect(page.getByText("Encryption enabled")).toBeVisible();
-    await TestHelpers.maybeDismissKeyBackupToast(page);
+    await TestHelpers.dismissStartupToasts(page);
 
     // Invite users if any
     if (andInvite.length > 0) {
@@ -283,7 +247,7 @@ export class TestHelpers {
     await expect(
       page.getByRole("main").getByRole("heading", { name: roomName }),
     ).toBeVisible();
-    await TestHelpers.maybeDismissKeyBackupToast(page);
+    await TestHelpers.dismissStartupToasts(page);
   }
 
   /**