Prepare for switch to testcontainers in playwright (#28880)

* Remove access to homeserver.config.baseUrl field in favour of homeserver.baseUrl

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Use sane default_server_config and specify server.invalid in the specific tests which demand it

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* break cycle

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* typo

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

playwright/e2e/app-loading/guest-registration.spec.ts

@@ -14,13 +14,6 @@ import { expect, test } from "../../element-web-test";
 
 test.use({
     startHomeserverOpts: "guest-enabled",
-    config: async ({ homeserver }, use) => {
-        await use({
-            default_server_config: {
-                "m.homeserver": { base_url: homeserver.config.baseUrl },
-            },
-        });
-    },
 });
 
 test("Shows the welcome page by default", async ({ page }) => {

playwright/e2e/crypto/complete-security.spec.ts

@@ -19,9 +19,9 @@ test.describe("Complete security", () => {
         homeserver,
         credentials,
     }) => {
-        await logIntoElement(page, homeserver, credentials);
+        await logIntoElement(page, credentials);
         await expect(page.getByText("Welcome Jeff", { exact: true })).toBeVisible();
     });
 
-    // see also "Verify device during login with SAS" in `verifiction.spec.ts`.
+    // see also "Verify device during login with SAS" in `verification.spec.ts`.
 });

playwright/e2e/crypto/decryption-failure-messages.spec.ts

@@ -45,7 +45,7 @@ test.describe("Cryptography", function () {
             await logOutOfElement(page, true);
 
             // Log in again, and see how the message looks.
-            await logIntoElement(page, homeserver, credentials);
+            await logIntoElement(page, credentials);
             await app.viewRoomByName("Test room");
             const lastTile = page.locator(".mx_EventTile").last();
             await expect(lastTile).toContainText("Historical messages are not available on this device");
@@ -62,7 +62,7 @@ test.describe("Cryptography", function () {
 
             // Finally, log out again, and back in, skipping verification for now, and see what we see.
             await logOutOfElement(page);
-            await logIntoElement(page, homeserver, credentials);
+            await logIntoElement(page, credentials);
             await page.locator(".mx_AuthPage").getByRole("button", { name: "Skip verification for now" }).click();
             await page.locator(".mx_AuthPage").getByRole("button", { name: "I'll verify later" }).click();
             await app.viewRoomByName("Test room");

playwright/e2e/crypto/dehydration.spec.ts

@@ -17,11 +17,9 @@ const test = base.extend<Fixtures>({
     startHomeserverOpts: async ({}, use) => {
         await use("dehydration");
     },
-    config: async ({ homeserver, context }, use) => {
+    config: async ({ config, context }, use) => {
         const wellKnown = {
-            "m.homeserver": {
+            ...config.default_server_config,
-                base_url: homeserver.config.baseUrl,
-            },
             "org.matrix.msc3814": true,
         };
 
@@ -29,9 +27,7 @@ const test = base.extend<Fixtures>({
             await route.fulfill({ json: wellKnown });
         });
 
-        await use({
+        await use(config);
-            default_server_config: wellKnown,
-        });
     },
 });
 

playwright/e2e/crypto/device-verification.spec.ts

@@ -66,7 +66,7 @@ test.describe("Device verification", { tag: "@no-webkit" }, () => {
     }
 
     test("Verify device with SAS during login", async ({ page, app, credentials, homeserver }) => {
-        await logIntoElement(page, homeserver, credentials);
+        await logIntoElement(page, credentials);
 
         // Launch the verification request between alice and the bot
         const verificationRequest = await initiateAliceVerificationRequest(page);
@@ -93,7 +93,7 @@ test.describe("Device verification", { tag: "@no-webkit" }, () => {
 
     test("Verify device with QR code during login", async ({ page, app, credentials, homeserver }) => {
         // A mode 0x02 verification: "self-verifying in which the current device does not yet trust the master key"
-        await logIntoElement(page, homeserver, credentials);
+        await logIntoElement(page, credentials);
 
         // Launch the verification request between alice and the bot
         const verificationRequest = await initiateAliceVerificationRequest(page);
@@ -137,7 +137,7 @@ test.describe("Device verification", { tag: "@no-webkit" }, () => {
     });
 
     test("Verify device with Security Phrase during login", async ({ page, app, credentials, homeserver }) => {
-        await logIntoElement(page, homeserver, credentials);
+        await logIntoElement(page, credentials);
 
         // Select the security phrase
         await page.locator(".mx_AuthPage").getByRole("button", { name: "Verify with Security Key or Phrase" }).click();
@@ -158,7 +158,7 @@ test.describe("Device verification", { tag: "@no-webkit" }, () => {
     });
 
     test("Verify device with Security Key during login", async ({ page, app, credentials, homeserver }) => {
-        await logIntoElement(page, homeserver, credentials);
+        await logIntoElement(page, credentials);
 
         // Select the security phrase
         await page.locator(".mx_AuthPage").getByRole("button", { name: "Verify with Security Key or Phrase" }).click();
@@ -181,7 +181,7 @@ test.describe("Device verification", { tag: "@no-webkit" }, () => {
     });
 
     test("Handle incoming verification request with SAS", async ({ page, credentials, homeserver, toasts }) => {
-        await logIntoElement(page, homeserver, credentials);
+        await logIntoElement(page, credentials);
 
         /* Dismiss "Verify this device" */
         const authPage = page.locator(".mx_AuthPage");

playwright/e2e/crypto/event-shields.spec.ts

@@ -207,7 +207,7 @@ test.describe("Cryptography", function () {
                 window.localStorage.clear();
             });
             await page.reload();
-            await logIntoElement(page, homeserver, aliceCredentials, securityKey);
+            await logIntoElement(page, aliceCredentials, securityKey);
 
             /* go back to the test room and find Bob's message again */
             await app.viewRoomById(testRoomId);

playwright/e2e/crypto/logout.spec.ts

@@ -11,7 +11,7 @@ import { createRoom, enableKeyBackup, logIntoElement, sendMessageInCurrentRoom }
 
 test.describe("Logout tests", () => {
     test.beforeEach(async ({ page, homeserver, credentials }) => {
-        await logIntoElement(page, homeserver, credentials);
+        await logIntoElement(page, credentials);
     });
 
     test("Ask to set up recovery on logout if not setup", async ({ page, app }) => {

playwright/e2e/crypto/utils.ts

@@ -138,22 +138,9 @@ export async function checkDeviceIsConnectedKeyBackup(
  *
  * If a `securityKey` is given, verifies the new device using the key.
  */
-export async function logIntoElement(
+export async function logIntoElement(page: Page, credentials: Credentials, securityKey?: string) {
-    page: Page,
-    homeserver: HomeserverInstance,
-    credentials: Credentials,
-    securityKey?: string,
-) {
     await page.goto("/#/login");
 
-    // select homeserver
-    await page.getByRole("button", { name: "Edit" }).click();
-    await page.getByRole("textbox", { name: "Other homeserver" }).fill(homeserver.config.baseUrl);
-    await page.getByRole("button", { name: "Continue", exact: true }).click();
-
-    // wait for the dialog to go away
-    await expect(page.locator(".mx_ServerPickerDialog")).not.toBeVisible();
-
     await page.getByRole("textbox", { name: "Username" }).fill(credentials.userId);
     await page.getByPlaceholder("Password").fill(credentials.password);
     await page.getByRole("button", { name: "Sign in" }).click();

playwright/e2e/csAPI.ts

@@ -22,7 +22,7 @@ export class TestClientServerAPI {
     ) {}
 
     public async getCurrentBackupInfo(): Promise<KeyBackupInfo | null> {
-        const res = await this.request.get(`${this.homeserver.config.baseUrl}/_matrix/client/v3/room_keys/version`, {
+        const res = await this.request.get(`${this.homeserver.baseUrl}/_matrix/client/v3/room_keys/version`, {
             headers: { Authorization: `Bearer ${this.accessToken}` },
         });
 
@@ -35,7 +35,7 @@ export class TestClientServerAPI {
      */
     public async deleteBackupVersion(version: string): Promise<void> {
         const res = await this.request.delete(
-            `${this.homeserver.config.baseUrl}/_matrix/client/v3/room_keys/version/${version}`,
+            `${this.homeserver.baseUrl}/_matrix/client/v3/room_keys/version/${version}`,
             {
                 headers: { Authorization: `Bearer ${this.accessToken}` },
             },

playwright/e2e/forgot-password/forgot-password.spec.ts

@@ -16,6 +16,15 @@ const email = "user@nowhere.dummy";
 
 test.describe("Forgot Password", () => {
     test.use({
+        config: {
+            // The only thing that we really *need* (otherwise Element refuses to load) is a default homeserver.
+            // We point that to a guaranteed-invalid domain.
+            default_server_config: {
+                "m.homeserver": {
+                    base_url: "https://server.invalid",
+                },
+            },
+        },
         startHomeserverOpts: ({ mailhog }, use) =>
             use({
                 template: "email",
@@ -32,7 +41,7 @@ test.describe("Forgot Password", () => {
         await page.getByRole("link", { name: "Sign in" }).click();
 
         // need to select a homeserver at this stage, before entering the forgot password flow
-        await selectHomeserver(page, homeserver.config.baseUrl);
+        await selectHomeserver(page, homeserver.baseUrl);
 
         await page.getByRole("button", { name: "Forgot password?" }).click();
 
@@ -47,7 +56,7 @@ test.describe("Forgot Password", () => {
         await page.goto("/");
 
         await page.getByRole("link", { name: "Sign in" }).click();
-        await selectHomeserver(page, homeserver.config.baseUrl);
+        await selectHomeserver(page, homeserver.baseUrl);
 
         await page.getByRole("button", { name: "Forgot password?" }).click();
 

playwright/e2e/login/login.spec.ts

@@ -70,7 +70,7 @@ const DEVICE_SIGNING_KEYS_BODY = {
 
 async function login(page: Page, homeserver: HomeserverInstance) {
     await page.getByRole("link", { name: "Sign in" }).click();
-    await selectHomeserver(page, homeserver.config.baseUrl);
+    await selectHomeserver(page, homeserver.baseUrl);
 
     await page.getByRole("textbox", { name: "Username" }).fill(username);
     await page.getByPlaceholder("Password").fill(password);
@@ -78,6 +78,18 @@ async function login(page: Page, homeserver: HomeserverInstance) {
 }
 
 test.describe("Login", () => {
+    test.use({
+        config: {
+            // The only thing that we really *need* (otherwise Element refuses to load) is a default homeserver.
+            // We point that to a guaranteed-invalid domain.
+            default_server_config: {
+                "m.homeserver": {
+                    base_url: "https://server.invalid",
+                },
+            },
+        },
+    });
+
     test.describe("Password login", () => {
         test.use({ startHomeserverOpts: "consent" });
 
@@ -101,7 +113,7 @@ test.describe("Login", () => {
             await page.getByRole("link", { name: "Sign in" }).click();
 
             // first pick the homeserver, as otherwise the user picker won't be visible
-            await selectHomeserver(page, homeserver.config.baseUrl);
+            await selectHomeserver(page, homeserver.baseUrl);
 
             await page.getByRole("button", { name: "Edit" }).click();
 
@@ -114,7 +126,7 @@ test.describe("Login", () => {
             await expect(page.locator(".mx_ServerPicker_server")).toHaveText("server.invalid");
 
             // switch back to the custom homeserver
-            await selectHomeserver(page, homeserver.config.baseUrl);
+            await selectHomeserver(page, homeserver.baseUrl);
 
             await expect(page.getByRole("textbox", { name: "Username" })).toBeVisible();
             // Disabled because flaky - see https://github.com/vector-im/element-web/issues/24688
@@ -142,10 +154,10 @@ test.describe("Login", () => {
                 homeserver,
                 request,
             }) => {
-                const res = await request.post(
+                const res = await request.post(`${homeserver.baseUrl}/_matrix/client/v3/keys/device_signing/upload`, {
-                    `${homeserver.config.baseUrl}/_matrix/client/v3/keys/device_signing/upload`,
+                    headers: { Authorization: `Bearer ${creds.accessToken}` },
-                    { headers: { Authorization: `Bearer ${creds.accessToken}` }, data: DEVICE_SIGNING_KEYS_BODY },
+                    data: DEVICE_SIGNING_KEYS_BODY,
-                );
+                });
                 if (res.status() / 100 !== 2) {
                     console.log("Uploading dummy keys failed", await res.json());
                 }
@@ -172,7 +184,7 @@ test.describe("Login", () => {
                     request,
                 }) => {
                     const res = await request.post(
-                        `${homeserver.config.baseUrl}/_matrix/client/v3/keys/device_signing/upload`,
+                        `${homeserver.baseUrl}/_matrix/client/v3/keys/device_signing/upload`,
                         { headers: { Authorization: `Bearer ${creds.accessToken}` }, data: DEVICE_SIGNING_KEYS_BODY },
                     );
                     if (res.status() / 100 !== 2) {
@@ -203,7 +215,7 @@ test.describe("Login", () => {
                 }) => {
                     console.log(`uid ${creds.userId} body`, DEVICE_SIGNING_KEYS_BODY);
                     const res = await request.post(
-                        `${homeserver.config.baseUrl}/_matrix/client/v3/keys/device_signing/upload`,
+                        `${homeserver.baseUrl}/_matrix/client/v3/keys/device_signing/upload`,
                         { headers: { Authorization: `Bearer ${creds.accessToken}` }, data: DEVICE_SIGNING_KEYS_BODY },
                     );
                     if (res.status() / 100 !== 2) {

playwright/e2e/login/overwrite_login.spec.ts

@@ -13,7 +13,7 @@ test.describe("Overwrite login action", () => {
     // This seems terminally flakey: https://github.com/element-hq/element-web/issues/27363
     // I tried verious things to try & deflake it, to no avail: https://github.com/matrix-org/matrix-react-sdk/pull/12506
     test.skip("Try replace existing login with new one", async ({ page, app, credentials, homeserver }) => {
-        await logIntoElement(page, homeserver, credentials);
+        await logIntoElement(page, credentials);
 
         const userMenu = await app.openUserMenu();
         await expect(userMenu.getByText(credentials.userId)).toBeVisible();
@@ -24,7 +24,7 @@ test.describe("Overwrite login action", () => {
         expect(credentials.userId).not.toBe(bobRegister.userId);
 
         const clientCredentials /* IMatrixClientCreds */ = {
-            homeserverUrl: homeserver.config.baseUrl,
+            homeserverUrl: homeserver.baseUrl,
             ...bobRegister,
         };
 

playwright/e2e/login/soft_logout.spec.ts

@@ -16,6 +16,15 @@ import { isDendrite } from "../../plugins/homeserver/dendrite";
 test.describe("Soft logout", () => {
     test.use({
         displayName: "Alice",
+        config: {
+            // The only thing that we really *need* (otherwise Element refuses to load) is a default homeserver.
+            // We point that to a guaranteed-invalid domain.
+            default_server_config: {
+                "m.homeserver": {
+                    base_url: "https://server.invalid",
+                },
+            },
+        },
         startHomeserverOpts: ({ oAuthServer }, use) =>
             use({
                 template: "default",

playwright/e2e/login/utils.ts

@@ -19,7 +19,7 @@ export async function doTokenRegistration(
     await page.goto("/#/login");
 
     await page.getByRole("button", { name: "Edit" }).click();
-    await page.getByRole("textbox", { name: "Other homeserver" }).fill(homeserver.config.baseUrl);
+    await page.getByRole("textbox", { name: "Other homeserver" }).fill(homeserver.baseUrl);
     await page.getByRole("button", { name: "Continue" }).click();
     // wait for the dialog to go away
     await expect(page.locator(".mx_ServerPickerDialog")).toHaveCount(0);

playwright/e2e/oidc/index.ts

@@ -40,12 +40,10 @@ export const test = base.extend<{
             },
         });
     },
-    config: async ({ homeserver, startHomeserverOpts, context }, use) => {
+    config: async ({ config, startHomeserverOpts, context }, use) => {
         const issuer = `http://localhost:${(startHomeserverOpts as StartHomeserverOpts).variables["MAS_PORT"]}/`;
         const wellKnown = {
-            "m.homeserver": {
+            ...config.default_server_config,
-                base_url: homeserver.config.baseUrl,
-            },
             "org.matrix.msc2965.authentication": {
                 issuer,
                 account: `${issuer}account`,
@@ -57,9 +55,7 @@ export const test = base.extend<{
             await route.fulfill({ json: wellKnown });
         });
 
-        await use({
+        await use(config);
-            default_server_config: wellKnown,
-        });
     },
 });
 

playwright/e2e/register/email.spec.ts

@@ -21,12 +21,11 @@ test.describe("Email Registration", async () => {
                     SMTP_PORT: mailhog.instance.smtpPort,
                 },
             }),
-        config: ({ homeserver }, use) =>
+        config: ({ config }, use) =>
             use({
+                ...config,
                 default_server_config: {
-                    "m.homeserver": {
+                    ...config.default_server_config,
-                        base_url: homeserver.config.baseUrl,
-                    },
                     "m.identity_server": {
                         base_url: "https://server.invalid",
                     },
@@ -34,7 +33,7 @@ test.describe("Email Registration", async () => {
             }),
     });
 
-    test.beforeEach(async ({ page }) => {
+    test.beforeEach(async ({ homeserver, page }) => {
         await page.goto("/#/register");
     });
 

playwright/e2e/register/register.spec.ts

@@ -11,6 +11,15 @@ import { test, expect } from "../../element-web-test";
 test.describe("Registration", () => {
     test.use({
         startHomeserverOpts: "consent",
+        config: {
+            // The only thing that we really *need* (otherwise Element refuses to load) is a default homeserver.
+            // We point that to a guaranteed-invalid domain.
+            default_server_config: {
+                "m.homeserver": {
+                    base_url: "https://server.invalid",
+                },
+            },
+        },
     });
 
     test.beforeEach(async ({ page }) => {
@@ -27,7 +36,7 @@ test.describe("Registration", () => {
             await expect(page.locator(".mx_Dialog")).toMatchScreenshot("server-picker.png");
             await checkA11y();
 
-            await page.getByRole("textbox", { name: "Other homeserver" }).fill(homeserver.config.baseUrl);
+            await page.getByRole("textbox", { name: "Other homeserver" }).fill(homeserver.baseUrl);
             await page.getByRole("button", { name: "Continue", exact: true }).click();
             // wait for the dialog to go away
             await expect(page.getByRole("dialog")).not.toBeVisible();
@@ -88,7 +97,7 @@ test.describe("Registration", () => {
     test("should require username to fulfil requirements and be available", async ({ homeserver, page }) => {
         await page.getByRole("button", { name: "Edit", exact: true }).click();
         await expect(page.getByRole("button", { name: "Continue", exact: true })).toBeVisible();
-        await page.getByRole("textbox", { name: "Other homeserver" }).fill(homeserver.config.baseUrl);
+        await page.getByRole("textbox", { name: "Other homeserver" }).fill(homeserver.baseUrl);
         await page.getByRole("button", { name: "Continue", exact: true }).click();
         // wait for the dialog to go away
         await expect(page.getByRole("dialog")).not.toBeVisible();

playwright/element-web-test.ts

@@ -29,18 +29,8 @@ import { Webserver } from "./plugins/webserver";
 // See https://playwright.dev/docs/service-workers-experimental#how-to-enable
 process.env["PW_EXPERIMENTAL_SERVICE_WORKER_NETWORK_EVENTS"] = "1";
 
+// This is deliberately quite a minimal config.json, so that we can test that the default settings actually work.
 const CONFIG_JSON: Partial<IConfigOptions> = {
-    // This is deliberately quite a minimal config.json, so that we can test that the default settings
-    // actually work.
-    //
-    // The only thing that we really *need* (otherwise Element refuses to load) is a default homeserver.
-    // We point that to a guaranteed-invalid domain.
-    default_server_config: {
-        "m.homeserver": {
-            base_url: "https://server.invalid",
-        },
-    },
-
     // The default language is set here for test consistency
     setting_defaults: {
         language: "en-GB",
@@ -133,10 +123,19 @@ export const test = base.extend<Fixtures>({
         );
         await use(context);
     },
-    config: CONFIG_JSON,
+    config: {}, // We merge this atop the default CONFIG_JSON in the page fixture to make extending it easier
-    page: async ({ context, page, config, labsFlags }, use) => {
+    page: async ({ homeserver, context, page, config, labsFlags }, use) => {
         await context.route(`http://localhost:8080/config.json*`, async (route) => {
-            const json = { ...CONFIG_JSON, ...config };
+            const json = {
+                ...CONFIG_JSON,
+                ...config,
+                default_server_config: {
+                    "m.homeserver": {
+                        base_url: homeserver.baseUrl,
+                    },
+                    ...config.default_server_config,
+                },
+            };
             json["features"] = {
                 ...json["features"],
                 // Enable the lab features
@@ -220,7 +219,7 @@ export const test = base.extend<Fixtures>({
                 // Ensure the language is set to a consistent value
                 window.localStorage.setItem("mx_local_settings", '{"language":"en"}');
             },
-            { baseUrl: homeserver.config.baseUrl, credentials },
+            { baseUrl: homeserver.baseUrl, credentials },
         );
         await use(page);
     },

playwright/pages/bot.ts

@@ -97,7 +97,7 @@ export class Bot extends Client {
     private async buildClient(): Promise<JSHandle<ExtendedMatrixClient>> {
         const credentials = await this.getCredentials();
         const clientHandle = await this.page.evaluateHandle(
-            async ({ homeserver, credentials, opts }) => {
+            async ({ baseUrl, credentials, opts }) => {
                 function getLogger(loggerName: string): Logger {
                     const logger = {
                         getChild: (namespace: string) => getLogger(`${loggerName}:${namespace}`),
@@ -157,7 +157,7 @@ export class Bot extends Client {
                 };
 
                 const cli = new window.matrixcs.MatrixClient({
-                    baseUrl: homeserver.baseUrl,
+                    baseUrl,
                     userId: credentials.userId,
                     deviceId: credentials.deviceId,
                     accessToken: credentials.accessToken,
@@ -179,7 +179,7 @@ export class Bot extends Client {
                 return cli;
             },
             {
-                homeserver: this.homeserver.config,
+                baseUrl: this.homeserver.baseUrl,
                 credentials,
                 opts: this.opts,
             },

playwright/pages/crypto.ts

@@ -27,7 +27,7 @@ export class Crypto {
             accessToken: window.mxMatrixClientPeg.get().getAccessToken(),
         }));
 
-        const res = await this.request.post(`${this.homeserver.config.baseUrl}/_matrix/client/v3/keys/query`, {
+        const res = await this.request.post(`${this.homeserver.baseUrl}/_matrix/client/v3/keys/query`, {
             headers: { Authorization: `Bearer ${accessToken}` },
             data: { device_keys: { [userId]: [] } },
         });

playwright/plugins/homeserver/index.ts

@@ -16,6 +16,7 @@ export interface HomeserverConfig {
 
 export interface HomeserverInstance {
     readonly config: HomeserverConfig;
+    readonly baseUrl: string;
 
     /**
      * Register a user on the given Homeserver using the shared registration secret.

playwright/plugins/homeserver/synapse/index.ts

@@ -146,6 +146,10 @@ export class Synapse implements Homeserver, HomeserverInstance {
         return [path.join(synapseLogsPath, "stdout.log"), path.join(synapseLogsPath, "stderr.log")];
     }
 
+    public get baseUrl(): string {
+        return this.config.baseUrl;
+    }
+
     private async registerUserInternal(
         username: string,
         password: string,