Playwright test for history sharing on invite (#30948)

* Playwright: `getCurrentRoomIdFromUrl`

Helper function to fish a room ID out of the URL

* Playwright: use updated `Credentials` class from common lib

Pick up the extended `Credentials` interface that was added in
https://github.com/element-hq/element-modules/pull/80.

* Playwright: use `routeConfigJson` from common lib

https://github.com/element-hq/element-modules/pull/81 added a utility function
for building and routing `config.json`; we should use it.

* Playwright test for history sharing on invite

Fixes https://github.com/element-hq/element-meta/issues/2920

* Avoid use of CSS in playwright locators

playwright/e2e/crypto/history-sharing.spec.ts

@@ -0,0 +1,59 @@
+/*
+Copyright 2025 New Vector Ltd.
+
+SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial
+Please see LICENSE files in the repository root for full details.
+*/
+
+import { createNewInstance } from "@element-hq/element-web-playwright-common";
+
+import { expect, test } from "../../element-web-test";
+import { ElementAppPage } from "../../pages/ElementAppPage";
+import { createRoom, sendMessageInCurrentRoom } from "./utils";
+
+test.use({
+    displayName: "Alice",
+    labsFlags: ["feature_share_history_on_invite"],
+});
+
+/** Tests for MSC4268: encrypted history sharing */
+test.describe("History sharing", function () {
+    test(
+        "We should share history when sending invites",
+        { tag: "@screenshot" },
+        async (
+            { labsFlags, browser, page: alicePage, user: aliceCredentials, app: aliceElementApp, homeserver },
+            testInfo,
+        ) => {
+            // In this test, Alice creates an encrypted room and sends an event;
+            // we then invite Bob, and ensure Bob can see the content.
+
+            await aliceElementApp.client.bootstrapCrossSigning(aliceCredentials);
+
+            // Register a second user, and open it in a second instance of the app
+            const bobCredentials = await homeserver.registerUser(`user_${testInfo.testId}_bob`, "password", "Bob");
+            const bobPage = await createNewInstance(browser, bobCredentials, {}, labsFlags);
+            const bobElementApp = new ElementAppPage(bobPage);
+            await bobElementApp.client.bootstrapCrossSigning(bobCredentials);
+
+            // Create the room and send a message
+            await createRoom(alicePage, "TestRoom", true);
+            await sendMessageInCurrentRoom(alicePage, "A message from Alice");
+
+            // Send the invite to Bob
+            await aliceElementApp.inviteUserToCurrentRoom(bobCredentials.userId);
+
+            // Bob accepts the invite
+            await bobPage.getByRole("option", { name: "TestRoom" }).click();
+            await bobPage.getByRole("button", { name: "Accept" }).click();
+
+            // Bob should now be able to decrypt the event
+            await expect(bobPage.getByText("A message from Alice")).toBeVisible();
+
+            const mask = [bobPage.locator(".mx_MessageTimestamp")];
+            await expect(bobPage.locator(".mx_RoomView_body")).toMatchScreenshot("shared-history-invite-accepted.png", {
+                mask,
+            });
+        },
+    );
+});

playwright/e2e/knock/create-knock-room.spec.ts

@@ -27,8 +27,7 @@ test.describe("Create Knock Room", () => {
 
         await expect(page.locator(".mx_RoomHeader").getByText("Cybersecurity")).toBeVisible();
 
-        const urlHash = await page.evaluate(() => window.location.hash);
-        const roomId = urlHash.replace("#/room/", "");
+        const roomId = await app.getCurrentRoomIdFromUrl();
 
         // Room should have a knock join rule
         await waitForRoom(page, app.client, roomId, (room) => {
@@ -44,8 +43,7 @@ test.describe("Create Knock Room", () => {
 
         await expect(page.locator(".mx_RoomHeader").getByText("Cybersecurity")).toBeVisible();
 
-        const urlHash = await page.evaluate(() => window.location.hash);
-        const roomId = urlHash.replace("#/room/", "");
+        const roomId = await app.getCurrentRoomIdFromUrl();
 
         await app.settings.openRoomSettings("Security & Privacy");
 
@@ -70,8 +68,7 @@ test.describe("Create Knock Room", () => {
 
         await expect(page.locator(".mx_RoomHeader").getByText("Cybersecurity")).toBeVisible();
 
-        const urlHash = await page.evaluate(() => window.location.hash);
-        const roomId = urlHash.replace("#/room/", "");
+        const roomId = await app.getCurrentRoomIdFromUrl();
 
         // Room should have a knock join rule
         await waitForRoom(page, app.client, roomId, (room) => {

playwright/e2e/login/utils.ts

@@ -51,6 +51,7 @@ export async function doTokenRegistration(
     await expect(page.getByRole("heading", { name: "Welcome Alice", exact: true })).toBeVisible();
 
     return page.evaluate(() => ({
+        homeserverBaseUrl: window.mxMatrixClientPeg.get().getHomeserverUrl(),
         accessToken: window.mxMatrixClientPeg.get().getAccessToken(),
         userId: window.mxMatrixClientPeg.get().getUserId(),
         deviceId: window.mxMatrixClientPeg.get().getDeviceId(),

playwright/e2e/oidc/oidc-native.spec.ts

@@ -6,9 +6,10 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Com
 Please see LICENSE files in the repository root for full details.
 */
 
-import { type Config, CONFIG_JSON } from "@element-hq/element-web-playwright-common";
+import { type Config } from "@element-hq/element-web-playwright-common";
 import { type Browser, type Page } from "@playwright/test";
 import { type StartedHomeserverContainer } from "@element-hq/element-web-playwright-common/lib/testcontainers/HomeserverContainer";
+import { routeConfigJson } from "@element-hq/element-web-playwright-common";
 
 import { test, expect } from "../../element-web-test.ts";
 import { logInAccountMas, registerAccountMas } from ".";
@@ -242,17 +243,6 @@ async function verifyUsingOtherDevice(deviceToVerifyPage: Page, alreadyVerifiedD
  */
 async function newContext(browser: Browser, config: Partial<Partial<Config>>, homeserver: StartedHomeserverContainer) {
     const otherContext = await browser.newContext();
-    await otherContext.route(`http://localhost:8080/config.json*`, async (route) => {
-        const json = {
-            ...CONFIG_JSON,
-            ...config,
-            default_server_config: {
-                "m.homeserver": {
-                    base_url: homeserver.baseUrl,
-                },
-            },
-        };
-        await route.fulfill({ json });
-    });
+    await routeConfigJson(otherContext, homeserver.baseUrl, config);
     return otherContext;
 }