From d25d6d319632823564b095361d9268b0159c800d Mon Sep 17 00:00:00 2001 From: Valere Date: Thu, 15 Jan 2026 12:06:41 +0100 Subject: [PATCH] Test all pairs of rtc mode in federated calls --- playwright/widget/federated-call.test.ts | 103 ++++++++++++----------- playwright/widget/test-helpers.ts | 8 +- 2 files changed, 61 insertions(+), 50 deletions(-) diff --git a/playwright/widget/federated-call.test.ts b/playwright/widget/federated-call.test.ts index c7f6ac18..51ed1b41 100644 --- a/playwright/widget/federated-call.test.ts +++ b/playwright/widget/federated-call.test.ts @@ -8,64 +8,73 @@ Please see LICENSE in the repository root for full details. import { expect, test } from "@playwright/test"; import { widgetTest } from "../fixtures/widget-user"; -import { HOST1, HOST2, TestHelpers } from "./test-helpers"; +import { HOST1, HOST2, type RtcMode, TestHelpers } from "./test-helpers"; -widgetTest( - "Test federated call default rtc mode", - async ({ addUser, browserName }) => { - test.skip( - browserName === "firefox", - "The is test is not working on firefox CI environment. No mic/audio device inputs so cam/mic are disabled", - ); +const modePairs: [RtcMode, RtcMode][] = [ + ["compat", "compat"], + ["legacy", "legacy"], + ["legacy", "compat"], + ["compat", "legacy"], +]; - const florian = await addUser("floriant", HOST1); - const timo = await addUser("timo", HOST2); +modePairs.forEach(([rtcMode1, rtcMode2]) => { + widgetTest( + `Test federated call with rtc modes ${rtcMode1} and ${rtcMode2}`, + async ({ addUser, browserName }) => { + test.skip( + browserName === "firefox", + "The is test is not working on firefox CI environment. No mic/audio device inputs so cam/mic are disabled", + ); - const roomName = "Call Room"; + const florian = await addUser("floriant", HOST1); + const timo = await addUser("timo", HOST2); - await TestHelpers.createRoom(roomName, florian.page, [timo.mxId]); + const roomName = "Call Room"; - await TestHelpers.acceptRoomInvite(roomName, timo.page); + await TestHelpers.createRoom(roomName, florian.page, [timo.mxId]); - await florian.page.pause(); + await TestHelpers.acceptRoomInvite(roomName, timo.page); - await TestHelpers.setEmbeddedElementCallRtcMode(florian.page, "legacy"); - await TestHelpers.setEmbeddedElementCallRtcMode(timo.page, "compat"); + await florian.page.pause(); - await TestHelpers.startCallInCurrentRoom(florian.page, false); - await TestHelpers.joinCallFromLobby(florian.page); + await TestHelpers.setEmbeddedElementCallRtcMode(florian.page, rtcMode1); + await TestHelpers.setEmbeddedElementCallRtcMode(timo.page, rtcMode2); - // timo joins - await TestHelpers.joinCallInCurrentRoom(timo.page); + await TestHelpers.startCallInCurrentRoom(florian.page, false); + await TestHelpers.joinCallFromLobby(florian.page); - // We should see 2 video tiles everywhere now - for (const user of [timo, florian]) { - const frame = user.page - .locator('iframe[title="Element Call"]') - .contentFrame(); - await expect(frame.getByTestId("videoTile")).toHaveCount(2); + // timo joins + await TestHelpers.joinCallInCurrentRoom(timo.page); - // There are no other options than to wait for all media to be ready? - // Or it is too flaky :/ - await user.page.waitForTimeout(3000); - // No one should be waiting for media - await expect(frame.getByText("Waiting for media...")).not.toBeVisible(); + // We should see 2 video tiles everywhere now + for (const user of [timo, florian]) { + const frame = user.page + .locator('iframe[title="Element Call"]') + .contentFrame(); + await expect(frame.getByTestId("videoTile")).toHaveCount(2); - // There should be 5 video elements, visible and autoplaying - const videoElements = await frame.locator("video").all(); - expect(videoElements.length).toBe(2); + // There are no other options than to wait for all media to be ready? + // Or it is too flaky :/ + await user.page.waitForTimeout(3000); + // No one should be waiting for media + await expect(frame.getByText("Waiting for media...")).not.toBeVisible(); - const blockDisplayCount = await frame - .locator("video") - .evaluateAll( - (videos: Element[]) => - videos.filter( - (v: Element) => window.getComputedStyle(v).display === "block", - ).length, - ); - expect(blockDisplayCount).toBe(2); - } + // There should be 5 video elements, visible and autoplaying + const videoElements = await frame.locator("video").all(); + expect(videoElements.length).toBe(2); - // await florian.page.pause(); - }, -); + const blockDisplayCount = await frame + .locator("video") + .evaluateAll( + (videos: Element[]) => + videos.filter( + (v: Element) => window.getComputedStyle(v).display === "block", + ).length, + ); + expect(blockDisplayCount).toBe(2); + } + + // await florian.page.pause(); + }, + ); +}); diff --git a/playwright/widget/test-helpers.ts b/playwright/widget/test-helpers.ts index 18db48de..b408a791 100644 --- a/playwright/widget/test-helpers.ts +++ b/playwright/widget/test-helpers.ts @@ -18,6 +18,8 @@ const PASSWORD = "foobarbaz1!"; export const HOST1 = "https://app.m.localhost/#/welcome"; export const HOST2 = "https://app.othersite.m.localhost/#/welcome"; +export type RtcMode = "legacy" | "compat" | "2_0"; + export class TestHelpers { public static async startCallInCurrentRoom( page: Page, @@ -183,7 +185,7 @@ export class TestHelpers { */ public static async setEmbeddedElementCallRtcMode( page: Page, - mode: "legacy" | "compat" | "2_0", + mode: RtcMode, ): Promise { await page.getByRole("button", { name: "Video call" }).click(); await page.getByRole("menuitem", { name: "Element Call" }).click(); @@ -197,9 +199,9 @@ export class TestHelpers { // Move to Developer tab now await iframe.getByRole("tab", { name: "Developer" }).click(); - if (mode === "legacy") { + if (mode == "legacy") { await iframe.getByText("Legacy: state events").click(); - } else if (mode === "2_0") { + } else if (mode == "2_0") { await iframe.getByText("Matrix 2.0").click(); } else { // compat