playwright: Federated call between legacy and compat

playwright/widget/test-helpers.ts

@@ -15,6 +15,9 @@ import { type MatrixClient } from "matrix-js-sdk";
 
 const PASSWORD = "foobarbaz1!";
 
+export const HOST1 = "https://app.m.localhost/#/welcome";
+export const HOST2 = "https://app.othersite.m.localhost/#/welcome";
+
 export class TestHelpers {
   public static async startCallInCurrentRoom(
     page: Page,
@@ -31,12 +34,38 @@ export class TestHelpers {
     await page.getByRole("menuitem", { name: "Element Call" }).click();
   }
 
+  public static async joinCallFromLobby(page: Page): Promise<void> {
+    await expect(
+      page
+        .locator('iframe[title="Element Call"]')
+        .contentFrame()
+        .getByTestId("lobby_joinCall"),
+    ).toBeVisible();
+
+    await page
+      .locator('iframe[title="Element Call"]')
+      .contentFrame()
+      .getByTestId("lobby_joinCall")
+      .click();
+  }
+
+  public static async joinCallInCurrentRoom(
+    page: Page,
+    audioOnly: boolean = false,
+  ): Promise<void> {
+    const label = audioOnly ? "Voice call started" : "Video call started";
+    await expect(page.getByText(label)).toBeVisible();
+    await expect(page.getByRole("button", { name: "Join" })).toBeVisible();
+    await page.getByRole("button", { name: "Join" }).click();
+  }
+
   /**
    * Registers a new user and returns page, clientHandle and mxId.
    */
   public static async registerUser(
     browser: Browser,
     username: string,
+    host: string = HOST1,
   ): Promise<{
     page: Page;
     clientHandle: JSHandle<MatrixClient>;
@@ -46,7 +75,7 @@ export class TestHelpers {
       reducedMotion: "reduce",
     });
     const page = await userContext.newPage();
-    await page.goto("http://localhost:8081/#/welcome");
+    await page.goto(host);
     await page.getByRole("link", { name: "Create Account" }).click();
     await page.getByRole("textbox", { name: "Username" }).fill(username);
     await page
@@ -128,6 +157,53 @@ export class TestHelpers {
     }
   }
 
+  public static async acceptRoomInvite(
+    roomName: string,
+    page: Page,
+  ): Promise<void> {
+    await expect(page.getByRole("option", { name: roomName })).toBeVisible();
+    await page.getByRole("option", { name: roomName }).click();
+    await page.getByRole("button", { name: "Accept" }).click();
+
+    await expect(
+      page.getByRole("main").getByRole("heading", { name: roomName }),
+    ).toBeVisible();
+  }
+
+  /**
+   * Opens the widget and then goes to the settings to set the RTC mode.
+   * then closes the widget lobby.
+   *
+   * WORKS IF A ROOM IS CURRENTLY OPENED IN THE PAGE
+   */
+  public static async setEmbeddedElementCallRtcMode(
+    page: Page,
+    mode: "legacy" | "compat" | "2_0",
+  ): Promise<void> {
+    await page.getByRole("button", { name: "Video call" }).click();
+    await page.getByRole("menuitem", { name: "Element Call" }).click();
+    const iframe = page.locator('iframe[title="Element Call"]').contentFrame();
+
+    await iframe.getByRole("button", { name: "Settings" }).click();
+    await iframe.getByRole("tab", { name: "Preferences" }).click();
+
+    // await iframe.getByText("Developer mode", { exact: true }).click();
+    await iframe.getByText("Developer mode", { exact: true }).check(); // Idempotent:  won't uncheck if already checked
+
+    // Move to Developer tab now
+    await iframe.getByRole("tab", { name: "Developer" }).click();
+    if (mode === "legacy") {
+      await iframe.getByText("Legacy: state events").click();
+    } else if (mode === "2_0") {
+      await iframe.getByText("Matrix 2.0").click();
+    } else {
+      // compat
+      await iframe.getByText("Compatibility: state events").click();
+    }
+    await iframe.getByTestId("modal_close").click();
+    await page.getByRole("button", { name: "Close lobby" }).click();
+  }
+
   /**
    * Sets the current Element Web app to use the dev Element Call URL.
    * @param page - The EW page