Use cache for Playwright testcontainers images

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

.github/CODEOWNERS

@@ -15,5 +15,5 @@
 /src/i18n/strings
 /src/i18n/strings/en_EN.json  @element-hq/element-web-reviewers
 # Ignore the synapse plugin as this is updated by GHA for docker image updating
-/playwright/plugins/homeserver/synapse/index.ts
+/playwright/testcontainers/synapse.ts
 

.github/labels.yml

@@ -210,6 +210,9 @@
 - name: "X-Upcoming-Release-Blocker"
   description: "This does not affect the current release cycle but will affect the next one"
   color: "e99695"
+- name: "X-Run-All-Tests"
+  description: "When applied to PRs, it'll run the full gamut of end-to-end tests on the PR"
+  color: "ff7979"
 - name: "Z-Actions"
   color: "ededed"
 - name: "Z-Cache-Confusion"

.github/workflows/deploy.yml

@@ -78,15 +78,15 @@ jobs:
             - name: Populate _headers
               run: cp .github/cfp_headers _deploy/_headers
 
-            # - name: Wait for other steps to succeed
-            #   uses: t3chguy/wait-on-check-action@18541021811b56544d90e0f073401c2b99e249d6 # fork
-            #   if: inputs.skip-checks != true
-            #   with:
-            #       ref: ${{ github.sha }}
-            #       running-workflow-name: "Deploy to Cloudflare Pages"
-            #       repo-token: ${{ secrets.GITHUB_TOKEN }}
-            #       wait-interval: 10
-            #       check-regexp: ^((?!SonarCloud|SonarQube|issue|board|label|Release|prepare|GitHub Pages).)*$
+            - name: Wait for other steps to succeed
+              uses: t3chguy/wait-on-check-action@18541021811b56544d90e0f073401c2b99e249d6 # fork
+              if: inputs.skip-checks != true
+              with:
+                  ref: ${{ github.sha }}
+                  running-workflow-name: "Deploy to Cloudflare Pages"
+                  repo-token: ${{ secrets.GITHUB_TOKEN }}
+                  wait-interval: 10
+                  check-regexp: ^((?!SonarCloud|SonarQube|issue|board|label|Release|prepare|GitHub Pages).)*$
 
             - name: Deploy to Cloudflare Pages
               uses: cloudflare/pages-action@f0a1cd58cd66095dee69bfa18fa5efd1dde93bca # v1

.github/workflows/dockerhub.yaml

@@ -24,10 +24,10 @@ jobs:
               uses: sigstore/cosign-installer@dc72c7d5c4d10cd6bcb8cf6e3fd625a9e5e537da # v3
 
             - name: Set up QEMU
-              uses: docker/setup-qemu-action@49b3bc8e6bdd4a60e6116a5414239cba5943d3cf # v3
+              uses: docker/setup-qemu-action@53851d14592bedcffcf25ea515637cff71ef929a # v3
 
             - name: Set up Docker Buildx
-              uses: docker/setup-buildx-action@c47758b77c9736f4b2ef4073d4d51994fabfe349 # v3
+              uses: docker/setup-buildx-action@6524bf65af31da8d45b59e8c27de4bd072b392f5 # v3
               with:
                   install: true
 
@@ -51,7 +51,7 @@ jobs:
 
             - name: Build and push
               id: build-and-push
-              uses: docker/build-push-action@48aba3b46d1b1fec4febb7c5d0c644b249a11355 # v6
+              uses: docker/build-push-action@b32b51a8eda65d6793cd0494a773d4f6bcef32dc # v6
               with:
                   context: .
                   push: true

.github/workflows/end-to-end-tests.yaml

@@ -48,6 +48,7 @@ jobs:
         outputs:
             num-runners: ${{ env.NUM_RUNNERS }}
             runners-matrix: ${{ steps.runner-vars.outputs.matrix }}
+            docker-cache-key: ${{ steps.runner-vars.outputs.docker-cache-key }}
         steps:
             - name: Checkout code
               uses: actions/checkout@v4
@@ -80,6 +81,12 @@ jobs:
               run: |
                   yarn build
 
+            # Heuristic for calculating a cache key which is based on all images we pass to testcontainers
+            - name: Calculate docker cache key
+              run: |
+                  grep -hr "Container(\"" --exclude-dir=snapshots --exclude-dir=sample-files playwright >> _docker_cache_key
+                  grep -hr -C1 "super(" playwright/testcontainers/ >> _docker_cache_key
+
             - name: Upload Artifact
               uses: actions/upload-artifact@v4
               with:
@@ -90,11 +97,14 @@ jobs:
             - name: Calculate runner variables
               id: runner-vars
               uses: actions/github-script@v7
+              env:
+                  DOCKER_CACHE_KEY: ${{ hashFiles('_docker_cache_key') }}
               with:
                   script: |
                       const numRunners = parseInt(process.env.NUM_RUNNERS, 10);
                       const matrix = Array.from({ length: numRunners }, (_, i) => i + 1);
                       core.setOutput("matrix", JSON.stringify(matrix));
+                      core.setOutput("docker-cache-key", process.env.DOCKER_CACHE_KEY);
 
     playwright:
         name: "Run Tests [${{ matrix.project }}] ${{ matrix.runner }}/${{ needs.build.outputs.num-runners }}"
@@ -114,13 +124,13 @@ jobs:
                     - Chrome
                     - Firefox
                     - WebKit
-                isCron:
-                    - ${{ github.event_name == 'schedule' }}
-                # Skip the Firefox & Safari runs unless this was a cron trigger
+                runAllTests:
+                    - ${{ github.event_name == 'schedule' || contains(github.event.pull_request.labels.*.name, 'X-Run-All-Tests') }}
+                # Skip the Firefox & Safari runs unless this was a cron trigger or PR has X-Run-All-Tests label
                 exclude:
-                    - isCron: false
+                    - runAllTests: false
                       project: Firefox
-                    - isCron: false
+                    - runAllTests: false
                       project: WebKit
         steps:
             - uses: actions/checkout@v4
@@ -164,13 +174,18 @@ jobs:
               if: matrix.project == 'WebKit' && steps.playwright-cache.outputs.cache-hit == 'true'
               run: yarn playwright install-deps webkit
 
+            - name: Docker image cache
+              uses: ScribeMD/docker-cache@fb28c93772363301b8d0a6072ce850224b73f74e # 0.5.0
+              with:
+                  key: ${{ needs.build.outputs.docker-cache-key }}
+
             # We skip tests tagged with @mergequeue when running on PRs, but run them in MQ and everywhere else
             - name: Run Playwright tests
               run: |
                   yarn playwright test \
                       --shard "${{ matrix.runner }}/${{ needs.build.outputs.num-runners }}" \
                       --project="${{ matrix.project }}" \
-                      ${{ github.event_name == 'pull_request' && '--grep-invert @mergequeue' || '' }}
+                      ${{ (github.event_name == 'pull_request' && matrix.runAllTests == false ) && '--grep-invert @mergequeue' || '' }}
 
             - name: Upload blob report to GitHub Actions Artifacts
               if: always()

.github/workflows/playwright-image-updates.yaml

@@ -17,13 +17,13 @@ jobs:
                   docker pull "$IMAGE"
                   INSPECT=$(docker inspect --format='{{index .RepoDigests 0}}' "$IMAGE")
                   DIGEST=${INSPECT#*@}
-                  sed -i "s/const DOCKER_TAG.*/const DOCKER_TAG = \"develop@$DIGEST\";/" playwright/plugins/homeserver/synapse/index.ts
+                  sed -i "s,`$IMAGE.*`,`$IMAGE@$DIGEST`," playwright/testcontainers/synapse.ts
               env:
                   IMAGE: ghcr.io/element-hq/synapse:develop
 
             - name: Create Pull Request
               id: cpr
-              uses: peter-evans/create-pull-request@5e914681df9dc83aa4e4905692ca88beb2f9e91f # v7
+              uses: peter-evans/create-pull-request@67ccf781d68cd99b580ae25a5c18a1cc84ffff1f # v7
               with:
                   token: ${{ secrets.ELEMENT_BOT_TOKEN }}
                   branch: actions/playwright-image-updates

.github/workflows/tests.yml

@@ -104,7 +104,7 @@ jobs:
 
             - name: Skip SonarCloud in merge queue
               if: github.event_name == 'merge_group' || inputs.disable_coverage == 'true'
-              uses: guibranco/github-status-action-v2@d469d49426f5a7b8a1fbcac20ad274d3e4892321
+              uses: guibranco/github-status-action-v2@56cd38caf0615dd03f49d42ed301f1469911ac61
               with:
                   authToken: ${{ secrets.GITHUB_TOKEN }}
                   state: success

.github/workflows/update-jitsi.yml

@@ -23,7 +23,7 @@ jobs:
               run: "yarn update:jitsi"
 
             - name: Create Pull Request
-              uses: peter-evans/create-pull-request@5e914681df9dc83aa4e4905692ca88beb2f9e91f # v7
+              uses: peter-evans/create-pull-request@67ccf781d68cd99b580ae25a5c18a1cc84ffff1f # v7
               with:
                   token: ${{ secrets.ELEMENT_BOT_TOKEN }}
                   branch: actions/jitsi-update

docs/playwright.md

@@ -23,21 +23,19 @@ element-web project is fine: leave it running it a different terminal as you wou
 when developing. Alternatively if you followed the development set up from element-web then
 Playwright will be capable of running the webserver on its own if it isn't already running.
 
-The tests use Docker to launch Homeserver (Synapse or Dendrite) instances to test against, so you'll also
-need to have Docker installed and working in order to run the Playwright tests.
+The tests use [testcontainers](https://node.testcontainers.org/) to launch Homeserver (Synapse or Dendrite)
+instances to test against, so you'll also need to one of the
+[supported container runtimes](#supporter-container-runtimes)
+installed and working in order to run the Playwright tests.
 
 There are a few different ways to run the tests yourself. The simplest is to run:
 
 ```shell
-docker pull ghcr.io/element-hq/synapse:develop
 yarn run test:playwright
 ```
 
 This will run the Playwright tests once, non-interactively.
 
-Note: you don't need to run the `docker pull` command every time, but you should
-do it regularly to ensure you are running against an up-to-date Synapse.
-
 You can also run individual tests this way too, as you'd expect:
 
 ```shell
@@ -61,29 +59,25 @@ Some tests are excluded from running on certain browsers due to incompatibilitie
 
 ## How the Tests Work
 
-Everything Playwright-related lives in the `playwright/` subdirectory of react-sdk
+Everything Playwright-related lives in the `playwright/` subdirectory
 as is typical for Playwright tests. Likewise, tests live in `playwright/e2e`.
 
-`playwright/plugins/homeservers` contains Playwright plugins that starts instances
-of Synapse/Dendrite in Docker containers. These servers are what Element-web runs
-against in the tests.
+`playwright/testcontainers` contains the testcontainers which start instances
+of Synapse/Dendrite. These servers are what Element-web runs against in the tests.
 
 Synapse can be launched with different configurations in order to test element
-in different configurations. `playwright/plugins/homeserver/synapse/templates`
-contains template configuration files for each different configuration.
+in different configurations. You can specify `synapseConfigOptions` as such:
 
-Each test suite can then launch whatever Synapse instances it needs in whatever
-configurations.
+```typescript
+test.use({
+    synapseConfigOptions: {
+        // The config options to pass to the Synapse instance
+    },
+});
+```
 
-Note that although tests should stop the Homeserver instances after running and the
-plugin also stop any remaining instances after all tests have run, it is possible
-to be left with some stray containers if, for example, you terminate a test such
-that the `after()` does not run and also exit Playwright uncleanly. All the containers
-it starts are prefixed, so they are easy to recognise. They can be removed safely.
-
-After each test run, logs from the Synapse instances are saved in `playwright/logs/synapse`
-with each instance in a separate directory named after its ID. These logs are removed
-at the start of each test run.
+The appropriate homeserver will be launched by the Playwright worker and reused for all tests which match the worker configuration.
+The logs from testcontainers will be attached to any reports output from Playwright.
 
 ## Writing Tests
 
@@ -113,25 +107,6 @@ Homeserver instances should be reasonably cheap to start (you may see the first
 while as it pulls the Docker image).
 You do not need to explicitly clean up the instance as it will be cleaned up by the fixture.
 
-### Synapse Config Templates
-
-When a Synapse instance is started, it's given a config generated from one of the config
-templates in `playwright/plugins/homeserver/synapse/templates`. There are a couple of special files
-in these templates:
-
-- `homeserver.yaml`:
-  Template substitution happens in this file. Template variables are:
-    - `REGISTRATION_SECRET`: The secret used to register users via the REST API.
-    - `MACAROON_SECRET_KEY`: Generated each time for security
-    - `FORM_SECRET`: Generated each time for security
-    - `PUBLIC_BASEURL`: The localhost url + port combination the synapse is accessible at
-- `localhost.signing.key`: A signing key is auto-generated and saved to this file.
-  Config templates should not contain a signing key and instead assume that one will exist
-  in this file.
-
-All other files in the template are copied recursively to `/data/`, so the file `foo.html`
-in a template can be referenced in the config as `/data/foo.html`.
-
 ### Logging In
 
 We again heavily leverage the magic of [Playwright fixtures](https://playwright.dev/docs/test-fixtures).
@@ -227,7 +202,13 @@ has to be disabled in Playwright on Firefox & Webkit to retain routing functiona
 Anything testing VoIP/microphone will need to have `@no-webkit` as fake microphone functionality is not available
 there at this time.
 
-## Colima
+If you wish to run all tests in a PR, you can give it the label `X-Run-All-Tests`.
+
+## Supporter container runtimes
+
+We use testcontainers to spin up various instances of Synapse, Matrix Authentication Service, and more.
+It supports Docker out of the box but also has support for Podman, Colima, Rancher, you just need to follow some instructions to achieve it:
+https://node.testcontainers.org/supported-container-runtimes/
 
 If you are running under Colima, you may need to set the environment variable `TMPDIR` to `/tmp/colima` or a path
 within `$HOME` to allow bind mounting temporary directories into the Docker containers.

package.json

@@ -71,9 +71,11 @@
         "update:jitsi": "curl -s https://meet.element.io/libs/external_api.min.js > ./res/jitsi_external_api.min.js"
     },
     "resolutions": {
+        "@types/react": "18.3.18",
+        "@types/react-dom": "18.3.5",
         "oidc-client-ts": "3.1.0",
         "jwt-decode": "4.0.0",
-        "caniuse-lite": "1.0.30001684",
+        "caniuse-lite": "1.0.30001690",
         "wrap-ansi-cjs": "npm:wrap-ansi@^7.0.0",
         "wrap-ansi": "npm:wrap-ansi@^7.0.0"
     },
@@ -88,7 +90,7 @@
         "@matrix-org/spec": "^1.7.0",
         "@sentry/browser": "^8.0.0",
         "@types/png-chunks-extract": "^1.0.2",
-        "@vector-im/compound-design-tokens": "^2.0.1",
+        "@vector-im/compound-design-tokens": "^2.1.0",
         "@vector-im/compound-web": "^7.5.0",
         "@vector-im/matrix-wysiwyg": "2.38.0",
         "@zxcvbn-ts/core": "^3.0.4",
@@ -122,7 +124,7 @@
         "linkify-string": "4.2.0",
         "linkifyjs": "4.2.0",
         "lodash": "^4.17.21",
-        "maplibre-gl": "^4.0.0",
+        "maplibre-gl": "^5.0.0",
         "matrix-encrypt-attachment": "^1.0.3",
         "matrix-events-sdk": "0.0.1",
         "matrix-js-sdk": "github:matrix-org/matrix-js-sdk#develop",
@@ -135,7 +137,7 @@
         "png-chunks-extract": "^1.0.0",
         "posthog-js": "1.157.2",
         "qrcode": "1.5.4",
-        "re-resizable": "6.10.1",
+        "re-resizable": "6.10.3",
         "react": "^18.3.1",
         "react-beautiful-dnd": "^13.1.0",
         "react-blurhash": "^0.3.0",
@@ -144,12 +146,14 @@
         "react-transition-group": "^4.4.1",
         "rfc4648": "^1.4.0",
         "sanitize-filename": "^1.6.3",
-        "sanitize-html": "2.13.1",
+        "sanitize-html": "2.14.0",
         "tar-js": "^0.3.0",
         "temporal-polyfill": "^0.2.5",
         "ua-parser-js": "^1.0.2",
         "uuid": "^11.0.0",
-        "what-input": "^5.2.10"
+        "what-input": "^5.2.10",
+        "@types/react-virtualized": "^9.21.30",
+        "react-virtualized": "^9.22.5"
     },
     "devDependencies": {
         "@action-validator/cli": "^0.6.0",
@@ -178,6 +182,7 @@
         "@sentry/webpack-plugin": "^2.7.1",
         "@stylistic/eslint-plugin": "^2.9.0",
         "@svgr/webpack": "^8.0.0",
+        "@testcontainers/postgresql": "^10.16.0",
         "@testing-library/dom": "^10.4.0",
         "@testing-library/jest-dom": "^6.4.8",
         "@testing-library/react": "^16.0.0",
@@ -189,7 +194,6 @@
         "@types/escape-html": "^1.0.1",
         "@types/express": "^5.0.0",
         "@types/file-saver": "^2.0.3",
-        "@types/fs-extra": "^11.0.0",
         "@types/glob-to-regexp": "^0.4.1",
         "@types/jest": "29.5.12",
         "@types/jitsi-meet": "^2.0.2",
@@ -202,17 +206,17 @@
         "@types/node-fetch": "^2.6.2",
         "@types/pako": "^2.0.0",
         "@types/qrcode": "^1.3.5",
-        "@types/react": "18.3.3",
+        "@types/react": "18.3.18",
         "@types/react-beautiful-dnd": "^13.0.0",
-        "@types/react-dom": "18.3.1",
+        "@types/react-dom": "18.3.5",
         "@types/react-transition-group": "^4.4.0",
         "@types/sanitize-html": "2.13.0",
         "@types/semver": "^7.5.8",
         "@types/tar-js": "^0.3.5",
         "@types/ua-parser-js": "^0.7.36",
         "@types/uuid": "^10.0.0",
-        "@typescript-eslint/eslint-plugin": "^8.0.0",
-        "@typescript-eslint/parser": "^8.0.0",
+        "@typescript-eslint/eslint-plugin": "^8.19.0",
+        "@typescript-eslint/parser": "^8.19.0",
         "babel-jest": "^29.0.0",
         "babel-loader": "^9.0.0",
         "babel-plugin-jsx-remove-data-test-id": "^3.0.0",
@@ -241,7 +245,6 @@
         "fetch-mock": "9.11.0",
         "fetch-mock-jest": "^1.5.1",
         "file-loader": "^6.0.0",
-        "fs-extra": "^11.0.0",
         "glob": "^11.0.0",
         "html-webpack-plugin": "^5.5.3",
         "husky": "^9.0.0",
@@ -255,12 +258,12 @@
         "lint-staged": "^15.0.2",
         "mailhog": "^4.16.0",
         "matrix-web-i18n": "^3.2.1",
-        "mini-css-extract-plugin": "2.9.0",
+        "mini-css-extract-plugin": "2.9.2",
         "minimist": "^1.2.6",
         "modernizr": "^3.12.0",
         "node-fetch": "^2.6.7",
         "playwright-core": "^1.45.1",
-        "postcss": "8.4.38",
+        "postcss": "8.4.46",
         "postcss-easings": "^4.0.0",
         "postcss-hexrgba": "2.1.0",
         "postcss-import": "16.1.0",
@@ -276,11 +279,13 @@
         "rimraf": "^6.0.0",
         "semver": "^7.5.2",
         "source-map-loader": "^5.0.0",
+        "strip-ansi": "^7.1.0",
         "stylelint": "^16.1.0",
         "stylelint-config-standard": "^36.0.0",
         "stylelint-scss": "^6.0.0",
         "stylelint-value-no-unknown-custom-properties": "^6.0.1",
         "terser-webpack-plugin": "^5.3.9",
+        "testcontainers": "^10.16.0",
         "ts-node": "^10.9.1",
         "ts-prune": "^0.10.3",
         "typescript": "5.7.2",
@@ -288,7 +293,7 @@
         "web-streams-polyfill": "^4.0.0",
         "webpack": "^5.89.0",
         "webpack-bundle-analyzer": "^4.8.0",
-        "webpack-cli": "^5.0.0",
+        "webpack-cli": "^6.0.0",
         "webpack-dev-server": "^5.0.0",
         "webpack-version-file-plugin": "^0.5.0",
         "yaml": "^2.3.3"

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

@@ -13,7 +13,9 @@ Please see LICENSE files in the repository root for full details.
 import { expect, test } from "../../element-web-test";
 
 test.use({
-    startHomeserverOpts: "guest-enabled",
+    synapseConfigOptions: {
+        allow_guest_access: true,
+    },
 });
 
 test("Shows the welcome page by default", async ({ page }) => {

playwright/e2e/crypto/backups-mas.spec.ts

@@ -0,0 +1,91 @@
+/*
+Copyright 2024 New Vector Ltd.
+Copyright 2023 The Matrix.org Foundation C.I.C.
+
+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 { test, expect } from "../../element-web-test";
+import { registerAccountMas } from "../oidc";
+import { isDendrite } from "../../plugins/homeserver/dendrite";
+import { TestClientServerAPI } from "../csAPI";
+import { masHomeserver } from "../../plugins/homeserver/synapse/masHomeserver.ts";
+
+// These tests register an account with MAS because then we go through the "normal" registration flow
+// and crypto gets set up. Using the 'user' fixture create a a user an synthesizes an existing login,
+// which is faster but leaves us without crypto set up.
+test.use(masHomeserver);
+test.describe("Encryption state after registration", () => {
+    test.skip(isDendrite, "does not yet support MAS");
+
+    test("Key backup is enabled by default", async ({ page, mailhogClient, app }) => {
+        await page.goto("/#/login");
+        await page.getByRole("button", { name: "Continue" }).click();
+        await registerAccountMas(page, mailhogClient, "alice", "alice@email.com", "Pa$sW0rD!");
+
+        await app.settings.openUserSettings("Security & Privacy");
+        await expect(page.getByText("This session is backing up your keys.")).toBeVisible();
+    });
+
+    test("user is prompted to set up recovery", async ({ page, mailhogClient, app }) => {
+        await page.goto("/#/login");
+        await page.getByRole("button", { name: "Continue" }).click();
+        await registerAccountMas(page, mailhogClient, "alice", "alice@email.com", "Pa$sW0rD!");
+
+        await page.getByRole("button", { name: "Add room" }).click();
+        await page.getByRole("menuitem", { name: "New room" }).click();
+        await page.getByRole("textbox", { name: "Name" }).fill("test room");
+        await page.getByRole("button", { name: "Create room" }).click();
+
+        await expect(page.getByRole("heading", { name: "Set up recovery" })).toBeVisible();
+    });
+});
+
+test.describe("Key backup reset from elsewhere", () => {
+    test.skip(isDendrite, "does not yet support MAS");
+
+    test("Key backup is disabled when reset from elsewhere", async ({ page, mailhogClient, request, homeserver }) => {
+        const testUsername = "alice";
+        const testPassword = "Pa$sW0rD!";
+
+        // there's a delay before keys are uploaded so the error doesn't appear immediately: use a fake
+        // clock so we can skip the delay
+        await page.clock.install();
+
+        await page.goto("/#/login");
+        await page.getByRole("button", { name: "Continue" }).click();
+        await registerAccountMas(page, mailhogClient, testUsername, "alice@email.com", testPassword);
+
+        await page.getByRole("button", { name: "Add room" }).click();
+        await page.getByRole("menuitem", { name: "New room" }).click();
+        await page.getByRole("textbox", { name: "Name" }).fill("test room");
+        await page.getByRole("button", { name: "Create room" }).click();
+
+        // @ts-ignore - this runs in the browser scope where mxMatrixClientPeg is a thing. Here, it is not.
+        const accessToken = await page.evaluate(() => mxMatrixClientPeg.get().getAccessToken());
+
+        const csAPI = new TestClientServerAPI(request, homeserver, accessToken);
+
+        const backupInfo = await csAPI.getCurrentBackupInfo();
+
+        await csAPI.deleteBackupVersion(backupInfo.version);
+
+        await page.getByRole("textbox", { name: "Send an encrypted message…" }).fill("/discardsession");
+        await page.getByRole("button", { name: "Send message" }).click();
+
+        await page.getByRole("textbox", { name: "Send an encrypted message…" }).fill("Message with broken key backup");
+        await page.getByRole("button", { name: "Send message" }).click();
+
+        // Should be the message we sent plus the room creation event
+        await expect(page.locator(".mx_EventTile")).toHaveCount(2);
+        await expect(
+            page.locator(".mx_RoomView_MessageList > .mx_EventTile_last .mx_EventTile_receiptSent"),
+        ).toBeVisible();
+
+        // Wait for it to try uploading the key
+        await page.clock.fastForward(20000);
+
+        await expect(page.getByRole("heading", { level: 1, name: "New Recovery Method" })).toBeVisible();
+    });
+});

playwright/e2e/crypto/backups.spec.ts

@@ -9,9 +9,6 @@ Please see LICENSE files in the repository root for full details.
 import { type Page } from "@playwright/test";
 
 import { test, expect } from "../../element-web-test";
-import { test as masTest, registerAccountMas } from "../oidc";
-import { isDendrite } from "../../plugins/homeserver/dendrite";
-import { TestClientServerAPI } from "../csAPI";
 
 async function expectBackupVersionToBe(page: Page, version: string) {
     await expect(page.locator(".mx_SecureBackupPanel_statusList tr:nth-child(5) td")).toHaveText(
@@ -21,88 +18,6 @@ async function expectBackupVersionToBe(page: Page, version: string) {
     await expect(page.locator(".mx_SecureBackupPanel_statusList tr:nth-child(6) td")).toHaveText(version);
 }
 
-// These tests register an account with MAS because then we go through the "normal" registration flow
-// and crypto gets set up. Using the 'user' fixture create a a user an synthesizes an existing login,
-// which is faster but leaves us without crypto set up.
-masTest.describe("Encryption state after registration", () => {
-    masTest.skip(isDendrite, "does not yet support MAS");
-
-    masTest("Key backup is enabled by default", async ({ page, mailhog, app }) => {
-        await page.goto("/#/login");
-        await page.getByRole("button", { name: "Continue" }).click();
-        await registerAccountMas(page, mailhog.api, "alice", "alice@email.com", "Pa$sW0rD!");
-
-        await app.settings.openUserSettings("Security & Privacy");
-        await expect(page.getByText("This session is backing up your keys.")).toBeVisible();
-    });
-
-    masTest("user is prompted to set up recovery", async ({ page, mailhog, app }) => {
-        await page.goto("/#/login");
-        await page.getByRole("button", { name: "Continue" }).click();
-        await registerAccountMas(page, mailhog.api, "alice", "alice@email.com", "Pa$sW0rD!");
-
-        await page.getByRole("button", { name: "Add room" }).click();
-        await page.getByRole("menuitem", { name: "New room" }).click();
-        await page.getByRole("textbox", { name: "Name" }).fill("test room");
-        await page.getByRole("button", { name: "Create room" }).click();
-
-        await expect(page.getByRole("heading", { name: "Set up recovery" })).toBeVisible();
-    });
-});
-
-masTest.describe("Key backup reset from elsewhere", () => {
-    masTest.skip(isDendrite, "does not yet support MAS");
-
-    masTest(
-        "Key backup is disabled when reset from elsewhere",
-        async ({ page, mailhog, request, masPrepare, homeserver }) => {
-            const testUsername = "alice";
-            const testPassword = "Pa$sW0rD!";
-
-            // there's a delay before keys are uploaded so the error doesn't appear immediately: use a fake
-            // clock so we can skip the delay
-            await page.clock.install();
-
-            await page.goto("/#/login");
-            await page.getByRole("button", { name: "Continue" }).click();
-            await registerAccountMas(page, mailhog.api, testUsername, "alice@email.com", testPassword);
-
-            await page.getByRole("button", { name: "Add room" }).click();
-            await page.getByRole("menuitem", { name: "New room" }).click();
-            await page.getByRole("textbox", { name: "Name" }).fill("test room");
-            await page.getByRole("button", { name: "Create room" }).click();
-
-            // @ts-ignore - this runs in the browser scope where mxMatrixClientPeg is a thing. Here, it is not.
-            const accessToken = await page.evaluate(() => mxMatrixClientPeg.get().getAccessToken());
-
-            const csAPI = new TestClientServerAPI(request, homeserver, accessToken);
-
-            const backupInfo = await csAPI.getCurrentBackupInfo();
-
-            await csAPI.deleteBackupVersion(backupInfo.version);
-
-            await page.getByRole("textbox", { name: "Send an encrypted message…" }).fill("/discardsession");
-            await page.getByRole("button", { name: "Send message" }).click();
-
-            await page
-                .getByRole("textbox", { name: "Send an encrypted message…" })
-                .fill("Message with broken key backup");
-            await page.getByRole("button", { name: "Send message" }).click();
-
-            // Should be the message we sent plus the room creation event
-            await expect(page.locator(".mx_EventTile")).toHaveCount(2);
-            await expect(
-                page.locator(".mx_RoomView_MessageList > .mx_EventTile_last .mx_EventTile_receiptSent"),
-            ).toBeVisible();
-
-            // Wait for it to try uploading the key
-            await page.clock.fastForward(20000);
-
-            await expect(page.getByRole("heading", { level: 1, name: "New Recovery Method" })).toBeVisible();
-        },
-    );
-});
-
 test.describe("Backups", () => {
     test.use({
         displayName: "Hanako",

playwright/e2e/crypto/dehydration.spec.ts

@@ -8,14 +8,24 @@ Please see LICENSE files in the repository root for full details.
 
 import { Locator, type Page } from "@playwright/test";
 
-import { test as base, expect, Fixtures } from "../../element-web-test";
+import { test, expect } from "../../element-web-test";
 import { viewRoomSummaryByName } from "../right-panel/utils";
 import { isDendrite } from "../../plugins/homeserver/dendrite";
 
-const test = base.extend<Fixtures>({
-    // eslint-disable-next-line no-empty-pattern
-    startHomeserverOpts: async ({}, use) => {
-        await use("dehydration");
+const ROOM_NAME = "Test room";
+const NAME = "Alice";
+
+function getMemberTileByName(page: Page, name: string): Locator {
+    return page.locator(`.mx_MemberTileView, [title="${name}"]`);
+}
+
+test.use({
+    displayName: NAME,
+    synapseConfigOptions: {
+        experimental_features: {
+            msc2697_enabled: false,
+            msc3814_enabled: true,
+        },
     },
     config: async ({ config, context }, use) => {
         const wellKnown = {
@@ -31,20 +41,9 @@ const test = base.extend<Fixtures>({
     },
 });
 
-const ROOM_NAME = "Test room";
-const NAME = "Alice";
-
-function getMemberTileByName(page: Page, name: string): Locator {
-    return page.locator(`.mx_EntityTile, [title="${name}"]`);
-}
-
 test.describe("Dehydration", () => {
     test.skip(isDendrite, "does not yet support dehydration v2");
 
-    test.use({
-        displayName: NAME,
-    });
-
     test("Create dehydrated device", async ({ page, user, app }, workerInfo) => {
         // Create a backup (which will create SSSS, and dehydrated device)
 
@@ -89,7 +88,7 @@ test.describe("Dehydration", () => {
         await viewRoomSummaryByName(page, app, ROOM_NAME);
 
         await page.locator(".mx_RightPanel").getByRole("menuitem", { name: "People" }).click();
-        await expect(page.locator(".mx_MemberList")).toBeVisible();
+        await expect(page.locator(".mx_MemberListView")).toBeVisible();
 
         await getMemberTileByName(page, NAME).click();
         await page.locator(".mx_UserInfo_devices .mx_UserInfo_expand").click();

playwright/e2e/crypto/migration.spec.ts

@@ -9,24 +9,24 @@ Please see LICENSE files in the repository root for full details.
 import path from "path";
 import { readFile } from "node:fs/promises";
 
-import { expect, Fixtures, test as base } from "../../element-web-test";
-
-const test = base.extend<Fixtures>({
-    // Replace the `user` fixture with one which populates the indexeddb data before starting the app.
-    user: async ({ context, pageWithCredentials: page, credentials }, use) => {
-        await page.route(`/test_indexeddb_cryptostore_dump/*`, async (route, request) => {
-            const resourcePath = path.join(__dirname, new URL(request.url()).pathname);
-            const body = await readFile(resourcePath, { encoding: "utf-8" });
-            await route.fulfill({ body });
-        });
-        await page.goto("/test_indexeddb_cryptostore_dump/index.html");
-
-        await use(credentials);
-    },
-});
+import { expect, test } from "../../element-web-test";
 
 test.describe("migration", { tag: "@no-webkit" }, function () {
-    test.use({ displayName: "Alice" });
+    test.use({
+        displayName: "Alice",
+
+        // Replace the `user` fixture with one which populates the indexeddb data before starting the app.
+        user: async ({ context, pageWithCredentials: page, credentials }, use) => {
+            await page.route(`/test_indexeddb_cryptostore_dump/*`, async (route, request) => {
+                const resourcePath = path.join(__dirname, new URL(request.url()).pathname);
+                const body = await readFile(resourcePath, { encoding: "utf-8" });
+                await route.fulfill({ body });
+            });
+            await page.goto("/test_indexeddb_cryptostore_dump/index.html");
+
+            await use(credentials);
+        },
+    });
 
     test("Should support migration from legacy crypto", async ({ context, user, page }, workerInfo) => {
         test.slow();

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

@@ -8,32 +8,29 @@ Please see LICENSE files in the repository root for full details.
 
 import { expect, test } from "../../element-web-test";
 import { selectHomeserver } from "../utils";
+import { emailHomeserver } from "../../plugins/homeserver/synapse/emailHomeserver.ts";
+import { isDendrite } from "../../plugins/homeserver/dendrite";
 
 const username = "user1234";
 // this has to be password-like enough to please zxcvbn. Needless to say it's just from pwgen.
 const password = "oETo7MPf0o";
 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",
-                },
+test.use(emailHomeserver);
+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",
-                variables: {
-                    SMTP_HOST: "host.containers.internal",
-                    SMTP_PORT: mailhog.instance.smtpPort,
-                },
-            }),
-    });
+    },
+});
+
+test.describe("Forgot Password", () => {
+    test.skip(isDendrite, "not yet wired up");
 
     test("renders properly", { tag: "@screenshot" }, async ({ page, homeserver }) => {
         await page.goto("/");

playwright/e2e/lazy-loading/lazy-loading.spec.ts

@@ -78,7 +78,7 @@ test.describe("Lazy Loading", () => {
     }
 
     function getMemberInMemberlist(page: Page, name: string): Locator {
-        return page.locator(".mx_MemberList .mx_EntityTile_name").filter({ hasText: name });
+        return page.locator(".mx_MemberListView .mx_MemberTileView_name").filter({ hasText: name });
     }
 
     async function checkMemberList(page: Page, charlies: Bot[]) {

playwright/e2e/login/consent.spec.ts

@@ -7,13 +7,14 @@ Please see LICENSE files in the repository root for full details.
 */
 
 import { test, expect } from "../../element-web-test";
+import { consentHomeserver } from "../../plugins/homeserver/synapse/consentHomeserver.ts";
+
+test.use(consentHomeserver);
+test.use({
+    displayName: "Bob",
+});
 
 test.describe("Consent", () => {
-    test.use({
-        startHomeserverOpts: "consent",
-        displayName: "Bob",
-    });
-
     test("should prompt the user to consent to terms when server deems it necessary", async ({
         context,
         page,

playwright/e2e/login/login-consent.spec.ts

@@ -9,11 +9,11 @@ Please see LICENSE files in the repository root for full details.
 import { Page } from "playwright-core";
 
 import { expect, test } from "../../element-web-test";
-import { doTokenRegistration } from "./utils";
-import { isDendrite } from "../../plugins/homeserver/dendrite";
 import { selectHomeserver } from "../utils";
 import { Credentials, HomeserverInstance } from "../../plugins/homeserver";
+import { consentHomeserver } from "../../plugins/homeserver/synapse/consentHomeserver.ts";
 
+// This test requires fixed credentials for the device signing keys below to work
 const username = "user1234";
 const password = "p4s5W0rD";
 
@@ -68,38 +68,42 @@ const DEVICE_SIGNING_KEYS_BODY = {
     },
 };
 
-async function login(page: Page, homeserver: HomeserverInstance) {
+async function login(page: Page, homeserver: HomeserverInstance, credentials: Credentials) {
     await page.getByRole("link", { name: "Sign in" }).click();
     await selectHomeserver(page, homeserver.baseUrl);
 
-    await page.getByRole("textbox", { name: "Username" }).fill(username);
-    await page.getByPlaceholder("Password").fill(password);
+    await page.getByRole("textbox", { name: "Username" }).fill(credentials.username);
+    await page.getByPlaceholder("Password").fill(credentials.password);
     await page.getByRole("button", { name: "Sign in" }).click();
 }
 
-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.use(consentHomeserver);
+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",
             },
         },
-    });
+    },
+    credentials: async ({ context, homeserver }, use) => {
+        const displayName = "Dave";
+        const credentials = await homeserver.registerUser(username, password, displayName);
+        console.log(`Registered test user @user:localhost with displayname ${displayName}`);
 
-    test.describe("Password login", () => {
-        test.use({ startHomeserverOpts: "consent" });
-
-        let creds: Credentials;
-
-        test.beforeEach(async ({ homeserver }) => {
-            creds = await homeserver.registerUser(username, password);
+        await use({
+            ...credentials,
+            displayName,
         });
+    },
+});
 
+test.describe("Login", () => {
+    test.describe("Password login", () => {
         test("Loads the welcome page by default; then logs in with an existing account and lands on the home screen", async ({
+            credentials,
             page,
             homeserver,
             checkA11y,
@@ -133,16 +137,16 @@ test.describe("Login", () => {
             // cy.percySnapshot("Login");
             await checkA11y();
 
-            await page.getByRole("textbox", { name: "Username" }).fill(username);
-            await page.getByPlaceholder("Password").fill(password);
+            await page.getByRole("textbox", { name: "Username" }).fill(credentials.username);
+            await page.getByPlaceholder("Password").fill(credentials.password);
             await page.getByRole("button", { name: "Sign in" }).click();
 
             await expect(page).toHaveURL(/\/#\/home$/);
         });
 
-        test("Follows the original link after login", async ({ page, homeserver }) => {
+        test("Follows the original link after login", async ({ page, homeserver, credentials }) => {
             await page.goto("/#/room/!room:id"); // should redirect to the welcome page
-            await login(page, homeserver);
+            await login(page, homeserver, credentials);
 
             await expect(page).toHaveURL(/\/#\/room\/!room:id$/);
             await expect(page.getByRole("button", { name: "Join the discussion" })).toBeVisible();
@@ -153,9 +157,10 @@ test.describe("Login", () => {
                 page,
                 homeserver,
                 request,
+                credentials,
             }) => {
                 const res = await request.post(`${homeserver.baseUrl}/_matrix/client/v3/keys/device_signing/upload`, {
-                    headers: { Authorization: `Bearer ${creds.accessToken}` },
+                    headers: { Authorization: `Bearer ${credentials.accessToken}` },
                     data: DEVICE_SIGNING_KEYS_BODY,
                 });
                 if (res.status() / 100 !== 2) {
@@ -164,7 +169,7 @@ test.describe("Login", () => {
                 expect(res.status() / 100).toEqual(2);
 
                 await page.goto("/");
-                await login(page, homeserver);
+                await login(page, homeserver, credentials);
 
                 await expect(page.getByRole("heading", { name: "Verify this device", level: 1 })).toBeVisible();
 
@@ -182,10 +187,14 @@ test.describe("Login", () => {
                     page,
                     homeserver,
                     request,
+                    credentials,
                 }) => {
                     const res = await request.post(
                         `${homeserver.baseUrl}/_matrix/client/v3/keys/device_signing/upload`,
-                        { headers: { Authorization: `Bearer ${creds.accessToken}` }, data: DEVICE_SIGNING_KEYS_BODY },
+                        {
+                            headers: { Authorization: `Bearer ${credentials.accessToken}` },
+                            data: DEVICE_SIGNING_KEYS_BODY,
+                        },
                     );
                     if (res.status() / 100 !== 2) {
                         console.log("Uploading dummy keys failed", await res.json());
@@ -193,7 +202,7 @@ test.describe("Login", () => {
                     expect(res.status() / 100).toEqual(2);
 
                     await page.goto("/");
-                    await login(page, homeserver);
+                    await login(page, homeserver, credentials);
 
                     await expect(page.getByRole("heading", { name: "Verify this device", level: 1 })).toBeVisible();
 
@@ -212,11 +221,15 @@ test.describe("Login", () => {
                     page,
                     homeserver,
                     request,
+                    credentials,
                 }) => {
-                    console.log(`uid ${creds.userId} body`, DEVICE_SIGNING_KEYS_BODY);
+                    console.log(`uid ${credentials.userId} body`, DEVICE_SIGNING_KEYS_BODY);
                     const res = await request.post(
                         `${homeserver.baseUrl}/_matrix/client/v3/keys/device_signing/upload`,
-                        { headers: { Authorization: `Bearer ${creds.accessToken}` }, data: DEVICE_SIGNING_KEYS_BODY },
+                        {
+                            headers: { Authorization: `Bearer ${credentials.accessToken}` },
+                            data: DEVICE_SIGNING_KEYS_BODY,
+                        },
                     );
                     if (res.status() / 100 !== 2) {
                         console.log("Uploading dummy keys failed", await res.json());
@@ -224,9 +237,9 @@ test.describe("Login", () => {
                     expect(res.status() / 100).toEqual(2);
 
                     await page.goto("/");
-                    await login(page, homeserver);
+                    await login(page, homeserver, credentials);
 
-                    const h1 = await page.getByRole("heading", { name: "Verify this device", level: 1 });
+                    const h1 = page.getByRole("heading", { name: "Verify this device", level: 1 });
                     await expect(h1).toBeVisible();
 
                     await expect(h1.locator(".mx_CompleteSecurity_skip")).toHaveCount(0);
@@ -235,32 +248,7 @@ test.describe("Login", () => {
         });
     });
 
-    // tests for old-style SSO login, in which we exchange tokens with Synapse, and Synapse talks to an auth server
-    test.describe("SSO login", () => {
-        test.skip(isDendrite, "does not yet support SSO");
-
-        test.use({
-            startHomeserverOpts: ({ oAuthServer }, use) =>
-                use({
-                    template: "default",
-                    oAuthServerPort: oAuthServer.port,
-                }),
-        });
-
-        test("logs in with SSO and lands on the home screen", async ({ page, homeserver }) => {
-            // If this test fails with a screen showing "Timeout connecting to remote server", it is most likely due to
-            // your firewall settings: Synapse is unable to reach the OIDC server.
-            //
-            // If you are using ufw, try something like:
-            //    sudo ufw allow in on docker0
-            //
-            await doTokenRegistration(page, homeserver);
-        });
-    });
-
     test.describe("logout", () => {
-        test.use({ startHomeserverOpts: "consent" });
-
         test("should go to login page on logout", async ({ page, user }) => {
             await page.getByRole("button", { name: "User menu" }).click();
             await expect(page.getByText(user.displayName, { exact: true })).toBeVisible();
@@ -272,29 +260,4 @@ test.describe("Login", () => {
             await expect(page).toHaveURL(/\/#\/login$/);
         });
     });
-
-    test.describe("logout with logout_redirect_url", () => {
-        test.use({
-            startHomeserverOpts: "consent",
-            config: {
-                // We redirect to decoder-ring because it's a predictable page that isn't Element itself.
-                // We could use example.org, matrix.org, or something else, however this puts dependency of external
-                // infrastructure on our tests. In the same vein, we don't really want to figure out how to ship a
-                // `test-landing.html` page when running with an uncontrolled Element (via `yarn start`).
-                // Using the decoder-ring is just as fine, and we can search for strategic names.
-                logout_redirect_url: "/decoder-ring/",
-            },
-        });
-
-        test("should respect logout_redirect_url", async ({ page, user }) => {
-            await page.getByRole("button", { name: "User menu" }).click();
-            await expect(page.getByText(user.displayName, { exact: true })).toBeVisible();
-
-            // give a change for the outstanding requests queue to settle before logging out
-            await page.waitForTimeout(2000);
-
-            await page.locator(".mx_UserMenu_contextMenu").getByRole("menuitem", { name: "Sign out" }).click();
-            await expect(page).toHaveURL(/\/decoder-ring\/$/);
-        });
-    });
 });

playwright/e2e/login/login-sso.spec.ts

@@ -0,0 +1,29 @@
+/*
+Copyright 2024 New Vector Ltd.
+Copyright 2023 The Matrix.org Foundation C.I.C.
+
+SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
+Please see LICENSE files in the repository root for full details.
+*/
+
+import { test } from "../../element-web-test";
+import { doTokenRegistration } from "./utils";
+import { isDendrite } from "../../plugins/homeserver/dendrite";
+import { legacyOAuthHomeserver } from "../../plugins/homeserver/synapse/legacyOAuthHomeserver.ts";
+
+test.use(legacyOAuthHomeserver);
+
+// tests for old-style SSO login, in which we exchange tokens with Synapse, and Synapse talks to an auth server
+test.describe("SSO login", () => {
+    test.skip(isDendrite, "does not yet support SSO");
+
+    test("logs in with SSO and lands on the home screen", async ({ page, homeserver }) => {
+        // If this test fails with a screen showing "Timeout connecting to remote server", it is most likely due to
+        // your firewall settings: Synapse is unable to reach the OIDC server.
+        //
+        // If you are using ufw, try something like:
+        //    sudo ufw allow in on docker0
+        //
+        await doTokenRegistration(page, homeserver);
+    });
+});

playwright/e2e/login/logout_redirect_url.spec.ts

@@ -0,0 +1,35 @@
+/*
+Copyright 2024 New Vector Ltd.
+Copyright 2023 The Matrix.org Foundation C.I.C.
+
+SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
+Please see LICENSE files in the repository root for full details.
+*/
+
+import { expect, test } from "../../element-web-test";
+import { consentHomeserver } from "../../plugins/homeserver/synapse/consentHomeserver.ts";
+
+test.use(consentHomeserver);
+test.use({
+    config: {
+        // We redirect to decoder-ring because it's a predictable page that isn't Element itself.
+        // We could use example.org, matrix.org, or something else, however this puts dependency of external
+        // infrastructure on our tests. In the same vein, we don't really want to figure out how to ship a
+        // `test-landing.html` page when running with an uncontrolled Element (via `yarn start`).
+        // Using the decoder-ring is just as fine, and we can search for strategic names.
+        logout_redirect_url: "/decoder-ring/",
+    },
+});
+
+test.describe("logout with logout_redirect_url", () => {
+    test("should respect logout_redirect_url", async ({ page, user }) => {
+        await page.getByRole("button", { name: "User menu" }).click();
+        await expect(page.getByText(user.displayName, { exact: true })).toBeVisible();
+
+        // give a change for the outstanding requests queue to settle before logging out
+        await page.waitForTimeout(2000);
+
+        await page.locator(".mx_UserMenu_contextMenu").getByRole("menuitem", { name: "Sign out" }).click();
+        await expect(page).toHaveURL(/\/decoder-ring\/$/);
+    });
+});

playwright/e2e/login/soft_logout.spec.ts

@@ -6,128 +6,38 @@ 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 { Page } from "@playwright/test";
-
 import { test, expect } from "../../element-web-test";
-import { doTokenRegistration } from "./utils";
-import { Credentials } from "../../plugins/homeserver";
-import { isDendrite } from "../../plugins/homeserver/dendrite";
+import { interceptRequestsWithSoftLogout } from "./utils";
 
-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",
-                },
+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",
-                oAuthServerPort: oAuthServer.port,
-            }),
-    });
-
-    test.describe("with password user", () => {
-        test("shows the soft-logout page when a request fails, and allows a re-login", async ({ page, user }) => {
-            await interceptRequestsWithSoftLogout(page, user);
-            await expect(page.getByText("You're signed out")).toBeVisible();
-            await page.getByPlaceholder("Password").fill(user.password);
-            await page.getByPlaceholder("Password").press("Enter");
-
-            // back to the welcome page
-            await expect(page).toHaveURL(/\/#\/home/);
-            await expect(
-                page.getByRole("heading", { name: "Now, let's help you get started", exact: true }),
-            ).toBeVisible();
-        });
-
-        test("still shows the soft-logout page when the page is reloaded after a soft-logout", async ({
-            page,
-            user,
-        }) => {
-            await interceptRequestsWithSoftLogout(page, user);
-            await expect(page.getByText("You're signed out")).toBeVisible();
-            await page.reload();
-            await expect(page.getByText("You're signed out")).toBeVisible();
-        });
-    });
-
-    test.describe("with SSO user", () => {
-        test.skip(isDendrite, "does not yet support SSO");
-
-        test.use({
-            user: async ({ page, homeserver }, use) => {
-                const user = await doTokenRegistration(page, homeserver);
-
-                // Eventually, we should end up at the home screen.
-                await expect(page).toHaveURL(/\/#\/home$/);
-                await expect(page.getByRole("heading", { name: "Welcome Alice", exact: true })).toBeVisible();
-
-                await use(user);
-            },
-        });
-
-        test("shows the soft-logout page when a request fails, and allows a re-login", async ({ page, user }) => {
-            await expect(page.getByRole("heading", { name: "Welcome Alice", exact: true })).toBeVisible();
-
-            await interceptRequestsWithSoftLogout(page, user);
-
-            await expect(page.getByText("You're signed out")).toBeVisible();
-            await page.getByRole("button", { name: "Continue with OAuth test" }).click();
-
-            // click the submit button
-            await page.getByRole("button", { name: "Submit" }).click();
-
-            // Synapse prompts us to grant permission to Element
-            await expect(page.getByRole("heading", { name: "Continue to your account" })).toBeVisible();
-            await page.getByRole("link", { name: "Continue" }).click();
-
-            // back to the welcome page
-            await expect(page).toHaveURL(/\/#\/home$/);
-            await expect(page.getByRole("heading", { name: "Welcome Alice", exact: true })).toBeVisible();
-        });
-    });
+    },
 });
 
-/**
- * Intercept calls to /sync and have them fail with a soft-logout
- *
- * Any further requests to /sync with the same access token are blocked.
- */
-async function interceptRequestsWithSoftLogout(page: Page, user: Credentials): Promise<void> {
-    await page.route("**/_matrix/client/*/sync*", async (route, req) => {
-        const accessToken = await req.headerValue("Authorization");
+test.describe("Soft logout with password user", () => {
+    test("shows the soft-logout page when a request fails, and allows a re-login", async ({ page, user }) => {
+        await interceptRequestsWithSoftLogout(page, user);
+        await expect(page.getByText("You're signed out")).toBeVisible();
+        await page.getByPlaceholder("Password").fill(user.password);
+        await page.getByPlaceholder("Password").press("Enter");
 
-        // now, if the access token on this request matches the expired one, block it
-        if (accessToken === `Bearer ${user.accessToken}`) {
-            console.log("Intercepting request with soft-logged-out access token");
-            await route.fulfill({
-                status: 401,
-                json: {
-                    errcode: "M_UNKNOWN_TOKEN",
-                    error: "Soft logout",
-                    soft_logout: true,
-                },
-            });
-            return;
-        }
-
-        // otherwise, pass through as normal
-        await route.continue();
+        // back to the welcome page
+        await expect(page).toHaveURL(/\/#\/home/);
+        await expect(page.getByRole("heading", { name: "Now, let's help you get started", exact: true })).toBeVisible();
     });
 
-    const promise = page.waitForResponse((resp) => resp.url().includes("/sync") && resp.status() === 401);
-
-    // do something to make the active /sync return: create a new room
-    await page.evaluate(() => {
-        // don't wait for this to complete: it probably won't, because of the broken sync
-        window.mxMatrixClientPeg.get().createRoom({});
+    test("still shows the soft-logout page when the page is reloaded after a soft-logout", async ({ page, user }) => {
+        await interceptRequestsWithSoftLogout(page, user);
+        await expect(page.getByText("You're signed out")).toBeVisible();
+        await page.reload();
+        await expect(page.getByText("You're signed out")).toBeVisible();
     });
-
-    await promise;
-}
+});

playwright/e2e/login/soft_logout_oauth.spec.ts

@@ -0,0 +1,59 @@
+/*
+Copyright 2024 New Vector Ltd.
+Copyright 2023 The Matrix.org Foundation C.I.C.
+
+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 { test, expect } from "../../element-web-test";
+import { doTokenRegistration, interceptRequestsWithSoftLogout } from "./utils";
+import { legacyOAuthHomeserver } from "../../plugins/homeserver/synapse/legacyOAuthHomeserver.ts";
+
+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",
+            },
+        },
+    },
+});
+
+test.use(legacyOAuthHomeserver);
+test.describe("Soft logout with SSO user", () => {
+    test.use({
+        user: async ({ page, homeserver }, use) => {
+            const user = await doTokenRegistration(page, homeserver);
+
+            // Eventually, we should end up at the home screen.
+            await expect(page).toHaveURL(/\/#\/home$/);
+            await expect(page.getByRole("heading", { name: "Welcome Alice", exact: true })).toBeVisible();
+
+            await use(user);
+        },
+    });
+
+    test("shows the soft-logout page when a request fails, and allows a re-login", async ({ page, user }) => {
+        await expect(page.getByRole("heading", { name: "Welcome Alice", exact: true })).toBeVisible();
+
+        await interceptRequestsWithSoftLogout(page, user);
+
+        await expect(page.getByText("You're signed out")).toBeVisible();
+        await page.getByRole("button", { name: "Continue with OAuth test" }).click();
+
+        // click the submit button
+        await page.getByRole("button", { name: "Submit" }).click();
+
+        // Synapse prompts us to grant permission to Element
+        await expect(page.getByRole("heading", { name: "Continue to your account" })).toBeVisible();
+        await page.getByRole("link", { name: "Continue" }).click();
+
+        // back to the welcome page
+        await expect(page).toHaveURL(/\/#\/home$/);
+        await expect(page.getByRole("heading", { name: "Welcome Alice", exact: true })).toBeVisible();
+    });
+});

playwright/e2e/login/utils.ts

@@ -20,7 +20,7 @@ export async function doTokenRegistration(
 
     await page.getByRole("button", { name: "Edit" }).click();
     await page.getByRole("textbox", { name: "Other homeserver" }).fill(homeserver.baseUrl);
-    await page.getByRole("button", { name: "Continue" }).click();
+    await page.getByRole("button", { name: "Continue", exact: true }).click();
     // wait for the dialog to go away
     await expect(page.locator(".mx_ServerPickerDialog")).toHaveCount(0);
 
@@ -56,5 +56,44 @@ export async function doTokenRegistration(
         homeServer: window.mxMatrixClientPeg.get().getHomeserverUrl(),
         password: null,
         displayName: "Alice",
+        username: window.mxMatrixClientPeg.get().getUserIdLocalpart(),
     }));
 }
+
+/**
+ * Intercept calls to /sync and have them fail with a soft-logout
+ *
+ * Any further requests to /sync with the same access token are blocked.
+ */
+export async function interceptRequestsWithSoftLogout(page: Page, user: Credentials): Promise<void> {
+    await page.route("**/_matrix/client/*/sync*", async (route, req) => {
+        const accessToken = await req.headerValue("Authorization");
+
+        // now, if the access token on this request matches the expired one, block it
+        if (accessToken === `Bearer ${user.accessToken}`) {
+            console.log("Intercepting request with soft-logged-out access token");
+            await route.fulfill({
+                status: 401,
+                json: {
+                    errcode: "M_UNKNOWN_TOKEN",
+                    error: "Soft logout",
+                    soft_logout: true,
+                },
+            });
+            return;
+        }
+
+        // otherwise, pass through as normal
+        await route.continue();
+    });
+
+    const promise = page.waitForResponse((resp) => resp.url().includes("/sync") && resp.status() === 401);
+
+    // do something to make the active /sync return: create a new room
+    await page.evaluate(() => {
+        // don't wait for this to complete: it probably won't, because of the broken sync
+        window.mxMatrixClientPeg.get().createRoom({});
+    });
+
+    await promise;
+}

playwright/e2e/oidc/index.ts

@@ -9,57 +9,7 @@ Please see LICENSE files in the repository root for full details.
 import { API, Messages } from "mailhog";
 import { Page } from "@playwright/test";
 
-import { test as base, expect } from "../../element-web-test";
-import { MatrixAuthenticationService } from "../../plugins/matrix-authentication-service";
-import { StartHomeserverOpts } from "../../plugins/homeserver";
-
-export const test = base.extend<{
-    masPrepare: MatrixAuthenticationService;
-    mas: MatrixAuthenticationService;
-}>({
-    // There's a bit of a chicken and egg problem between MAS & Synapse where they each need to know how to reach each other
-    // so spinning up a MAS is split into the prepare & start stage: prepare mas -> homeserver -> start mas to disentangle this.
-    masPrepare: async ({ context }, use) => {
-        const mas = new MatrixAuthenticationService(context);
-        await mas.prepare();
-        await use(mas);
-    },
-    mas: [
-        async ({ masPrepare: mas, homeserver, mailhog }, use, testInfo) => {
-            await mas.start(homeserver, mailhog.instance);
-            await use(mas);
-            await mas.stop(testInfo);
-        },
-        { auto: true },
-    ],
-    startHomeserverOpts: async ({ masPrepare }, use) => {
-        await use({
-            template: "mas-oidc",
-            variables: {
-                MAS_PORT: masPrepare.port,
-            },
-        });
-    },
-    config: async ({ config, startHomeserverOpts, context }, use) => {
-        const issuer = `http://localhost:${(startHomeserverOpts as StartHomeserverOpts).variables["MAS_PORT"]}/`;
-        const wellKnown = {
-            ...config.default_server_config,
-            "org.matrix.msc2965.authentication": {
-                issuer,
-                account: `${issuer}account`,
-            },
-        };
-
-        // Ensure org.matrix.msc2965.authentication is in well-known
-        await context.route("https://localhost/.well-known/matrix/client", async (route) => {
-            await route.fulfill({ json: wellKnown });
-        });
-
-        await use(config);
-    },
-});
-
-export { expect };
+import { expect } from "../../element-web-test";
 
 export async function registerAccountMas(
     page: Page,

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

@@ -6,23 +6,26 @@ 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 { test, expect, registerAccountMas } from ".";
-import { isDendrite } from "../../plugins/homeserver/dendrite";
+import { test, expect } from "../../element-web-test.ts";
+import { registerAccountMas } from ".";
 import { ElementAppPage } from "../../pages/ElementAppPage.ts";
+import { isDendrite } from "../../plugins/homeserver/dendrite";
+import { masHomeserver } from "../../plugins/homeserver/synapse/masHomeserver.ts";
 
+test.use(masHomeserver);
 test.describe("OIDC Native", { tag: ["@no-firefox", "@no-webkit"] }, () => {
     test.skip(isDendrite, "does not yet support MAS");
     test.slow(); // trace recording takes a while here
 
-    test("can register the oauth2 client and an account", async ({ context, page, homeserver, mailhog, mas }) => {
-        const tokenUri = `http://localhost:${mas.port}/oauth2/token`;
+    test("can register the oauth2 client and an account", async ({ context, page, homeserver, mailhogClient, mas }) => {
+        const tokenUri = `${mas.baseUrl}/oauth2/token`;
         const tokenApiPromise = page.waitForRequest(
             (request) => request.url() === tokenUri && request.postDataJSON()["grant_type"] === "authorization_code",
         );
 
         await page.goto("/#/login");
         await page.getByRole("button", { name: "Continue" }).click();
-        await registerAccountMas(page, mailhog.api, "alice", "alice@email.com", "Pa$sW0rD!");
+        await registerAccountMas(page, mailhogClient, "alice", "alice@email.com", "Pa$sW0rD!");
 
         // Eventually, we should end up at the home screen.
         await expect(page).toHaveURL(/\/#\/home$/, { timeout: 10000 });
@@ -49,7 +52,7 @@ test.describe("OIDC Native", { tag: ["@no-firefox", "@no-webkit"] }, () => {
         await newPage.close();
 
         // Assert logging out revokes both tokens
-        const revokeUri = `http://localhost:${mas.port}/oauth2/revoke`;
+        const revokeUri = `${mas.baseUrl}/oauth2/revoke`;
         const revokeAccessTokenPromise = page.waitForRequest(
             (request) => request.url() === revokeUri && request.postDataJSON()["token_type_hint"] === "access_token",
         );

playwright/e2e/register/email.spec.ts

@@ -7,32 +7,26 @@ Please see LICENSE files in the repository root for full details.
 */
 
 import { test, expect } from "../../element-web-test";
+import { emailHomeserver } from "../../plugins/homeserver/synapse/emailHomeserver.ts";
 import { isDendrite } from "../../plugins/homeserver/dendrite";
 
+test.use(emailHomeserver);
+test.use({
+    config: ({ config }, use) =>
+        use({
+            ...config,
+            default_server_config: {
+                ...config.default_server_config,
+                "m.identity_server": {
+                    base_url: "https://server.invalid",
+                },
+            },
+        }),
+});
+
 test.describe("Email Registration", async () => {
     test.skip(isDendrite, "not yet wired up");
 
-    test.use({
-        startHomeserverOpts: ({ mailhog }, use) =>
-            use({
-                template: "email",
-                variables: {
-                    SMTP_HOST: "host.containers.internal",
-                    SMTP_PORT: mailhog.instance.smtpPort,
-                },
-            }),
-        config: ({ config }, use) =>
-            use({
-                ...config,
-                default_server_config: {
-                    ...config.default_server_config,
-                    "m.identity_server": {
-                        base_url: "https://server.invalid",
-                    },
-                },
-            }),
-    });
-
     test.beforeEach(async ({ homeserver, page }) => {
         await page.goto("/#/register");
     });
@@ -40,7 +34,7 @@ test.describe("Email Registration", async () => {
     test(
         "registers an account and lands on the use case selection screen",
         { tag: "@screenshot" },
-        async ({ page, mailhog, request, checkA11y }) => {
+        async ({ page, mailhogClient, request, checkA11y }) => {
             await expect(page.getByRole("textbox", { name: "Username" })).toBeVisible();
             // Hide the server text as it contains the randomly allocated Homeserver port
             const screenshotOptions = { mask: [page.locator(".mx_ServerPicker_server")] };
@@ -57,7 +51,7 @@ test.describe("Email Registration", async () => {
 
             await expect(page.getByText("An error was encountered when sending the email")).not.toBeVisible();
 
-            const messages = await mailhog.api.messages();
+            const messages = await mailhogClient.messages();
             expect(messages.items).toHaveLength(1);
             expect(messages.items[0].to).toEqual("alice@email.com");
             const [emailLink] = messages.items[0].text.match(/http.+/);

playwright/e2e/register/register.spec.ts

@@ -7,21 +7,22 @@ Please see LICENSE files in the repository root for full details.
 */
 
 import { test, expect } from "../../element-web-test";
+import { consentHomeserver } from "../../plugins/homeserver/synapse/consentHomeserver.ts";
 
-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.use(consentHomeserver);
+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("Registration", () => {
     test.beforeEach(async ({ page }) => {
         await page.goto("/#/register");
     });

playwright/e2e/right-panel/memberlist.spec.ts

@@ -0,0 +1,48 @@
+/*
+Copyright 2024 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 { test, expect } from "../../element-web-test";
+import { Bot } from "../../pages/bot";
+
+const ROOM_NAME = "Test room";
+const NAME = "Alice";
+
+test.use({
+    synapseConfigOptions: {
+        presence: {
+            enabled: false,
+            include_offline_users_on_sync: false,
+        },
+    },
+    displayName: NAME,
+    disablePresence: true,
+});
+
+test.describe("Memberlist", () => {
+    test.beforeEach(async ({ app, user, page, homeserver }, testInfo) => {
+        testInfo.setTimeout(testInfo.timeout + 30_000);
+        const id = await app.client.createRoom({ name: ROOM_NAME });
+        const newBots: Bot[] = [];
+        const names = ["Bob", "Bob", "Susan"];
+        for (let i = 0; i < 3; i++) {
+            const displayName = names[i];
+            const autoAcceptInvites = displayName !== "Susan";
+            const bot = new Bot(page, homeserver, { displayName, startClient: true, autoAcceptInvites });
+            await bot.prepareClient();
+            await app.client.inviteUser(id, bot.credentials?.userId);
+            newBots.push(bot);
+        }
+    });
+
+    test("Renders correctly", { tag: "@screenshot" }, async ({ page, app }) => {
+        await app.viewRoomByName(ROOM_NAME);
+        const memberlist = await app.toggleMemberlistPanel();
+        await expect(memberlist.locator(".mx_MemberTileView")).toHaveCount(4);
+        await expect(memberlist.getByText("(Invited)")).toHaveCount(1);
+        await expect(page.locator(".mx_MemberListView")).toMatchScreenshot("with-four-members.png");
+    });
+});

playwright/e2e/right-panel/right-panel.spec.ts

@@ -24,7 +24,7 @@ const ROOM_ADDRESS_LONG =
     "loremIpsumDolorSitAmetConsecteturAdipisicingElitSedDoEiusmodTemporIncididuntUtLaboreEtDoloreMagnaAliqua";
 
 function getMemberTileByName(page: Page, name: string): Locator {
-    return page.locator(`.mx_EntityTile, [title="${name}"]`);
+    return page.locator(`.mx_MemberTileView, [title="${name}"]`);
 }
 
 test.describe("RightPanel", () => {
@@ -107,14 +107,14 @@ test.describe("RightPanel", () => {
             await viewRoomSummaryByName(page, app, ROOM_NAME);
 
             await page.locator(".mx_RightPanel").getByRole("menuitem", { name: "People" }).click();
-            await expect(page.locator(".mx_MemberList")).toBeVisible();
+            await expect(page.locator(".mx_MemberListView")).toBeVisible();
 
             await getMemberTileByName(page, NAME).click();
             await expect(page.locator(".mx_UserInfo")).toBeVisible();
             await expect(page.locator(".mx_UserInfo_profile").getByText(NAME)).toBeVisible();
 
             await page.getByTestId("base-card-back-button").click();
-            await expect(page.locator(".mx_MemberList")).toBeVisible();
+            await expect(page.locator(".mx_MemberListView")).toBeVisible();
 
             await page.getByLabel("Room info").nth(1).click();
             await checkRoomSummaryCard(page, ROOM_NAME);
@@ -130,14 +130,14 @@ test.describe("RightPanel", () => {
                 .locator(".mx_RoomInfoLine_private")
                 .getByRole("button", { name: /\d member/ })
                 .click();
-            await expect(page.locator(".mx_MemberList")).toBeVisible();
+            await expect(page.locator(".mx_MemberListView")).toBeVisible();
 
             await getMemberTileByName(page, NAME).click();
             await expect(page.locator(".mx_UserInfo")).toBeVisible();
             await expect(page.locator(".mx_UserInfo_profile").getByText(NAME)).toBeVisible();
 
             await page.getByTestId("base-card-back-button").click();
-            await expect(page.locator(".mx_MemberList")).toBeVisible();
+            await expect(page.locator(".mx_MemberListView")).toBeVisible();
         });
     });
 });

playwright/e2e/settings/device-management.spec.ts

@@ -7,7 +7,10 @@ Please see LICENSE files in the repository root for full details.
 */
 
 import { test, expect } from "../../element-web-test";
+import { uiaLongSessionTimeoutHomeserver } from "../../plugins/homeserver/synapse/uiaLongSessionTimeoutHomeserver.ts";
 
+// This is needed to not get stopped by UIA when deleting other devices
+test.use(uiaLongSessionTimeoutHomeserver);
 test.describe("Device manager", () => {
     test.use({
         displayName: "Alice",

playwright/e2e/sliding-sync/sliding-sync.spec.ts

@@ -7,21 +7,31 @@ Please see LICENSE files in the repository root for full details.
 */
 
 import { Page, Request } from "@playwright/test";
+import { GenericContainer, StartedTestContainer, Wait } from "testcontainers";
 
 import { test as base, expect } from "../../element-web-test";
 import type { ElementAppPage } from "../../pages/ElementAppPage";
 import type { Bot } from "../../pages/bot";
-import { ProxyInstance, SlidingSyncProxy } from "../../plugins/sliding-sync-proxy";
 
 const test = base.extend<{
-    slidingSyncProxy: ProxyInstance;
+    slidingSyncProxy: StartedTestContainer;
     testRoom: { roomId: string; name: string };
     joinedBot: Bot;
 }>({
-    slidingSyncProxy: async ({ context, page, homeserver }, use) => {
-        const proxy = new SlidingSyncProxy(homeserver.config.dockerUrl, context);
-        const proxyInstance = await proxy.start();
-        const proxyAddress = `http://localhost:${proxyInstance.port}`;
+    slidingSyncProxy: async ({ logger, network, postgres, page, homeserver }, use, testInfo) => {
+        const container = await new GenericContainer("ghcr.io/matrix-org/sliding-sync:v0.99.3")
+            .withNetwork(network)
+            .withExposedPorts(8008)
+            .withLogConsumer(logger.getConsumer("sliding-sync-proxy"))
+            .withWaitStrategy(Wait.forHttp("/client/server.json", 8008))
+            .withEnvironment({
+                SYNCV3_SECRET: "bwahahaha",
+                SYNCV3_DB: `user=${postgres.getUsername()} dbname=postgres password=${postgres.getPassword()} host=postgres sslmode=disable`,
+                SYNCV3_SERVER: `http://homeserver:8008`,
+            })
+            .start();
+
+        const proxyAddress = `http://${container.getHost()}:${container.getMappedPort(8008)}`;
         await page.addInitScript((proxyAddress) => {
             window.localStorage.setItem(
                 "mx_local_settings",
@@ -31,8 +41,8 @@ const test = base.extend<{
             );
             window.localStorage.setItem("mx_labs_feature_feature_sliding_sync", "true");
         }, proxyAddress);
-        await use(proxyInstance);
-        await proxy.stop();
+        await use(container);
+        await container.stop();
     },
     // Ensure slidingSyncProxy is set up before the user fixture as it relies on an init script
     credentials: async ({ slidingSyncProxy, credentials }, use) => {
@@ -361,37 +371,42 @@ test.describe("Sliding Sync", () => {
             roomIds.push(id);
             await expect(page.getByRole("treeitem", { name: fruit })).toBeVisible();
         }
-        const [roomAId, roomPId] = roomIds;
+        const [roomAId, roomPId, roomOId] = roomIds;
 
-        const assertUnsubExists = (request: Request, subRoomId: string, unsubRoomId: string) => {
+        const matchRoomSubRequest = (subRoomId: string) => (request: Request) => {
+            if (!request.url().includes("/sync")) return false;
             const body = request.postDataJSON();
-            // There may be a request without a txn_id, ignore it, as there won't be any subscription changes
-            if (body.txn_id === undefined) {
-                return;
-            }
-            expect(body.unsubscribe_rooms).toEqual([unsubRoomId]);
-            expect(body.room_subscriptions).not.toHaveProperty(unsubRoomId);
-            expect(body.room_subscriptions).toHaveProperty(subRoomId);
+            return body.txn_id && body.room_subscriptions?.[subRoomId];
+        };
+        const matchRoomUnsubRequest = (unsubRoomId: string) => (request: Request) => {
+            if (!request.url().includes("/sync")) return false;
+            const body = request.postDataJSON();
+            return (
+                body.txn_id && body.unsubscribe_rooms?.includes(unsubRoomId) && !body.room_subscriptions?.[unsubRoomId]
+            );
         };
 
-        let promise = page.waitForRequest(/sync/);
-
-        // Select the Test Room
-        await page.getByRole("treeitem", { name: "Apple", exact: true }).click();
-
-        // and wait for playwright to get the request
-        const roomSubscriptions = (await promise).postDataJSON().room_subscriptions;
+        // Select the Test Room and wait for playwright to get the request
+        const [request] = await Promise.all([
+            page.waitForRequest(matchRoomSubRequest(roomAId)),
+            page.getByRole("treeitem", { name: "Apple", exact: true }).click(),
+        ]);
+        const roomSubscriptions = request.postDataJSON().room_subscriptions;
         expect(roomSubscriptions, "room_subscriptions is object").toBeDefined();
 
-        // Switch to another room
-        promise = page.waitForRequest(/sync/);
-        await page.getByRole("treeitem", { name: "Pineapple", exact: true }).click();
-        assertUnsubExists(await promise, roomPId, roomAId);
+        // Switch to another room and wait for playwright to get the request
+        await Promise.all([
+            page.waitForRequest(matchRoomSubRequest(roomPId)),
+            page.waitForRequest(matchRoomUnsubRequest(roomAId)),
+            page.getByRole("treeitem", { name: "Pineapple", exact: true }).click(),
+        ]);
 
-        // And switch to even another room
-        promise = page.waitForRequest(/sync/);
-        await page.getByRole("treeitem", { name: "Apple", exact: true }).click();
-        assertUnsubExists(await promise, roomPId, roomAId);
+        // And switch to even another room and wait for playwright to get the request
+        await Promise.all([
+            page.waitForRequest(matchRoomSubRequest(roomOId)),
+            page.waitForRequest(matchRoomUnsubRequest(roomPId)),
+            page.getByRole("treeitem", { name: "Orange", exact: true }).click(),
+        ]);
 
         // TODO: Add tests for encrypted rooms
     });

playwright/e2e/spaces/threads-activity-centre/index.ts

@@ -13,6 +13,7 @@ import { test as base, expect } from "../../../element-web-test";
 import { Bot } from "../../../pages/bot";
 import { Client } from "../../../pages/client";
 import { ElementAppPage } from "../../../pages/ElementAppPage";
+import { Credentials } from "../../../plugins/homeserver";
 
 type RoomRef = { name: string; roomId: string };
 
@@ -336,12 +337,14 @@ export class Helpers {
      * @param room1
      * @param room2
      * @param msg - MessageBuilder
+     * @param user - the user to mention in the first message
      * @param hasMention - whether to include a mention in the first message
      */
     async populateThreads(
         room1: { name: string; roomId: string },
         room2: { name: string; roomId: string },
         msg: MessageBuilder,
+        user: Credentials,
         hasMention = true,
     ) {
         if (hasMention) {
@@ -350,9 +353,9 @@ export class Helpers {
                 msg.threadedOff("Msg1", {
                     "body": "User",
                     "format": "org.matrix.custom.html",
-                    "formatted_body": "<a href='https://matrix.to/#/@user:localhost'>User</a>",
+                    "formatted_body": `<a href="https://matrix.to/#/${user.userId}">User</a>`,
                     "m.mentions": {
-                        user_ids: ["@user:localhost"],
+                        user_ids: [user.userId],
                     },
                 }),
             ]);

playwright/e2e/spaces/threads-activity-centre/threadsActivityCentre.spec.ts

@@ -46,16 +46,21 @@ test.describe("Threads Activity Centre", { tag: "@no-firefox" }, () => {
         await util.assertNotificationTac();
     });
 
-    test("should show a highlight indicator when there is a mention in a thread", async ({ room1, util, msg }) => {
+    test("should show a highlight indicator when there is a mention in a thread", async ({
+        room1,
+        util,
+        msg,
+        user,
+    }) => {
         await util.goTo(room1);
         await util.receiveMessages(room1, [
             "Msg1",
             msg.threadedOff("Msg1", {
                 "body": "User",
                 "format": "org.matrix.custom.html",
-                "formatted_body": "<a href='https://matrix.to/#/@user:localhost'>User</a>",
+                "formatted_body": `<a href="https://matrix.to/#/${user.userId}">User</a>`,
                 "m.mentions": {
-                    user_ids: ["@user:localhost"],
+                    user_ids: [user.userId],
                 },
             }),
         ]);
@@ -64,26 +69,30 @@ test.describe("Threads Activity Centre", { tag: "@no-firefox" }, () => {
         await util.assertHighlightIndicator();
     });
 
-    test("should show the rooms with unread threads", { tag: "@screenshot" }, async ({ room1, room2, util, msg }) => {
+    test(
+        "should show the rooms with unread threads",
+        { tag: "@screenshot" },
+        async ({ room1, room2, util, msg, user }) => {
+            await util.goTo(room2);
+            await util.populateThreads(room1, room2, msg, user);
+            // The indicator should be shown
+            await util.assertHighlightIndicator();
+
+            // Verify that we have the expected rooms in the TAC
+            await util.openTac();
+            await util.assertRoomsInTac([
+                { room: room2.name, notificationLevel: "highlight" },
+                { room: room1.name, notificationLevel: "notification" },
+            ]);
+
+            // Verify that we don't have a visual regression
+            await expect(util.getTacPanel()).toMatchScreenshot("tac-panel-mix-unread.png");
+        },
+    );
+
+    test("should update with a thread is read", { tag: "@screenshot" }, async ({ room1, room2, util, msg, user }) => {
         await util.goTo(room2);
-        await util.populateThreads(room1, room2, msg);
-        // The indicator should be shown
-        await util.assertHighlightIndicator();
-
-        // Verify that we have the expected rooms in the TAC
-        await util.openTac();
-        await util.assertRoomsInTac([
-            { room: room2.name, notificationLevel: "highlight" },
-            { room: room1.name, notificationLevel: "notification" },
-        ]);
-
-        // Verify that we don't have a visual regression
-        await expect(util.getTacPanel()).toMatchScreenshot("tac-panel-mix-unread.png");
-    });
-
-    test("should update with a thread is read", { tag: "@screenshot" }, async ({ room1, room2, util, msg }) => {
-        await util.goTo(room2);
-        await util.populateThreads(room1, room2, msg);
+        await util.populateThreads(room1, room2, msg, user);
 
         // Click on the first room in TAC
         await util.openTac();
@@ -104,9 +113,9 @@ test.describe("Threads Activity Centre", { tag: "@no-firefox" }, () => {
         await expect(util.getTacPanel()).toMatchScreenshot("tac-panel-notification-unread.png");
     });
 
-    test("should order by recency after notification level", async ({ room1, room2, util, msg }) => {
+    test("should order by recency after notification level", async ({ room1, room2, util, msg, user }) => {
         await util.goTo(room2);
-        await util.populateThreads(room1, room2, msg, false);
+        await util.populateThreads(room1, room2, msg, user, false);
 
         await util.openTac();
         await util.assertRoomsInTac([

playwright/element-web-test.ts

@@ -6,24 +6,20 @@ 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 { test as base, expect as baseExpect, Locator, Page, ExpectMatcherState, ElementHandle } from "@playwright/test";
+import { expect as baseExpect, Locator, Page, ExpectMatcherState, ElementHandle } from "@playwright/test";
 import { sanitizeForFilePath } from "playwright-core/lib/utils";
 import AxeBuilder from "@axe-core/playwright";
 import _ from "lodash";
-import { basename, extname } from "node:path";
+import { extname } from "node:path";
 
-import type mailhog from "mailhog";
 import type { IConfigOptions } from "../src/IConfigOptions";
-import { Credentials, Homeserver, HomeserverInstance, StartHomeserverOpts } from "./plugins/homeserver";
-import { Synapse } from "./plugins/homeserver/synapse";
-import { Dendrite, Pinecone } from "./plugins/homeserver/dendrite";
-import { Instance, MailHogServer } from "./plugins/mailhog";
+import { Credentials } from "./plugins/homeserver";
 import { ElementAppPage } from "./pages/ElementAppPage";
-import { OAuthServer } from "./plugins/oauth_server";
 import { Crypto } from "./pages/crypto";
 import { Toasts } from "./pages/toasts";
 import { Bot, CreateBotOpts } from "./pages/bot";
 import { Webserver } from "./plugins/webserver";
+import { test as base } from "./services.ts";
 
 // Enable experimental service worker support
 // See https://playwright.dev/docs/service-workers-experimental#how-to-enable
@@ -58,14 +54,6 @@ export interface Fixtures {
      */
     config: typeof CONFIG_JSON;
 
-    /**
-     * The options with which to run the {@link #homeserver} fixture.
-     */
-    startHomeserverOpts: StartHomeserverOpts | string;
-
-    homeserver: HomeserverInstance;
-    oAuthServer: { port: number };
-
     /**
      * The displayname to use for the user registered in {@link #credentials}.
      *
@@ -103,7 +91,6 @@ export interface Fixtures {
      */
     app: ElementAppPage;
 
-    mailhog: { api: mailhog.API; instance: Instance };
     crypto: Crypto;
     room?: { roomId: string };
     toasts: Toasts;
@@ -112,6 +99,7 @@ export interface Fixtures {
     bot: Bot;
     labsFlags: string[];
     webserver: Webserver;
+    disablePresence: boolean;
 }
 
 export const test = base.extend<Fixtures>({
@@ -123,8 +111,9 @@ export const test = base.extend<Fixtures>({
         );
         await use(context);
     },
+    disablePresence: false,
     config: {}, // We merge this atop the default CONFIG_JSON in the page fixture to make extending it easier
-    page: async ({ homeserver, context, page, config, labsFlags }, use) => {
+    page: async ({ homeserver, context, page, config, labsFlags, disablePresence }, use) => {
         await context.route(`http://localhost:8080/config.json*`, async (route) => {
             const json = {
                 ...CONFIG_JSON,
@@ -144,57 +133,23 @@ export const test = base.extend<Fixtures>({
                     return obj;
                 }, {}),
             };
+            if (disablePresence) {
+                json["enable_presence_by_hs_url"] = {
+                    [homeserver.baseUrl]: false,
+                };
+            }
             await route.fulfill({ json });
         });
         await use(page);
     },
 
-    startHomeserverOpts: "default",
-    homeserver: async ({ request, startHomeserverOpts: opts }, use, testInfo) => {
-        if (typeof opts === "string") {
-            opts = { template: opts };
-        }
-
-        let server: Homeserver;
-        const homeserverName = process.env["PLAYWRIGHT_HOMESERVER"];
-        switch (homeserverName) {
-            case "dendrite":
-                server = new Dendrite(request);
-                break;
-            case "pinecone":
-                server = new Pinecone(request);
-                break;
-            default:
-                server = new Synapse(request);
-        }
-
-        await use(await server.start(opts));
-        const logs = await server.stop();
-
-        if (testInfo.status !== "passed") {
-            for (const path of logs) {
-                await testInfo.attach(`homeserver-${basename(path)}`, {
-                    path,
-                    contentType: "text/plain",
-                });
-            }
-        }
-    },
-    // eslint-disable-next-line no-empty-pattern
-    oAuthServer: async ({}, use) => {
-        const server = new OAuthServer();
-        const port = server.start();
-        await use({ port });
-        server.stop();
-    },
-
     displayName: undefined,
-    credentials: async ({ homeserver, displayName: testDisplayName }, use) => {
+    credentials: async ({ context, homeserver, displayName: testDisplayName }, use, testInfo) => {
         const names = ["Alice", "Bob", "Charlie", "Daniel", "Eve", "Frank", "Grace", "Hannah", "Isaac", "Judy"];
         const password = _.uniqueId("password_");
         const displayName = testDisplayName ?? _.sample(names)!;
 
-        const credentials = await homeserver.registerUser("user", password, displayName);
+        const credentials = await homeserver.registerUser(`user_${testInfo.testId}`, password, displayName);
         console.log(`Registered test user @user:localhost with displayname ${displayName}`);
 
         await use({
@@ -216,8 +171,15 @@ export const test = base.extend<Fixtures>({
                 window.localStorage.setItem("mx_has_pickle_key", "false");
                 window.localStorage.setItem("mx_has_access_token", "true");
 
-                // Ensure the language is set to a consistent value
-                window.localStorage.setItem("mx_local_settings", '{"language":"en"}');
+                window.localStorage.setItem(
+                    "mx_local_settings",
+                    JSON.stringify({
+                        // Retain any other settings which may have already been set
+                        ...JSON.parse(window.localStorage.getItem("mx_local_settings") || "{}"),
+                        // Ensure the language is set to a consistent value
+                        language: "en",
+                    }),
+                );
             },
             { baseUrl: homeserver.baseUrl, credentials },
         );
@@ -264,14 +226,6 @@ export const test = base.extend<Fixtures>({
         await use(bot);
     },
 
-    // eslint-disable-next-line no-empty-pattern
-    mailhog: async ({}, use) => {
-        const mailhog = new MailHogServer();
-        const instance = await mailhog.start();
-        await use(instance);
-        await mailhog.stop();
-    },
-
     // eslint-disable-next-line no-empty-pattern
     webserver: async ({}, use) => {
         const webserver = new Webserver();

playwright/pages/ElementAppPage.ts

@@ -177,6 +177,18 @@ export class ElementAppPage {
         return this.page.locator(".mx_RightPanel");
     }
 
+    /**
+     * Opens/closes the memberlist panel
+     * @returns locator to the memberlist panel
+     */
+    public async toggleMemberlistPanel(): Promise<Locator> {
+        const locator = this.page.locator(".mx_FacePile");
+        await locator.click();
+        const memberlist = this.page.locator(".mx_MemberListView");
+        await memberlist.waitFor();
+        return memberlist;
+    }
+
     /**
      * Get a locator for the tooltip associated with an element
      * @param e The element with the tooltip

playwright/plugins/docker/index.ts

@@ -1,151 +0,0 @@
-/*
-Copyright 2024 New Vector Ltd.
-Copyright 2023 The Matrix.org Foundation C.I.C.
-
-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 * as os from "os";
-import * as crypto from "crypto";
-import * as childProcess from "child_process";
-import * as fse from "fs-extra";
-
-/**
- * @param cmd - command to execute
- * @param args - arguments to pass to executed command
- * @param suppressOutput - whether to suppress the stdout and stderr resulting from this command.
- * @return Promise which resolves to an object containing the string value of what was
- *         written to stdout and stderr by the executed command.
- */
-const exec = (cmd: string, args: string[], suppressOutput = false): Promise<{ stdout: string; stderr: string }> => {
-    return new Promise((resolve, reject) => {
-        if (!suppressOutput) {
-            const log = ["Running command:", cmd, ...args, "\n"].join(" ");
-            // When in CI mode we combine reports from multiple runners into a single HTML report
-            // which has separate files for stdout and stderr, so we print the executed command to both
-            process.stdout.write(log);
-            if (process.env.CI) process.stderr.write(log);
-        }
-        const { stdout, stderr } = childProcess.execFile(cmd, args, { encoding: "utf8" }, (err, stdout, stderr) => {
-            if (err) reject(err);
-            resolve({ stdout, stderr });
-            if (!suppressOutput) {
-                process.stdout.write("\n");
-                if (process.env.CI) process.stderr.write("\n");
-            }
-        });
-        if (!suppressOutput) {
-            stdout.pipe(process.stdout);
-            stderr.pipe(process.stderr);
-        }
-    });
-};
-
-export class Docker {
-    public id: string;
-
-    async run(opts: { image: string; containerName: string; params?: string[]; cmd?: string[] }): Promise<string> {
-        const userInfo = os.userInfo();
-        const params = opts.params ?? [];
-
-        const isPodman = await Docker.isPodman();
-        if (params.includes("-v") && userInfo.uid >= 0) {
-            // Run the docker container as our uid:gid to prevent problems with permissions.
-            if (isPodman) {
-                // Note: this setup is for podman rootless containers.
-
-                // In podman, run as root in the container, which maps to the current
-                // user on the host. This is probably the default since Synapse's
-                // Dockerfile doesn't specify, but we're being explicit here
-                // because it's important for the permissions to work.
-                params.push("-u", "0:0");
-
-                // Tell Synapse not to switch UID
-                params.push("-e", "UID=0");
-                params.push("-e", "GID=0");
-            } else {
-                params.push("-u", `${userInfo.uid}:${userInfo.gid}`);
-            }
-        }
-
-        // Make host.containers.internal work to allow the container to talk to other services via host ports.
-        if (isPodman) {
-            params.push("--network");
-            params.push("slirp4netns:allow_host_loopback=true");
-        } else {
-            // Docker for Desktop includes a host-gateway mapping on host.docker.internal but to simplify the config
-            // we use the Podman variant host.containers.internal in all environments.
-            params.push("--add-host");
-            params.push("host.containers.internal:host-gateway");
-        }
-
-        // Provided we are not running in CI, add a `--rm` parameter.
-        // There is no need to remove containers in CI (since they are automatically removed anyway), and
-        // `--rm` means that if a container crashes this means its logs are wiped out.
-        if (!process.env.CI) params.unshift("--rm");
-
-        const args = [
-            "run",
-            "--name",
-            `${opts.containerName}-${crypto.randomBytes(4).toString("hex")}`,
-            "-d",
-            ...params,
-            opts.image,
-        ];
-
-        if (opts.cmd) args.push(...opts.cmd);
-
-        const { stdout } = await exec("docker", args);
-        this.id = stdout.trim();
-        return this.id;
-    }
-
-    async stop(): Promise<void> {
-        try {
-            await exec("docker", ["stop", this.id]);
-        } catch (err) {
-            console.error(`Failed to stop docker container`, this.id, err);
-        }
-    }
-
-    /**
-     * @param params - list of parameters to pass to `docker exec`
-     * @param suppressOutput - whether to suppress the stdout and stderr resulting from this command.
-     */
-    async exec(params: string[], suppressOutput = true): Promise<void> {
-        await exec("docker", ["exec", this.id, ...params], suppressOutput);
-    }
-
-    async getContainerIp(): Promise<string> {
-        const { stdout } = await exec("docker", ["inspect", "-f", "{{ .NetworkSettings.IPAddress }}", this.id]);
-        return stdout.trim();
-    }
-
-    async persistLogsToFile(args: { stdoutFile?: string; stderrFile?: string }): Promise<void> {
-        const stdoutFile = args.stdoutFile ? await fse.open(args.stdoutFile, "w") : "ignore";
-        const stderrFile = args.stderrFile ? await fse.open(args.stderrFile, "w") : "ignore";
-        await new Promise<void>((resolve) => {
-            childProcess
-                .spawn("docker", ["logs", this.id], {
-                    stdio: ["ignore", stdoutFile, stderrFile],
-                })
-                .once("close", resolve);
-        });
-        if (args.stdoutFile) await fse.close(<number>stdoutFile);
-        if (args.stderrFile) await fse.close(<number>stderrFile);
-    }
-
-    /**
-     * Detects whether the docker command is actually podman.
-     * To do this, it looks for "podman" in the output of "docker --help".
-     */
-    static _isPodman?: boolean;
-    static async isPodman(): Promise<boolean> {
-        if (Docker._isPodman === undefined) {
-            const { stdout } = await exec("docker", ["--help"], true);
-            Docker._isPodman = stdout.toLowerCase().includes("podman");
-        }
-        return Docker._isPodman;
-    }
-}

playwright/plugins/homeserver/dendrite/index.ts

@@ -6,142 +6,35 @@ 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 * as path from "node:path";
-import * as os from "node:os";
-import * as fse from "fs-extra";
+import { Fixtures } from "@playwright/test";
 
-import { getFreePort } from "../../utils/port";
-import { Homeserver, HomeserverConfig, HomeserverInstance, StartHomeserverOpts } from "../";
-import { randB64Bytes } from "../../utils/rand";
-import { Synapse } from "../synapse";
-import { Docker } from "../../docker";
+import { DendriteContainer, PineconeContainer } from "../../../testcontainers/dendrite.ts";
+import { Services } from "../../../services.ts";
 
-const dockerConfigDir = "/etc/dendrite/";
-const dendriteConfigFile = "dendrite.yaml";
+export const dendriteHomeserver: Fixtures<{}, Services> = {
+    _homeserver: [
+        // eslint-disable-next-line no-empty-pattern
+        async ({}, use) => {
+            const container =
+                process.env["PLAYWRIGHT_HOMESERVER"] === "dendrite" ? new DendriteContainer() : new PineconeContainer();
+            await use(container);
+        },
+        { scope: "worker" },
+    ],
+    homeserver: [
+        async ({ logger, network, _homeserver: homeserver }, use) => {
+            const container = await homeserver
+                .withNetwork(network)
+                .withNetworkAliases("homeserver")
+                .withLogConsumer(logger.getConsumer("dendrite"))
+                .start();
 
-// Surprisingly, Dendrite implements the same register user Admin API Synapse, so we can just extend it
-export class Dendrite extends Synapse implements Homeserver, HomeserverInstance {
-    protected image = "matrixdotorg/dendrite-monolith:main";
-    protected entrypoint = "/usr/bin/dendrite";
-
-    /**
-     * Start a dendrite instance: the template must be the name of one of the templates
-     * in the playwright/plugins/dendritedocker/templates directory
-     * @param opts
-     */
-    public async start(opts: StartHomeserverOpts): Promise<HomeserverInstance> {
-        const denCfg = await cfgDirFromTemplate(this.image, opts);
-
-        console.log(`Starting dendrite with config dir ${denCfg.configDir}...`);
-
-        const dendriteId = await this.docker.run({
-            image: this.image,
-            params: [
-                "-v",
-                `${denCfg.configDir}:` + dockerConfigDir,
-                "-p",
-                `${denCfg.port}:8008/tcp`,
-                "--entrypoint",
-                this.entrypoint,
-            ],
-            containerName: `react-sdk-playwright-dendrite`,
-            cmd: ["--config", dockerConfigDir + dendriteConfigFile, "--really-enable-open-registration", "true", "run"],
-        });
-
-        console.log(`Started dendrite with id ${dendriteId} on port ${denCfg.port}.`);
-
-        // Await Dendrite healthcheck
-        await this.docker.exec([
-            "curl",
-            "--connect-timeout",
-            "30",
-            "--retry",
-            "30",
-            "--retry-delay",
-            "1",
-            "--retry-all-errors",
-            "--silent",
-            "http://localhost:8008/_matrix/client/versions",
-        ]);
-
-        const dockerUrl = `http://${await this.docker.getContainerIp()}:8008`;
-        this.config = {
-            ...denCfg,
-            serverId: dendriteId,
-            dockerUrl,
-        };
-        return this;
-    }
-
-    public async stop(): Promise<string[]> {
-        if (!this.config) throw new Error("Missing existing dendrite instance, did you call stop() before start()?");
-
-        const dendriteLogsPath = path.join("playwright", "dendritelogs", this.config.serverId);
-        await fse.ensureDir(dendriteLogsPath);
-
-        await this.docker.persistLogsToFile({
-            stdoutFile: path.join(dendriteLogsPath, "stdout.log"),
-            stderrFile: path.join(dendriteLogsPath, "stderr.log"),
-        });
-
-        await this.docker.stop();
-
-        await fse.remove(this.config.configDir);
-
-        console.log(`Stopped dendrite id ${this.config.serverId}.`);
-
-        return [path.join(dendriteLogsPath, "stdout.log"), path.join(dendriteLogsPath, "stderr.log")];
-    }
-}
-
-export class Pinecone extends Dendrite {
-    protected image = "matrixdotorg/dendrite-demo-pinecone:main";
-    protected entrypoint = "/usr/bin/dendrite-demo-pinecone";
-}
-
-async function cfgDirFromTemplate(
-    dendriteImage: string,
-    opts: StartHomeserverOpts,
-): Promise<Omit<HomeserverConfig, "dockerUrl">> {
-    const template = "default"; // XXX: for now we only have one template
-    const templateDir = path.join(__dirname, "templates", template);
-
-    const stats = await fse.stat(templateDir);
-    if (!stats?.isDirectory) {
-        throw new Error(`No such template: ${template}`);
-    }
-    const tempDir = await fse.mkdtemp(path.join(os.tmpdir(), "react-sdk-dendritedocker-"));
-
-    // copy the contents of the template dir, omitting homeserver.yaml as we'll template that
-    console.log(`Copy ${templateDir} -> ${tempDir}`);
-    await fse.copy(templateDir, tempDir, { filter: (f) => path.basename(f) !== dendriteConfigFile });
-
-    const registrationSecret = randB64Bytes(16);
-
-    const port = await getFreePort();
-    const baseUrl = `http://localhost:${port}`;
-
-    // now copy homeserver.yaml, applying substitutions
-    console.log(`Gen ${path.join(templateDir, dendriteConfigFile)}`);
-    let hsYaml = await fse.readFile(path.join(templateDir, dendriteConfigFile), "utf8");
-    hsYaml = hsYaml.replace(/{{REGISTRATION_SECRET}}/g, registrationSecret);
-    await fse.writeFile(path.join(tempDir, dendriteConfigFile), hsYaml);
-
-    const docker = new Docker();
-    await docker.run({
-        image: dendriteImage,
-        params: ["--entrypoint=", "-v", `${tempDir}:/mnt`],
-        containerName: `react-sdk-playwright-dendrite-keygen`,
-        cmd: ["/usr/bin/generate-keys", "-private-key", "/mnt/matrix_key.pem"],
-    });
-
-    return {
-        port,
-        baseUrl,
-        configDir: tempDir,
-        registrationSecret,
-    };
-}
+            await use(container);
+            await container.stop();
+        },
+        { scope: "worker" },
+    ],
+};
 
 export function isDendrite(): boolean {
     return process.env["PLAYWRIGHT_HOMESERVER"] === "dendrite" || process.env["PLAYWRIGHT_HOMESERVER"] === "pinecone";

playwright/plugins/homeserver/dendrite/templates/default/dendrite.yaml

@@ -1,378 +0,0 @@
-# This is the Dendrite configuration file.
-#
-# The configuration is split up into sections - each Dendrite component has a
-# configuration section, in addition to the "global" section which applies to
-# all components.
-
-# The version of the configuration file.
-version: 2
-
-# Global Matrix configuration. This configuration applies to all components.
-global:
-    # The domain name of this homeserver.
-    server_name: localhost
-
-    # The path to the signing private key file, used to sign requests and events.
-    # Note that this is NOT the same private key as used for TLS! To generate a
-    # signing key, use "./bin/generate-keys --private-key matrix_key.pem".
-    private_key: matrix_key.pem
-
-    # The paths and expiry timestamps (as a UNIX timestamp in millisecond precision)
-    # to old signing keys that were formerly in use on this domain name. These
-    # keys will not be used for federation request or event signing, but will be
-    # provided to any other homeserver that asks when trying to verify old events.
-    old_private_keys:
-    #  If the old private key file is available:
-    #  - private_key: old_matrix_key.pem
-    #    expired_at: 1601024554498
-    #  If only the public key (in base64 format) and key ID are known:
-    #  - public_key: mn59Kxfdq9VziYHSBzI7+EDPDcBS2Xl7jeUdiiQcOnM=
-    #    key_id: ed25519:mykeyid
-    #    expired_at: 1601024554498
-
-    # How long a remote server can cache our server signing key before requesting it
-    # again. Increasing this number will reduce the number of requests made by other
-    # servers for our key but increases the period that a compromised key will be
-    # considered valid by other homeservers.
-    key_validity_period: 168h0m0s
-
-    # Global database connection pool, for PostgreSQL monolith deployments only. If
-    # this section is populated then you can omit the "database" blocks in all other
-    # sections. For polylith deployments, or monolith deployments using SQLite databases,
-    # you must configure the "database" block for each component instead.
-    # database:
-    #   connection_string: postgresql://username:password@hostname/dendrite?sslmode=disable
-    #   max_open_conns: 90
-    #   max_idle_conns: 5
-    #   conn_max_lifetime: -1
-
-    # Configuration for in-memory caches. Caches can often improve performance by
-    # keeping frequently accessed items (like events, identifiers etc.) in memory
-    # rather than having to read them from the database.
-    cache:
-        # The estimated maximum size for the global cache in bytes, or in terabytes,
-        # gigabytes, megabytes or kilobytes when the appropriate 'tb', 'gb', 'mb' or
-        # 'kb' suffix is specified. Note that this is not a hard limit, nor is it a
-        # memory limit for the entire process. A cache that is too small may ultimately
-        # provide little or no benefit.
-        max_size_estimated: 1gb
-
-        # The maximum amount of time that a cache entry can live for in memory before
-        # it will be evicted and/or refreshed from the database. Lower values result in
-        # easier admission of new cache entries but may also increase database load in
-        # comparison to higher values, so adjust conservatively. Higher values may make
-        # it harder for new items to make it into the cache, e.g. if new rooms suddenly
-        # become popular.
-        max_age: 1h
-
-    # The server name to delegate server-server communications to, with optional port
-    # e.g. localhost:443
-    well_known_server_name: ""
-
-    # The server name to delegate client-server communications to, with optional port
-    # e.g. localhost:443
-    well_known_client_name: ""
-
-    # Lists of domains that the server will trust as identity servers to verify third
-    # party identifiers such as phone numbers and email addresses.
-    trusted_third_party_id_servers:
-        - matrix.org
-        - vector.im
-
-    # Disables federation. Dendrite will not be able to communicate with other servers
-    # in the Matrix federation and the federation API will not be exposed.
-    disable_federation: false
-
-    # Configures the handling of presence events. Inbound controls whether we receive
-    # presence events from other servers, outbound controls whether we send presence
-    # events for our local users to other servers.
-    presence:
-        enable_inbound: false
-        enable_outbound: false
-
-    # Configures phone-home statistics reporting. These statistics contain the server
-    # name, number of active users and some information on your deployment config.
-    # We use this information to understand how Dendrite is being used in the wild.
-    report_stats:
-        enabled: false
-        endpoint: https://matrix.org/report-usage-stats/push
-
-    # Server notices allows server admins to send messages to all users on the server.
-    server_notices:
-        enabled: false
-        # The local part, display name and avatar URL (as a mxc:// URL) for the user that
-        # will send the server notices. These are visible to all users on the deployment.
-        local_part: "_server"
-        display_name: "Server Alerts"
-        avatar_url: ""
-        # The room name to be used when sending server notices. This room name will
-        # appear in user clients.
-        room_name: "Server Alerts"
-
-    # Configuration for NATS JetStream
-    jetstream:
-        # A list of NATS Server addresses to connect to. If none are specified, an
-        # internal NATS server will be started automatically when running Dendrite in
-        # monolith mode. For polylith deployments, it is required to specify the address
-        # of at least one NATS Server node.
-        addresses:
-        # - localhost:4222
-
-        # Disable the validation of TLS certificates of NATS. This is
-        # not recommended in production since it may allow NATS traffic
-        # to be sent to an insecure endpoint.
-        disable_tls_validation: false
-
-        # Persistent directory to store JetStream streams in. This directory should be
-        # preserved across Dendrite restarts.
-        storage_path: ./
-
-        # The prefix to use for stream names for this homeserver - really only useful
-        # if you are running more than one Dendrite server on the same NATS deployment.
-        topic_prefix: Dendrite
-
-    # Configuration for Prometheus metric collection.
-    metrics:
-        enabled: false
-        basic_auth:
-            username: metrics
-            password: metrics
-
-    # Optional DNS cache. The DNS cache may reduce the load on DNS servers if there
-    # is no local caching resolver available for use.
-    dns_cache:
-        enabled: false
-        cache_size: 256
-        cache_lifetime: "5m" # 5 minutes; https://pkg.go.dev/time@master#ParseDuration
-
-# Configuration for the Appservice API.
-app_service_api:
-    # Disable the validation of TLS certificates of appservices. This is
-    # not recommended in production since it may allow appservice traffic
-    # to be sent to an insecure endpoint.
-    disable_tls_validation: false
-
-    # Appservice configuration files to load into this homeserver.
-    config_files:
-    #  - /path/to/appservice_registration.yaml
-
-# Configuration for the Client API.
-client_api:
-    # Prevents new users from being able to register on this homeserver, except when
-    # using the registration shared secret below.
-    registration_disabled: false
-
-    # Prevents new guest accounts from being created. Guest registration is also
-    # disabled implicitly by setting 'registration_disabled' above.
-    guests_disabled: true
-
-    # If set, allows registration by anyone who knows the shared secret, regardless
-    # of whether registration is otherwise disabled.
-    registration_shared_secret: "{{REGISTRATION_SECRET}}"
-
-    # Whether to require reCAPTCHA for registration. If you have enabled registration
-    # then this is HIGHLY RECOMMENDED to reduce the risk of your homeserver being used
-    # for coordinated spam attacks.
-    enable_registration_captcha: false
-
-    # Settings for ReCAPTCHA.
-    recaptcha_public_key: ""
-    recaptcha_private_key: ""
-    recaptcha_bypass_secret: ""
-
-    # To use hcaptcha.com instead of ReCAPTCHA, set the following parameters, otherwise just keep them empty.
-    # recaptcha_siteverify_api: "https://hcaptcha.com/siteverify"
-    # recaptcha_api_js_url: "https://js.hcaptcha.com/1/api.js"
-    # recaptcha_form_field: "h-captcha-response"
-    # recaptcha_sitekey_class: "h-captcha"
-
-    # TURN server information that this homeserver should send to clients.
-    turn:
-        turn_user_lifetime: "5m"
-        turn_uris:
-        #  - turn:turn.server.org?transport=udp
-        #  - turn:turn.server.org?transport=tcp
-        turn_shared_secret: ""
-        # If your TURN server requires static credentials, then you will need to enter
-        # them here instead of supplying a shared secret. Note that these credentials
-        # will be visible to clients!
-        # turn_username: ""
-        # turn_password: ""
-
-    # Settings for rate-limited endpoints. Rate limiting kicks in after the threshold
-    # number of "slots" have been taken by requests from a specific host. Each "slot"
-    # will be released after the cooloff time in milliseconds. Server administrators
-    # and appservice users are exempt from rate limiting by default.
-    rate_limiting:
-        enabled: true
-        threshold: 20
-        cooloff_ms: 500
-        exempt_user_ids:
-        #  - "@user:domain.com"
-
-# Configuration for the Federation API.
-federation_api:
-    # How many times we will try to resend a failed transaction to a specific server. The
-    # backoff is 2**x seconds, so 1 = 2 seconds, 2 = 4 seconds, 3 = 8 seconds etc. Once
-    # the max retries are exceeded, Dendrite will no longer try to send transactions to
-    # that server until it comes back to life and connects to us again.
-    send_max_retries: 16
-
-    # Disable the validation of TLS certificates of remote federated homeservers. Do not
-    # enable this option in production as it presents a security risk!
-    disable_tls_validation: false
-
-    # Disable HTTP keepalives, which also prevents connection reuse. Dendrite will typically
-    # keep HTTP connections open to remote hosts for 5 minutes as they can be reused much
-    # more quickly than opening new connections each time. Disabling keepalives will close
-    # HTTP connections immediately after a successful request but may result in more CPU and
-    # memory being used on TLS handshakes for each new connection instead.
-    disable_http_keepalives: false
-
-    # Perspective keyservers to use as a backup when direct key fetches fail. This may
-    # be required to satisfy key requests for servers that are no longer online when
-    # joining some rooms.
-    key_perspectives:
-        - server_name: matrix.org
-          keys:
-              - key_id: ed25519:auto
-                public_key: Noi6WqcDj0QmPxCNQqgezwTlBKrfqehY1u2FyWP9uYw
-              - key_id: ed25519:a_RXGa
-                public_key: l8Hft5qXKn1vfHrg3p4+W8gELQVo8N13JkluMfmn2sQ
-
-    # This option will control whether Dendrite will prefer to look up keys directly
-    # or whether it should try perspective servers first, using direct fetches as a
-    # last resort.
-    prefer_direct_fetch: false
-
-    database:
-        connection_string: file:dendrite-federationapi.db
-
-# Configuration for the Media API.
-media_api:
-    # Storage path for uploaded media. May be relative or absolute.
-    base_path: ./media_store
-
-    # The maximum allowed file size (in bytes) for media uploads to this homeserver
-    # (0 = unlimited). If using a reverse proxy, ensure it allows requests at least
-    #this large (e.g. the client_max_body_size setting in nginx).
-    max_file_size_bytes: 10485760
-
-    # Whether to dynamically generate thumbnails if needed.
-    dynamic_thumbnails: false
-
-    # The maximum number of simultaneous thumbnail generators to run.
-    max_thumbnail_generators: 10
-
-    # A list of thumbnail sizes to be generated for media content.
-    thumbnail_sizes:
-        - width: 32
-          height: 32
-          method: crop
-        - width: 96
-          height: 96
-          method: crop
-        - width: 640
-          height: 480
-          method: scale
-
-    database:
-        connection_string: file:dendrite-mediaapi.db
-
-# Configuration for enabling experimental MSCs on this homeserver.
-mscs:
-    mscs:
-    #  - msc2836  # (Threading, see https://github.com/matrix-org/matrix-doc/pull/2836)
-    #  - msc2946  # (Spaces Summary, see https://github.com/matrix-org/matrix-doc/pull/2946)
-
-    database:
-        connection_string: file:dendrite-msc.db
-
-# Configuration for the Sync API.
-sync_api:
-    # This option controls which HTTP header to inspect to find the real remote IP
-    # address of the client. This is likely required if Dendrite is running behind
-    # a reverse proxy server.
-    # real_ip_header: X-Real-IP
-
-    # Configuration for the full-text search engine.
-    search:
-        # Whether or not search is enabled.
-        enabled: false
-
-        # The path where the search index will be created in.
-        index_path: "./searchindex"
-
-        # The language most likely to be used on the server - used when indexing, to
-        # ensure the returned results match expectations. A full list of possible languages
-        # can be found at https://github.com/blevesearch/bleve/tree/master/analysis/lang
-        language: "en"
-
-    database:
-        connection_string: file:dendrite-syncapi.db
-
-# Configuration for the User API.
-user_api:
-    # The cost when hashing passwords on registration/login. Default: 10. Min: 4, Max: 31
-    # See https://pkg.go.dev/golang.org/x/crypto/bcrypt for more information.
-    # Setting this lower makes registration/login consume less CPU resources at the cost
-    # of security should the database be compromised. Setting this higher makes registration/login
-    # consume more CPU resources but makes it harder to brute force password hashes. This value
-    # can be lowered if performing tests or on embedded Dendrite instances (e.g WASM builds).
-    bcrypt_cost: 10
-
-    # The length of time that a token issued for a relying party from
-    # /_matrix/client/r0/user/{userId}/openid/request_token endpoint
-    # is considered to be valid in milliseconds.
-    # The default lifetime is 3600000ms (60 minutes).
-    # openid_token_lifetime_ms: 3600000
-
-    # Users who register on this homeserver will automatically be joined to the rooms listed under "auto_join_rooms" option.
-    # By default, any room aliases included in this list will be created as a publicly joinable room
-    # when the first user registers for the homeserver. If the room already exists,
-    # make certain it is a publicly joinable room, i.e. the join rule of the room must be set to 'public'.
-    # As Spaces are just rooms under the hood, Space aliases may also be used.
-    auto_join_rooms:
-    #  - "#main:matrix.org"
-
-    account_database:
-        connection_string: file:dendrite-userapi.db
-
-room_server:
-    database:
-        connection_string: file:dendrite-roomserverapi.db
-
-key_server:
-    database:
-        connection_string: file:dendrite-keyserverapi.db
-
-relay_api:
-    database:
-        connection_string: file:dendrite-relayapi.db
-
-# Configuration for Opentracing.
-# See https://github.com/matrix-org/dendrite/tree/master/docs/tracing for information on
-# how this works and how to set it up.
-tracing:
-    enabled: false
-    jaeger:
-        serviceName: ""
-        disabled: false
-        rpc_metrics: false
-        tags: []
-        sampler: null
-        reporter: null
-        headers: null
-        baggage_restrictions: null
-        throttler: null
-
-# Logging configuration. The "std" logging type controls the logs being sent to
-# stdout. The "file" logging type controls logs being written to a log folder on
-# the disk. Supported log levels are "debug", "info", "warn", "error".
-logging:
-    - type: std
-      level: debug
-    - type: file
-      level: debug
-      params:
-          path: ./logs

playwright/plugins/homeserver/index.ts

@@ -6,16 +6,7 @@ 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.
 */
 
-export interface HomeserverConfig {
-    readonly configDir: string;
-    readonly baseUrl: string;
-    readonly port: number;
-    readonly registrationSecret: string;
-    readonly dockerUrl: string;
-}
-
 export interface HomeserverInstance {
-    readonly config: HomeserverConfig;
     readonly baseUrl: string;
 
     /**
@@ -43,27 +34,6 @@ export interface HomeserverInstance {
     setThreepid(userId: string, medium: string, address: string): Promise<void>;
 }
 
-export interface StartHomeserverOpts {
-    /** path to template within playwright/plugins/{homeserver}docker/template/ directory. */
-    template: string;
-
-    /** Port of an OAuth server to configure the homeserver to use */
-    oAuthServerPort?: number;
-
-    /** Additional variables to inject into the configuration template **/
-    variables?: Record<string, string | number>;
-}
-
-export interface Homeserver {
-    start(opts: StartHomeserverOpts): Promise<HomeserverInstance>;
-    /**
-     * Stop this test homeserver instance.
-     *
-     * @returns A list of paths relative to the cwd for logfiles generated during this test run.
-     */
-    stop(): Promise<string[]>;
-}
-
 export interface Credentials {
     accessToken: string;
     userId: string;
@@ -71,4 +41,5 @@ export interface Credentials {
     homeServer: string;
     password: string | null; // null for password-less users
     displayName?: string;
+    username: string; // the localpart of the userId
 }

playwright/plugins/homeserver/synapse/consentHomeserver.ts

@@ -0,0 +1,59 @@
+/*
+Copyright 2024 New Vector Ltd.
+Copyright 2023 The Matrix.org Foundation C.I.C.
+
+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 { Fixtures } from "@playwright/test";
+
+import { Services } from "../../../services.ts";
+
+export const consentHomeserver: Fixtures<{}, Services> = {
+    _homeserver: [
+        async ({ _homeserver: container, mailhog }, use) => {
+            container
+                .withCopyDirectoriesToContainer([
+                    { source: "playwright/plugins/homeserver/synapse/res", target: "/data/res" },
+                ])
+                .withConfig({
+                    email: {
+                        enable_notifs: false,
+                        smtp_host: "mailhog",
+                        smtp_port: 1025,
+                        smtp_user: "username",
+                        smtp_pass: "password",
+                        require_transport_security: false,
+                        notif_from: "Your Friendly %(app)s homeserver <noreply@example.com>",
+                        app_name: "Matrix",
+                        notif_template_html: "notif_mail.html",
+                        notif_template_text: "notif_mail.txt",
+                        notif_for_new_users: true,
+                        client_base_url: "http://localhost/element",
+                    },
+                    user_consent: {
+                        template_dir: "/data/res/templates/privacy",
+                        version: "1.0",
+                        server_notice_content: {
+                            msgtype: "m.text",
+                            body: "To continue using this homeserver you must review and agree to the terms and conditions at %(consent_uri)s",
+                        },
+                        send_server_notice_to_guests: true,
+                        block_events_error:
+                            "To continue using this homeserver you must review and agree to the terms and conditions at %(consent_uri)s",
+                        require_at_registration: true,
+                    },
+                    server_notices: {
+                        system_mxid_localpart: "notices",
+                        system_mxid_display_name: "Server Notices",
+                        system_mxid_avatar_url: "mxc://localhost/oumMVlgDnLYFaPVkExemNVVZ",
+                        room_name: "Server Notices",
+                    },
+                })
+                .withConfigField("listeners[0].resources[0].names", ["client", "consent"]);
+            await use(container);
+        },
+        { scope: "worker" },
+    ],
+};

playwright/plugins/homeserver/synapse/emailHomeserver.ts

@@ -0,0 +1,31 @@
+/*
+Copyright 2024 New Vector Ltd.
+Copyright 2023 The Matrix.org Foundation C.I.C.
+
+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 { Fixtures } from "@playwright/test";
+
+import { Services } from "../../../services.ts";
+
+export const emailHomeserver: Fixtures<{}, Services> = {
+    _homeserver: [
+        async ({ _homeserver: container, mailhog }, use) => {
+            container.withConfig({
+                enable_registration_without_verification: undefined,
+                disable_msisdn_registration: undefined,
+                registrations_require_3pid: ["email"],
+                email: {
+                    smtp_host: "mailhog",
+                    smtp_port: 1025,
+                    notif_from: "Your Friendly %(app)s homeserver <noreply@example.com>",
+                    app_name: "my_branded_matrix_server",
+                },
+            });
+            await use(container);
+        },
+        { scope: "worker" },
+    ],
+};

playwright/plugins/homeserver/synapse/index.ts

@@ -1,243 +0,0 @@
-/*
-Copyright 2024 New Vector Ltd.
-Copyright 2023 The Matrix.org Foundation C.I.C.
-
-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 * as path from "node:path";
-import * as os from "node:os";
-import * as crypto from "node:crypto";
-import * as fse from "fs-extra";
-import { APIRequestContext } from "@playwright/test";
-
-import { getFreePort } from "../../utils/port";
-import { Docker } from "../../docker";
-import { HomeserverConfig, HomeserverInstance, Homeserver, StartHomeserverOpts, Credentials } from "..";
-import { randB64Bytes } from "../../utils/rand";
-
-// Docker tag to use for synapse docker image.
-// We target a specific digest as every now and then a Synapse update will break our CI.
-// This digest is updated by the playwright-image-updates.yaml workflow periodically.
-const DOCKER_TAG = "develop@sha256:39f94b005e87cd3042c2535c37d8d9f915a88072fe79f6283ac18977fe134321";
-
-async function cfgDirFromTemplate(opts: StartHomeserverOpts): Promise<Omit<HomeserverConfig, "dockerUrl">> {
-    const templateDir = path.join(__dirname, "templates", opts.template);
-
-    const stats = await fse.stat(templateDir);
-    if (!stats?.isDirectory) {
-        throw new Error(`No such template: ${opts.template}`);
-    }
-    const tempDir = await fse.mkdtemp(path.join(os.tmpdir(), "react-sdk-synapsedocker-"));
-
-    // copy the contents of the template dir, omitting homeserver.yaml as we'll template that
-    console.log(`Copy ${templateDir} -> ${tempDir}`);
-    await fse.copy(templateDir, tempDir, { filter: (f) => path.basename(f) !== "homeserver.yaml" });
-
-    const registrationSecret = randB64Bytes(16);
-    const macaroonSecret = randB64Bytes(16);
-    const formSecret = randB64Bytes(16);
-
-    const port = await getFreePort();
-    const baseUrl = `http://localhost:${port}`;
-
-    // now copy homeserver.yaml, applying substitutions
-    const templateHomeserver = path.join(templateDir, "homeserver.yaml");
-    const outputHomeserver = path.join(tempDir, "homeserver.yaml");
-    console.log(`Gen ${templateHomeserver} -> ${outputHomeserver}`);
-    let hsYaml = await fse.readFile(templateHomeserver, "utf8");
-    hsYaml = hsYaml.replace(/{{REGISTRATION_SECRET}}/g, registrationSecret);
-    hsYaml = hsYaml.replace(/{{MACAROON_SECRET_KEY}}/g, macaroonSecret);
-    hsYaml = hsYaml.replace(/{{FORM_SECRET}}/g, formSecret);
-    hsYaml = hsYaml.replace(/{{PUBLIC_BASEURL}}/g, baseUrl);
-    if (opts.oAuthServerPort) {
-        hsYaml = hsYaml.replace(/{{OAUTH_SERVER_PORT}}/g, opts.oAuthServerPort.toString());
-    }
-    if (opts.variables) {
-        for (const key in opts.variables) {
-            hsYaml = hsYaml.replace(new RegExp("%" + key + "%", "g"), String(opts.variables[key]));
-        }
-    }
-
-    await fse.writeFile(outputHomeserver, hsYaml);
-
-    // now generate a signing key (we could use synapse's config generation for
-    // this, or we could just do this...)
-    // NB. This assumes the homeserver.yaml specifies the key in this location
-    const signingKey = randB64Bytes(32);
-    const outputSigningKey = path.join(tempDir, "localhost.signing.key");
-    console.log(`Gen -> ${outputSigningKey}`);
-    await fse.writeFile(outputSigningKey, `ed25519 x ${signingKey}`);
-
-    // Allow anyone to read, write and execute in the /temp/react-sdk-synapsedocker-xxx directory
-    // so that the DIND setup that we use to update the playwright screenshots work without any issues.
-    await fse.chmod(tempDir, 0o757);
-
-    return {
-        port,
-        baseUrl,
-        configDir: tempDir,
-        registrationSecret,
-    };
-}
-
-export class Synapse implements Homeserver, HomeserverInstance {
-    protected docker: Docker = new Docker();
-    public config: HomeserverConfig & { serverId: string };
-
-    private adminToken?: string;
-
-    public constructor(private readonly request: APIRequestContext) {}
-
-    /**
-     * Start a synapse instance: the template must be the name of
-     * one of the templates in the playwright/plugins/synapsedocker/templates
-     * directory.
-     */
-    public async start(opts: StartHomeserverOpts): Promise<HomeserverInstance> {
-        if (this.config) await this.stop();
-
-        const synCfg = await cfgDirFromTemplate(opts);
-        console.log(`Starting synapse with config dir ${synCfg.configDir}...`);
-        const dockerSynapseParams = ["-v", `${synCfg.configDir}:/data`, "-p", `${synCfg.port}:8008/tcp`];
-        const synapseId = await this.docker.run({
-            image: `ghcr.io/element-hq/synapse:${DOCKER_TAG}`,
-            containerName: `react-sdk-playwright-synapse`,
-            params: dockerSynapseParams,
-            cmd: ["run"],
-        });
-        console.log(`Started synapse with id ${synapseId} on port ${synCfg.port}.`);
-        // Await Synapse healthcheck
-        await this.docker.exec([
-            "curl",
-            "--connect-timeout",
-            "30",
-            "--retry",
-            "30",
-            "--retry-delay",
-            "1",
-            "--retry-all-errors",
-            "--silent",
-            "http://localhost:8008/health",
-        ]);
-        const dockerUrl = `http://${await this.docker.getContainerIp()}:8008`;
-        this.config = {
-            ...synCfg,
-            serverId: synapseId,
-            dockerUrl,
-        };
-        return this;
-    }
-
-    public async stop(): Promise<string[]> {
-        if (!this.config) throw new Error("Missing existing synapse instance, did you call stop() before start()?");
-        const id = this.config.serverId;
-        const synapseLogsPath = path.join("playwright", "logs", "synapse", id);
-        await fse.ensureDir(synapseLogsPath);
-        await this.docker.persistLogsToFile({
-            stdoutFile: path.join(synapseLogsPath, "stdout.log"),
-            stderrFile: path.join(synapseLogsPath, "stderr.log"),
-        });
-        await this.docker.stop();
-        await fse.remove(this.config.configDir);
-        console.log(`Stopped synapse id ${id}.`);
-
-        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,
-        displayName?: string,
-        admin = false,
-    ): Promise<Credentials> {
-        const url = `${this.config.baseUrl}/_synapse/admin/v1/register`;
-        const { nonce } = await this.request.get(url).then((r) => r.json());
-        const mac = crypto
-            .createHmac("sha1", this.config.registrationSecret)
-            .update(`${nonce}\0${username}\0${password}\0${admin ? "" : "not"}admin`)
-            .digest("hex");
-        const res = await this.request.post(url, {
-            data: {
-                nonce,
-                username,
-                password,
-                mac,
-                admin,
-                displayname: displayName,
-            },
-        });
-
-        if (!res.ok()) {
-            throw await res.json();
-        }
-
-        const data = await res.json();
-        return {
-            homeServer: data.home_server,
-            accessToken: data.access_token,
-            userId: data.user_id,
-            deviceId: data.device_id,
-            password,
-            displayName,
-        };
-    }
-
-    public registerUser(username: string, password: string, displayName?: string): Promise<Credentials> {
-        return this.registerUserInternal(username, password, displayName, false);
-    }
-
-    public async loginUser(userId: string, password: string): Promise<Credentials> {
-        const url = `${this.config.baseUrl}/_matrix/client/v3/login`;
-        const res = await this.request.post(url, {
-            data: {
-                type: "m.login.password",
-                identifier: {
-                    type: "m.id.user",
-                    user: userId,
-                },
-                password: password,
-            },
-        });
-        const json = await res.json();
-
-        return {
-            password,
-            accessToken: json.access_token,
-            userId: json.user_id,
-            deviceId: json.device_id,
-            homeServer: json.home_server,
-        };
-    }
-
-    public async setThreepid(userId: string, medium: string, address: string): Promise<void> {
-        if (this.adminToken === undefined) {
-            const result = await this.registerUserInternal("admin", "totalyinsecureadminpassword", undefined, true);
-            this.adminToken = result.accessToken;
-        }
-
-        const url = `${this.config.baseUrl}/_synapse/admin/v2/users/${userId}`;
-        const res = await this.request.put(url, {
-            data: {
-                threepids: [
-                    {
-                        medium,
-                        address,
-                    },
-                ],
-            },
-            headers: {
-                Authorization: `Bearer ${this.adminToken}`,
-            },
-        });
-
-        if (!res.ok()) {
-            throw await res.json();
-        }
-    }
-}

playwright/plugins/homeserver/synapse/legacyOAuthHomeserver.ts

@@ -0,0 +1,51 @@
+/*
+Copyright 2024 New Vector Ltd.
+Copyright 2023 The Matrix.org Foundation C.I.C.
+
+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 { Fixtures } from "@playwright/test";
+import { TestContainers } from "testcontainers";
+
+import { Services } from "../../../services.ts";
+import { OAuthServer } from "../../oauth_server";
+
+export const legacyOAuthHomeserver: Fixtures<{}, Services> = {
+    _homeserver: [
+        async ({ _homeserver: container }, use) => {
+            const server = new OAuthServer();
+            const port = server.start();
+
+            await TestContainers.exposeHostPorts(port);
+            container.withConfig({
+                oidc_providers: [
+                    {
+                        idp_id: "test",
+                        idp_name: "OAuth test",
+                        issuer: `http://localhost:${port}/oauth`,
+                        authorization_endpoint: `http://localhost:${port}/oauth/auth.html`,
+                        // the token endpoint receives requests from synapse,
+                        // rather than the webapp, so needs to escape the docker container.
+                        token_endpoint: `http://host.testcontainers.internal:${port}/oauth/token`,
+                        userinfo_endpoint: `http://host.testcontainers.internal:${port}/oauth/userinfo`,
+                        client_id: "synapse",
+                        discover: false,
+                        scopes: ["profile"],
+                        skip_verification: true,
+                        client_auth_method: "none",
+                        user_mapping_provider: {
+                            config: {
+                                display_name_template: "{{ user.name }}",
+                            },
+                        },
+                    },
+                ],
+            });
+            await use(container);
+            server.stop();
+        },
+        { scope: "worker" },
+    ],
+};

playwright/plugins/homeserver/synapse/masHomeserver.ts

@@ -0,0 +1,86 @@
+/*
+Copyright 2024 New Vector Ltd.
+Copyright 2023 The Matrix.org Foundation C.I.C.
+
+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 { Fixtures, PlaywrightTestArgs } from "@playwright/test";
+
+import { Services } from "../../../services.ts";
+import { Fixtures as BaseFixtures } from "../../../element-web-test.ts";
+import { MatrixAuthenticationServiceContainer } from "../../../testcontainers/mas.ts";
+
+type Fixture = PlaywrightTestArgs & BaseFixtures;
+export const masHomeserver: Fixtures<Fixture, Services, Fixture> = {
+    mas: [
+        async ({ _homeserver: homeserver, logger, network, postgres, mailhog }, use) => {
+            const config = {
+                clients: [
+                    {
+                        client_id: "0000000000000000000SYNAPSE",
+                        client_auth_method: "client_secret_basic",
+                        client_secret: "SomeRandomSecret",
+                    },
+                ],
+                matrix: {
+                    homeserver: "localhost",
+                    secret: "AnotherRandomSecret",
+                    endpoint: "http://homeserver:8008",
+                },
+            };
+
+            const container = await new MatrixAuthenticationServiceContainer(postgres)
+                .withNetwork(network)
+                .withNetworkAliases("mas")
+                .withLogConsumer(logger.getConsumer("mas"))
+                .withConfig(config)
+                .start();
+
+            homeserver.withConfig({
+                enable_registration: undefined,
+                enable_registration_without_verification: undefined,
+                disable_msisdn_registration: undefined,
+                password_config: undefined,
+                experimental_features: {
+                    msc3861: {
+                        enabled: true,
+                        issuer: `http://mas:8080/`,
+                        introspection_endpoint: "http://mas:8080/oauth2/introspect",
+                        client_id: config.clients[0].client_id,
+                        client_auth_method: config.clients[0].client_auth_method,
+                        client_secret: config.clients[0].client_secret,
+                        admin_token: config.matrix.secret,
+                    },
+                },
+            });
+
+            await use(container);
+            await container.stop();
+        },
+        { scope: "worker" },
+    ],
+
+    config: async ({ homeserver, context, mas }, use) => {
+        const issuer = `${mas.baseUrl}/`;
+        const wellKnown = {
+            "m.homeserver": {
+                base_url: homeserver.baseUrl,
+            },
+            "org.matrix.msc2965.authentication": {
+                issuer,
+                account: `${issuer}account`,
+            },
+        };
+
+        // Ensure org.matrix.msc2965.authentication is in well-known
+        await context.route("https://localhost/.well-known/matrix/client", async (route) => {
+            await route.fulfill({ json: wellKnown });
+        });
+
+        await use({
+            default_server_config: wellKnown,
+        });
+    },
+};

playwright/plugins/homeserver/synapse/templates/COPYME/README.md

@@ -1,3 +0,0 @@
-# Meta-template for synapse templates
-
-To make another template, you can copy this directory

playwright/plugins/homeserver/synapse/templates/COPYME/homeserver.yaml

@@ -1,72 +0,0 @@
-server_name: "localhost"
-pid_file: /data/homeserver.pid
-# XXX: This won't actually be right: it lets docker allocate an ephemeral port,
-# so we have a chicken-and-egg problem
-public_baseurl: http://localhost:8008/
-# Listener is always port 8008 (configured in the container)
-listeners:
-    - port: 8008
-      tls: false
-      bind_addresses: ["::"]
-      type: http
-      x_forwarded: true
-
-      resources:
-          - names: [client, federation, consent]
-            compress: false
-
-# An sqlite in-memory database is fast & automatically wipes each time
-database:
-    name: "sqlite3"
-    args:
-        database: ":memory:"
-
-# Needs to be configured to log to the console like a good docker process
-log_config: "/data/log.config"
-
-rc_messages_per_second: 10000
-rc_message_burst_count: 10000
-rc_registration:
-    per_second: 10000
-    burst_count: 10000
-
-rc_login:
-    address:
-        per_second: 10000
-        burst_count: 10000
-    account:
-        per_second: 10000
-        burst_count: 10000
-    failed_attempts:
-        per_second: 10000
-        burst_count: 10000
-
-media_store_path: "/data/media_store"
-uploads_path: "/data/uploads"
-enable_registration: true
-enable_registration_without_verification: true
-disable_msisdn_registration: false
-# These placeholders will be be replaced with values generated at start
-registration_shared_secret: "{{REGISTRATION_SECRET}}"
-report_stats: false
-macaroon_secret_key: "{{MACAROON_SECRET_KEY}}"
-form_secret: "{{FORM_SECRET}}"
-# Signing key must be here: it will be generated to this file
-signing_key_path: "/data/localhost.signing.key"
-email:
-    enable_notifs: false
-    smtp_host: "localhost"
-    smtp_port: 25
-    smtp_user: "exampleusername"
-    smtp_pass: "examplepassword"
-    require_transport_security: False
-    notif_from: "Your Friendly %(app)s homeserver <noreply@example.com>"
-    app_name: Matrix
-    notif_template_html: notif_mail.html
-    notif_template_text: notif_mail.txt
-    notif_for_new_users: True
-    client_base_url: "http://localhost/element"
-
-trusted_key_servers:
-    - server_name: "matrix.org"
-suppress_key_server_warning: true

playwright/plugins/homeserver/synapse/templates/COPYME/log.config

@@ -1,50 +0,0 @@
-# Log configuration for Synapse.
-#
-# This is a YAML file containing a standard Python logging configuration
-# dictionary. See [1] for details on the valid settings.
-#
-# Synapse also supports structured logging for machine readable logs which can
-# be ingested by ELK stacks. See [2] for details.
-#
-# [1]: https://docs.python.org/3.7/library/logging.config.html#configuration-dictionary-schema
-# [2]: https://matrix-org.github.io/synapse/latest/structured_logging.html
-
-version: 1
-
-formatters:
-    precise:
-        format: '%(asctime)s - %(name)s - %(lineno)d - %(levelname)s - %(request)s - %(message)s'
-
-handlers:
-    # A handler that writes logs to stderr. Unused by default, but can be used
-    # instead of "buffer" and "file" in the logger handlers.
-    console:
-        class: logging.StreamHandler
-        formatter: precise
-
-loggers:
-    synapse.storage.SQL:
-        # beware: increasing this to DEBUG will make synapse log sensitive
-        # information such as access tokens.
-        level: INFO
-
-    twisted:
-        # We send the twisted logging directly to the file handler,
-        # to work around https://github.com/matrix-org/synapse/issues/3471
-        # when using "buffer" logger. Use "console" to log to stderr instead.
-        handlers: [console]
-        propagate: false
-
-root:
-    level: INFO
-
-    # Write logs to the `buffer` handler, which will buffer them together in memory,
-    # then write them to a file.
-    #
-    # Replace "buffer" with "console" to log to stderr instead. (Note that you'll
-    # also need to update the configuration for the `twisted` logger above, in
-    # this case.)
-    #
-    handlers: [console]
-
-disable_existing_loggers: false

playwright/plugins/homeserver/synapse/templates/consent/README.md

@@ -1 +0,0 @@
-A synapse configured with user privacy consent enabled

playwright/plugins/homeserver/synapse/templates/consent/homeserver.yaml

@@ -1,84 +0,0 @@
-server_name: "localhost"
-pid_file: /data/homeserver.pid
-public_baseurl: "{{PUBLIC_BASEURL}}"
-listeners:
-    - port: 8008
-      tls: false
-      bind_addresses: ["::"]
-      type: http
-      x_forwarded: true
-
-      resources:
-          - names: [client, federation, consent]
-            compress: false
-
-database:
-    name: "sqlite3"
-    args:
-        database: ":memory:"
-
-log_config: "/data/log.config"
-
-rc_messages_per_second: 10000
-rc_message_burst_count: 10000
-rc_registration:
-    per_second: 10000
-    burst_count: 10000
-
-rc_login:
-    address:
-        per_second: 10000
-        burst_count: 10000
-    account:
-        per_second: 10000
-        burst_count: 10000
-    failed_attempts:
-        per_second: 10000
-        burst_count: 10000
-
-media_store_path: "/data/media_store"
-uploads_path: "/data/uploads"
-enable_registration: true
-enable_registration_without_verification: true
-disable_msisdn_registration: false
-registration_shared_secret: "{{REGISTRATION_SECRET}}"
-report_stats: false
-macaroon_secret_key: "{{MACAROON_SECRET_KEY}}"
-form_secret: "{{FORM_SECRET}}"
-signing_key_path: "/data/localhost.signing.key"
-email:
-    enable_notifs: false
-    smtp_host: "localhost"
-    smtp_port: 25
-    smtp_user: "exampleusername"
-    smtp_pass: "examplepassword"
-    require_transport_security: False
-    notif_from: "Your Friendly %(app)s homeserver <noreply@example.com>"
-    app_name: Matrix
-    notif_template_html: notif_mail.html
-    notif_template_text: notif_mail.txt
-    notif_for_new_users: True
-    client_base_url: "http://localhost/element"
-
-user_consent:
-    template_dir: /data/res/templates/privacy
-    version: 1.0
-    server_notice_content:
-        msgtype: m.text
-        body: >-
-            To continue using this homeserver you must review and agree to the
-            terms and conditions at %(consent_uri)s
-    send_server_notice_to_guests: True
-    block_events_error: >-
-        To continue using this homeserver you must review and agree to the
-        terms and conditions at %(consent_uri)s
-    require_at_registration: true
-
-server_notices:
-    system_mxid_localpart: notices
-    system_mxid_display_name: "Server Notices"
-    system_mxid_avatar_url: "mxc://localhost:5005/oumMVlgDnLYFaPVkExemNVVZ"
-    room_name: "Server Notices"
-trusted_key_servers:
-    - server_name: "matrix.org"
-suppress_key_server_warning: true

playwright/plugins/homeserver/synapse/templates/consent/log.config

@@ -1,50 +0,0 @@
-# Log configuration for Synapse.
-#
-# This is a YAML file containing a standard Python logging configuration
-# dictionary. See [1] for details on the valid settings.
-#
-# Synapse also supports structured logging for machine readable logs which can
-# be ingested by ELK stacks. See [2] for details.
-#
-# [1]: https://docs.python.org/3.7/library/logging.config.html#configuration-dictionary-schema
-# [2]: https://matrix-org.github.io/synapse/latest/structured_logging.html
-
-version: 1
-
-formatters:
-    precise:
-        format: '%(asctime)s - %(name)s - %(lineno)d - %(levelname)s - %(request)s - %(message)s'
-
-handlers:
-    # A handler that writes logs to stderr. Unused by default, but can be used
-    # instead of "buffer" and "file" in the logger handlers.
-    console:
-        class: logging.StreamHandler
-        formatter: precise
-
-loggers:
-    synapse.storage.SQL:
-        # beware: increasing this to DEBUG will make synapse log sensitive
-        # information such as access tokens.
-        level: DEBUG
-
-    twisted:
-        # We send the twisted logging directly to the file handler,
-        # to work around https://github.com/matrix-org/synapse/issues/3471
-        # when using "buffer" logger. Use "console" to log to stderr instead.
-        handlers: [console]
-        propagate: false
-
-root:
-    level: DEBUG
-
-    # Write logs to the `buffer` handler, which will buffer them together in memory,
-    # then write them to a file.
-    #
-    # Replace "buffer" with "console" to log to stderr instead. (Note that you'll
-    # also need to update the configuration for the `twisted` logger above, in
-    # this case.)
-    #
-    handlers: [console]
-
-disable_existing_loggers: false

playwright/plugins/homeserver/synapse/templates/default/README.md

@@ -1 +0,0 @@
-A synapse configured with user privacy consent disabled

playwright/plugins/homeserver/synapse/templates/default/homeserver.yaml

@@ -1,106 +0,0 @@
-server_name: "localhost"
-pid_file: /data/homeserver.pid
-public_baseurl: "{{PUBLIC_BASEURL}}"
-listeners:
-    - port: 8008
-      tls: false
-      bind_addresses: ["::"]
-      type: http
-      x_forwarded: true
-
-      resources:
-          - names: [client]
-            compress: false
-
-database:
-    name: "sqlite3"
-    args:
-        database: ":memory:"
-
-log_config: "/data/log.config"
-
-rc_messages_per_second: 10000
-rc_message_burst_count: 10000
-rc_registration:
-    per_second: 10000
-    burst_count: 10000
-rc_joins:
-    local:
-        per_second: 9999
-        burst_count: 9999
-    remote:
-        per_second: 9999
-        burst_count: 9999
-rc_joins_per_room:
-    per_second: 9999
-    burst_count: 9999
-rc_3pid_validation:
-    per_second: 1000
-    burst_count: 1000
-
-rc_invites:
-    per_room:
-        per_second: 1000
-        burst_count: 1000
-    per_user:
-        per_second: 1000
-        burst_count: 1000
-
-rc_login:
-    address:
-        per_second: 10000
-        burst_count: 10000
-    account:
-        per_second: 10000
-        burst_count: 10000
-    failed_attempts:
-        per_second: 10000
-        burst_count: 10000
-
-media_store_path: "/data/media_store"
-uploads_path: "/data/uploads"
-enable_registration: true
-enable_registration_without_verification: true
-disable_msisdn_registration: false
-registration_shared_secret: "{{REGISTRATION_SECRET}}"
-report_stats: false
-macaroon_secret_key: "{{MACAROON_SECRET_KEY}}"
-form_secret: "{{FORM_SECRET}}"
-signing_key_path: "/data/localhost.signing.key"
-
-trusted_key_servers:
-    - server_name: "matrix.org"
-suppress_key_server_warning: true
-
-ui_auth:
-    session_timeout: "300s"
-
-oidc_providers:
-    - idp_id: test
-      idp_name: "OAuth test"
-      issuer: "http://localhost:{{OAUTH_SERVER_PORT}}/oauth"
-      authorization_endpoint: "http://localhost:{{OAUTH_SERVER_PORT}}/oauth/auth.html"
-      # the token endpoint receives requests from synapse, rather than the webapp, so needs to escape the docker container.
-      token_endpoint: "http://host.containers.internal:{{OAUTH_SERVER_PORT}}/oauth/token"
-      userinfo_endpoint: "http://host.containers.internal:{{OAUTH_SERVER_PORT}}/oauth/userinfo"
-      client_id: "synapse"
-      discover: false
-      scopes: ["profile"]
-      skip_verification: true
-      client_auth_method: none
-      user_mapping_provider:
-          config:
-              display_name_template: "{{ user.name }}"
-
-# Inhibit background updates as this Synapse isn't long-lived
-background_updates:
-    min_batch_size: 100000
-    sleep_duration_ms: 100000
-
-experimental_features:
-    # Needed for e2e/crypto/crypto.spec.ts > Cryptography > decryption failure
-    # messages > non-joined historical messages.
-    # Can be removed after Synapse enables it by default
-    msc4115_membership_on_events: true
-
-enable_authenticated_media: true

playwright/plugins/homeserver/synapse/templates/default/log.config

@@ -1,50 +0,0 @@
-# Log configuration for Synapse.
-#
-# This is a YAML file containing a standard Python logging configuration
-# dictionary. See [1] for details on the valid settings.
-#
-# Synapse also supports structured logging for machine readable logs which can
-# be ingested by ELK stacks. See [2] for details.
-#
-# [1]: https://docs.python.org/3.7/library/logging.config.html#configuration-dictionary-schema
-# [2]: https://matrix-org.github.io/synapse/latest/structured_logging.html
-
-version: 1
-
-formatters:
-    precise:
-        format: '%(asctime)s - %(name)s - %(lineno)d - %(levelname)s - %(request)s - %(message)s'
-
-handlers:
-    # A handler that writes logs to stderr. Unused by default, but can be used
-    # instead of "buffer" and "file" in the logger handlers.
-    console:
-        class: logging.StreamHandler
-        formatter: precise
-
-loggers:
-    synapse.storage.SQL:
-        # beware: increasing this to DEBUG will make synapse log sensitive
-        # information such as access tokens.
-        level: DEBUG
-
-    twisted:
-        # We send the twisted logging directly to the file handler,
-        # to work around https://github.com/matrix-org/synapse/issues/3471
-        # when using "buffer" logger. Use "console" to log to stderr instead.
-        handlers: [console]
-        propagate: false
-
-root:
-    level: DEBUG
-
-    # Write logs to the `buffer` handler, which will buffer them together in memory,
-    # then write them to a file.
-    #
-    # Replace "buffer" with "console" to log to stderr instead. (Note that you'll
-    # also need to update the configuration for the `twisted` logger above, in
-    # this case.)
-    #
-    handlers: [console]
-
-disable_existing_loggers: false

playwright/plugins/homeserver/synapse/templates/dehydration/README.md

@@ -1 +0,0 @@
-A synapse configured with device dehydration v2 enabled

playwright/plugins/homeserver/synapse/templates/dehydration/homeserver.yaml

@@ -1,102 +0,0 @@
-server_name: "localhost"
-pid_file: /data/homeserver.pid
-public_baseurl: "{{PUBLIC_BASEURL}}"
-listeners:
-    - port: 8008
-      tls: false
-      bind_addresses: ["::"]
-      type: http
-      x_forwarded: true
-
-      resources:
-          - names: [client]
-            compress: false
-
-database:
-    name: "sqlite3"
-    args:
-        database: ":memory:"
-
-log_config: "/data/log.config"
-
-rc_messages_per_second: 10000
-rc_message_burst_count: 10000
-rc_registration:
-    per_second: 10000
-    burst_count: 10000
-rc_joins:
-    local:
-        per_second: 9999
-        burst_count: 9999
-    remote:
-        per_second: 9999
-        burst_count: 9999
-rc_joins_per_room:
-    per_second: 9999
-    burst_count: 9999
-rc_3pid_validation:
-    per_second: 1000
-    burst_count: 1000
-
-rc_invites:
-    per_room:
-        per_second: 1000
-        burst_count: 1000
-    per_user:
-        per_second: 1000
-        burst_count: 1000
-
-rc_login:
-    address:
-        per_second: 10000
-        burst_count: 10000
-    account:
-        per_second: 10000
-        burst_count: 10000
-    failed_attempts:
-        per_second: 10000
-        burst_count: 10000
-
-media_store_path: "/data/media_store"
-uploads_path: "/data/uploads"
-enable_registration: true
-enable_registration_without_verification: true
-disable_msisdn_registration: false
-registration_shared_secret: "{{REGISTRATION_SECRET}}"
-report_stats: false
-macaroon_secret_key: "{{MACAROON_SECRET_KEY}}"
-form_secret: "{{FORM_SECRET}}"
-signing_key_path: "/data/localhost.signing.key"
-
-trusted_key_servers:
-    - server_name: "matrix.org"
-suppress_key_server_warning: true
-
-ui_auth:
-    session_timeout: "300s"
-
-oidc_providers:
-    - idp_id: test
-      idp_name: "OAuth test"
-      issuer: "http://localhost:{{OAUTH_SERVER_PORT}}/oauth"
-      authorization_endpoint: "http://localhost:{{OAUTH_SERVER_PORT}}/oauth/auth.html"
-      # the token endpoint receives requests from synapse, rather than the webapp, so needs to escape the docker container.
-      token_endpoint: "http://host.containers.internal:{{OAUTH_SERVER_PORT}}/oauth/token"
-      userinfo_endpoint: "http://host.containers.internal:{{OAUTH_SERVER_PORT}}/oauth/userinfo"
-      client_id: "synapse"
-      discover: false
-      scopes: ["profile"]
-      skip_verification: true
-      client_auth_method: none
-      user_mapping_provider:
-          config:
-              display_name_template: "{{ user.name }}"
-
-# Inhibit background updates as this Synapse isn't long-lived
-background_updates:
-    min_batch_size: 100000
-    sleep_duration_ms: 100000
-
-experimental_features:
-    msc2697_enabled: false
-    msc3814_enabled: true

playwright/plugins/homeserver/synapse/templates/dehydration/log.config

@@ -1,50 +0,0 @@
-# Log configuration for Synapse.
-#
-# This is a YAML file containing a standard Python logging configuration
-# dictionary. See [1] for details on the valid settings.
-#
-# Synapse also supports structured logging for machine readable logs which can
-# be ingested by ELK stacks. See [2] for details.
-#
-# [1]: https://docs.python.org/3.7/library/logging.config.html#configuration-dictionary-schema
-# [2]: https://matrix-org.github.io/synapse/latest/structured_logging.html
-
-version: 1
-
-formatters:
-    precise:
-        format: '%(asctime)s - %(name)s - %(lineno)d - %(levelname)s - %(request)s - %(message)s'
-
-handlers:
-    # A handler that writes logs to stderr. Unused by default, but can be used
-    # instead of "buffer" and "file" in the logger handlers.
-    console:
-        class: logging.StreamHandler
-        formatter: precise
-
-loggers:
-    synapse.storage.SQL:
-        # beware: increasing this to DEBUG will make synapse log sensitive
-        # information such as access tokens.
-        level: DEBUG
-
-    twisted:
-        # We send the twisted logging directly to the file handler,
-        # to work around https://github.com/matrix-org/synapse/issues/3471
-        # when using "buffer" logger. Use "console" to log to stderr instead.
-        handlers: [console]
-        propagate: false
-
-root:
-    level: DEBUG
-
-    # Write logs to the `buffer` handler, which will buffer them together in memory,
-    # then write them to a file.
-    #
-    # Replace "buffer" with "console" to log to stderr instead. (Note that you'll
-    # also need to update the configuration for the `twisted` logger above, in
-    # this case.)
-    #
-    handlers: [console]
-
-disable_existing_loggers: false

playwright/plugins/homeserver/synapse/templates/email/README.md

@@ -1 +0,0 @@
-A synapse configured to require an email for registration

playwright/plugins/homeserver/synapse/templates/email/homeserver.yaml

@@ -1,44 +0,0 @@
-server_name: "localhost"
-pid_file: /data/homeserver.pid
-public_baseurl: "{{PUBLIC_BASEURL}}"
-listeners:
-    - port: 8008
-      tls: false
-      bind_addresses: ["::"]
-      type: http
-      x_forwarded: true
-
-      resources:
-          - names: [client]
-            compress: false
-
-database:
-    name: "sqlite3"
-    args:
-        database: ":memory:"
-
-log_config: "/data/log.config"
-
-media_store_path: "/data/media_store"
-uploads_path: "/data/uploads"
-enable_registration: true
-registrations_require_3pid:
-    - email
-registration_shared_secret: "{{REGISTRATION_SECRET}}"
-report_stats: false
-macaroon_secret_key: "{{MACAROON_SECRET_KEY}}"
-form_secret: "{{FORM_SECRET}}"
-signing_key_path: "/data/localhost.signing.key"
-
-trusted_key_servers:
-    - server_name: "matrix.org"
-suppress_key_server_warning: true
-
-ui_auth:
-    session_timeout: "300s"
-
-email:
-    smtp_host: "%SMTP_HOST%"
-    smtp_port: %SMTP_PORT%
-    notif_from: "Your Friendly %(app)s homeserver <noreply@example.com>"
-    app_name: my_branded_matrix_server

playwright/plugins/homeserver/synapse/templates/email/log.config

@@ -1,50 +0,0 @@
-# Log configuration for Synapse.
-#
-# This is a YAML file containing a standard Python logging configuration
-# dictionary. See [1] for details on the valid settings.
-#
-# Synapse also supports structured logging for machine readable logs which can
-# be ingested by ELK stacks. See [2] for details.
-#
-# [1]: https://docs.python.org/3.7/library/logging.config.html#configuration-dictionary-schema
-# [2]: https://matrix-org.github.io/synapse/latest/structured_logging.html
-
-version: 1
-
-formatters:
-    precise:
-        format: '%(asctime)s - %(name)s - %(lineno)d - %(levelname)s - %(request)s - %(message)s'
-
-handlers:
-    # A handler that writes logs to stderr. Unused by default, but can be used
-    # instead of "buffer" and "file" in the logger handlers.
-    console:
-        class: logging.StreamHandler
-        formatter: precise
-
-loggers:
-    synapse.storage.SQL:
-        # beware: increasing this to DEBUG will make synapse log sensitive
-        # information such as access tokens.
-        level: INFO
-
-    twisted:
-        # We send the twisted logging directly to the file handler,
-        # to work around https://github.com/matrix-org/synapse/issues/3471
-        # when using "buffer" logger. Use "console" to log to stderr instead.
-        handlers: [console]
-        propagate: false
-
-root:
-    level: INFO
-
-    # Write logs to the `buffer` handler, which will buffer them together in memory,
-    # then write them to a file.
-    #
-    # Replace "buffer" with "console" to log to stderr instead. (Note that you'll
-    # also need to update the configuration for the `twisted` logger above, in
-    # this case.)
-    #
-    handlers: [console]
-
-disable_existing_loggers: false

playwright/plugins/homeserver/synapse/templates/guest-enabled/README.md

@@ -1 +0,0 @@
-A synapse configured with guest registration enabled.

playwright/plugins/homeserver/synapse/templates/guest-enabled/homeserver.yaml

@@ -1,105 +0,0 @@
-server_name: "localhost"
-pid_file: /data/homeserver.pid
-public_baseurl: "{{PUBLIC_BASEURL}}"
-listeners:
-    - port: 8008
-      tls: false
-      bind_addresses: ["::"]
-      type: http
-      x_forwarded: true
-
-      resources:
-          - names: [client]
-            compress: false
-
-database:
-    name: "sqlite3"
-    args:
-        database: ":memory:"
-
-log_config: "/data/log.config"
-
-rc_messages_per_second: 10000
-rc_message_burst_count: 10000
-rc_registration:
-    per_second: 10000
-    burst_count: 10000
-rc_joins:
-    local:
-        per_second: 9999
-        burst_count: 9999
-    remote:
-        per_second: 9999
-        burst_count: 9999
-rc_joins_per_room:
-    per_second: 9999
-    burst_count: 9999
-rc_3pid_validation:
-    per_second: 1000
-    burst_count: 1000
-
-rc_invites:
-    per_room:
-        per_second: 1000
-        burst_count: 1000
-    per_user:
-        per_second: 1000
-        burst_count: 1000
-
-rc_login:
-    address:
-        per_second: 10000
-        burst_count: 10000
-    account:
-        per_second: 10000
-        burst_count: 10000
-    failed_attempts:
-        per_second: 10000
-        burst_count: 10000
-
-media_store_path: "/data/media_store"
-uploads_path: "/data/uploads"
-allow_guest_access: true
-enable_registration: true
-enable_registration_without_verification: true
-disable_msisdn_registration: false
-registration_shared_secret: "{{REGISTRATION_SECRET}}"
-report_stats: false
-macaroon_secret_key: "{{MACAROON_SECRET_KEY}}"
-form_secret: "{{FORM_SECRET}}"
-signing_key_path: "/data/localhost.signing.key"
-
-trusted_key_servers:
-    - server_name: "matrix.org"
-suppress_key_server_warning: true
-
-ui_auth:
-    session_timeout: "300s"
-
-oidc_providers:
-    - idp_id: test
-      idp_name: "OAuth test"
-      issuer: "http://localhost:{{OAUTH_SERVER_PORT}}/oauth"
-      authorization_endpoint: "http://localhost:{{OAUTH_SERVER_PORT}}/oauth/auth.html"
-      # the token endpoint receives requests from synapse, rather than the webapp, so needs to escape the docker container.
-      token_endpoint: "http://host.containers.internal:{{OAUTH_SERVER_PORT}}/oauth/token"
-      userinfo_endpoint: "http://host.containers.internal:{{OAUTH_SERVER_PORT}}/oauth/userinfo"
-      client_id: "synapse"
-      discover: false
-      scopes: ["profile"]
-      skip_verification: true
-      client_auth_method: none
-      user_mapping_provider:
-          config:
-              display_name_template: "{{ user.name }}"
-
-# Inhibit background updates as this Synapse isn't long-lived
-background_updates:
-    min_batch_size: 100000
-    sleep_duration_ms: 100000
-
-experimental_features:
-    # Needed for e2e/crypto/crypto.spec.ts > Cryptography > decryption failure
-    # messages > non-joined historical messages.
-    # Can be removed after Synapse enables it by default
-    msc4115_membership_on_events: true

playwright/plugins/homeserver/synapse/templates/guest-enabled/log.config

@@ -1,50 +0,0 @@
-# Log configuration for Synapse.
-#
-# This is a YAML file containing a standard Python logging configuration
-# dictionary. See [1] for details on the valid settings.
-#
-# Synapse also supports structured logging for machine readable logs which can
-# be ingested by ELK stacks. See [2] for details.
-#
-# [1]: https://docs.python.org/3.7/library/logging.config.html#configuration-dictionary-schema
-# [2]: https://matrix-org.github.io/synapse/latest/structured_logging.html
-
-version: 1
-
-formatters:
-    precise:
-        format: '%(asctime)s - %(name)s - %(lineno)d - %(levelname)s - %(request)s - %(message)s'
-
-handlers:
-    # A handler that writes logs to stderr. Unused by default, but can be used
-    # instead of "buffer" and "file" in the logger handlers.
-    console:
-        class: logging.StreamHandler
-        formatter: precise
-
-loggers:
-    synapse.storage.SQL:
-        # beware: increasing this to DEBUG will make synapse log sensitive
-        # information such as access tokens.
-        level: INFO
-
-    twisted:
-        # We send the twisted logging directly to the file handler,
-        # to work around https://github.com/matrix-org/synapse/issues/3471
-        # when using "buffer" logger. Use "console" to log to stderr instead.
-        handlers: [console]
-        propagate: false
-
-root:
-    level: INFO
-
-    # Write logs to the `buffer` handler, which will buffer them together in memory,
-    # then write them to a file.
-    #
-    # Replace "buffer" with "console" to log to stderr instead. (Note that you'll
-    # also need to update the configuration for the `twisted` logger above, in
-    # this case.)
-    #
-    handlers: [console]
-
-disable_existing_loggers: false

playwright/plugins/homeserver/synapse/templates/mas-oidc/README.md

@@ -1 +0,0 @@
-A synapse configured with auth delegated to via matrix authentication service

playwright/plugins/homeserver/synapse/templates/mas-oidc/homeserver.yaml

@@ -1,96 +0,0 @@
-server_name: "localhost"
-pid_file: /data/homeserver.pid
-public_baseurl: "{{PUBLIC_BASEURL}}"
-listeners:
-    - port: 8008
-      tls: false
-      bind_addresses: ["::"]
-      type: http
-      x_forwarded: true
-
-      resources:
-          - names: [client]
-            compress: false
-
-database:
-    name: "sqlite3"
-    args:
-        database: ":memory:"
-
-log_config: "/data/log.config"
-
-rc_messages_per_second: 10000
-rc_message_burst_count: 10000
-rc_registration:
-    per_second: 10000
-    burst_count: 10000
-rc_joins:
-    local:
-        per_second: 9999
-        burst_count: 9999
-    remote:
-        per_second: 9999
-        burst_count: 9999
-rc_joins_per_room:
-    per_second: 9999
-    burst_count: 9999
-rc_3pid_validation:
-    per_second: 1000
-    burst_count: 1000
-
-rc_invites:
-    per_room:
-        per_second: 1000
-        burst_count: 1000
-    per_user:
-        per_second: 1000
-        burst_count: 1000
-
-rc_login:
-    address:
-        per_second: 10000
-        burst_count: 10000
-    account:
-        per_second: 10000
-        burst_count: 10000
-    failed_attempts:
-        per_second: 10000
-        burst_count: 10000
-
-media_store_path: "/data/media_store"
-uploads_path: "/data/uploads"
-registration_shared_secret: "{{REGISTRATION_SECRET}}"
-report_stats: false
-macaroon_secret_key: "{{MACAROON_SECRET_KEY}}"
-form_secret: "{{FORM_SECRET}}"
-signing_key_path: "/data/localhost.signing.key"
-
-trusted_key_servers:
-    - server_name: "matrix.org"
-suppress_key_server_warning: true
-
-ui_auth:
-    session_timeout: "300s"
-
-# Inhibit background updates as this Synapse isn't long-lived
-background_updates:
-    min_batch_size: 100000
-    sleep_duration_ms: 100000
-
-serve_server_wellknown: true
-experimental_features:
-    msc3861:
-        enabled: true
-
-        issuer: http://host.containers.internal:%MAS_PORT%/
-        introspection_endpoint: http://host.containers.internal:%MAS_PORT%/oauth2/introspect
-
-        # Matches the `client_id` in the auth service config
-        client_id: 0000000000000000000SYNAPSE
-        # Matches the `client_auth_method` in the auth service config
-        client_auth_method: client_secret_basic
-        # Matches the `client_secret` in the auth service config
-        client_secret: "SomeRandomSecret"
-
-        # Matches the `matrix.secret` in the auth service config
-        admin_token: "AnotherRandomSecret"

playwright/plugins/homeserver/synapse/templates/mas-oidc/log.config

@@ -1,50 +0,0 @@
-# Log configuration for Synapse.
-#
-# This is a YAML file containing a standard Python logging configuration
-# dictionary. See [1] for details on the valid settings.
-#
-# Synapse also supports structured logging for machine readable logs which can
-# be ingested by ELK stacks. See [2] for details.
-#
-# [1]: https://docs.python.org/3.7/library/logging.config.html#configuration-dictionary-schema
-# [2]: https://matrix-org.github.io/synapse/latest/structured_logging.html
-
-version: 1
-
-formatters:
-    precise:
-        format: '%(asctime)s - %(name)s - %(lineno)d - %(levelname)s - %(request)s - %(message)s'
-
-handlers:
-    # A handler that writes logs to stderr. Unused by default, but can be used
-    # instead of "buffer" and "file" in the logger handlers.
-    console:
-        class: logging.StreamHandler
-        formatter: precise
-
-loggers:
-    synapse.storage.SQL:
-        # beware: increasing this to DEBUG will make synapse log sensitive
-        # information such as access tokens.
-        level: DEBUG
-
-    twisted:
-        # We send the twisted logging directly to the file handler,
-        # to work around https://github.com/matrix-org/synapse/issues/3471
-        # when using "buffer" logger. Use "console" to log to stderr instead.
-        handlers: [console]
-        propagate: false
-
-root:
-    level: DEBUG
-
-    # Write logs to the `buffer` handler, which will buffer them together in memory,
-    # then write them to a file.
-    #
-    # Replace "buffer" with "console" to log to stderr instead. (Note that you'll
-    # also need to update the configuration for the `twisted` logger above, in
-    # this case.)
-    #
-    handlers: [console]
-
-disable_existing_loggers: false

playwright/plugins/homeserver/synapse/uiaLongSessionTimeoutHomeserver.ts

@@ -0,0 +1,24 @@
+/*
+Copyright 2024 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 { Fixtures } from "@playwright/test";
+
+import { Services } from "../../../services.ts";
+
+export const uiaLongSessionTimeoutHomeserver: Fixtures<{}, Services> = {
+    synapseConfigOptions: [
+        async ({ synapseConfigOptions }, use) => {
+            await use({
+                ...synapseConfigOptions,
+                ui_auth: {
+                    session_timeout: "300s",
+                },
+            });
+        },
+        { scope: "worker" },
+    ],
+};

playwright/plugins/mailhog/index.ts

@@ -1,47 +0,0 @@
-/*
-Copyright 2024 New Vector Ltd.
-Copyright 2023 The Matrix.org Foundation C.I.C.
-
-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 mailhog from "mailhog";
-
-import { getFreePort } from "../utils/port";
-import { Docker } from "../docker";
-
-export interface Instance {
-    host: string;
-    smtpPort: number;
-    httpPort: number;
-    containerId: string;
-}
-
-export class MailHogServer {
-    private readonly docker: Docker = new Docker();
-    private instance?: Instance;
-
-    async start(): Promise<{ api: mailhog.API; instance: Instance }> {
-        if (this.instance) throw new Error("Mailhog server is already running!");
-        const smtpPort = await getFreePort();
-        const httpPort = await getFreePort();
-        console.log(`Starting mailhog...`);
-        const containerId = await this.docker.run({
-            image: "mailhog/mailhog:latest",
-            containerName: `react-sdk-playwright-mailhog`,
-            params: ["-p", `${smtpPort}:1025/tcp`, "-p", `${httpPort}:8025/tcp`],
-        });
-        console.log(`Started mailhog on ports smtp=${smtpPort} http=${httpPort}.`);
-        const host = await this.docker.getContainerIp();
-        this.instance = { smtpPort, httpPort, containerId, host };
-        return { api: mailhog({ host: "localhost", port: httpPort }), instance: this.instance };
-    }
-
-    async stop(): Promise<void> {
-        if (!this.instance) throw new Error("Missing existing mailhog instance, did you call stop() before start()?");
-        await this.docker.stop();
-        console.log(`Stopped mailhog id ${this.instance.containerId}.`);
-        this.instance = undefined;
-    }
-}

playwright/plugins/matrix-authentication-service/config.yaml

@@ -1,156 +0,0 @@
-clients:
-    - client_id: 0000000000000000000SYNAPSE
-      client_auth_method: client_secret_basic
-      client_secret: "SomeRandomSecret"
-http:
-    listeners:
-        - name: web
-          resources:
-              - name: discovery
-              - name: human
-              - name: oauth
-              - name: compat
-              - name: graphql
-                playground: true
-              - name: assets
-                path: /usr/local/share/mas-cli/assets/
-          binds:
-              - address: "[::]:8080"
-          proxy_protocol: false
-        - name: internal
-          resources:
-              - name: health
-          binds:
-              - host: localhost
-                port: 8081
-          proxy_protocol: false
-    trusted_proxies:
-        - 192.128.0.0/16
-        - 172.16.0.0/12
-        - 10.0.0.0/10
-        - 127.0.0.1/8
-        - fd00::/8
-        - ::1/128
-    public_base: "http://localhost:{{MAS_PORT}}/"
-    issuer: http://localhost:{{MAS_PORT}}/
-database:
-    host: "{{POSTGRES_HOST}}"
-    port: 5432
-    database: postgres
-    username: postgres
-    password: "{{POSTGRES_PASSWORD}}"
-    max_connections: 10
-    min_connections: 0
-    connect_timeout: 30
-    idle_timeout: 600
-    max_lifetime: 1800
-telemetry:
-    tracing:
-        exporter: none
-        propagators: []
-    metrics:
-        exporter: none
-    sentry:
-        dsn: null
-templates:
-    path: /usr/local/share/mas-cli/templates/
-    assets_manifest: /usr/local/share/mas-cli/manifest.json
-    translations_path: /usr/local/share/mas-cli/translations/
-email:
-    from: '"Authentication Service" <root@localhost>'
-    reply_to: '"Authentication Service" <root@localhost>'
-    transport: smtp
-    mode: plain
-    hostname: "host.containers.internal"
-    port: %{{SMTP_PORT}}
-    username: username
-    password: password
-
-secrets:
-    encryption: 984b18e207c55ad5fbb2a49b217481a722917ee87b2308d4cf314c83fed8e3b5
-    keys:
-        - kid: YEAhzrKipJ
-          key: |
-              -----BEGIN RSA PRIVATE KEY-----
-              MIIEowIBAAKCAQEAuIV+AW5vx52I4CuumgSxp6yvKfIAnRdALeZZCoFkIGxUli1B
-              S79NJ3ls46oLh1pSD9RrhaMp6HTNoi4K3hnP9Q9v77pD7KwdFKG3UdG1zksIB0s/
-              +/Ey/DmX4LPluwBBS7r/LkQ1jk745lENA++oiDqZf2D/uP8jCHlvaSNyVKTqi1ki
-              OXPd4T4xBUjzuas9ze5jQVSYtfOidgnv1EzUipbIxgvH1jNt4raRlmP8mOq7xEnW
-              R+cF5x6n/g17PdSEfrwO4kz6aKGZuMP5lVlDEEnMHKabFSQDBl7+Mpok6jXutbtA
-              uiBnsKEahF9eoj4na4fpbRNPdIVyoaN5eGvm5wIDAQABAoIBAApyFCYEmHNWaa83
-              CdVSOrRhRDE9r+c0r79pcNT1ajOjrk4qFa4yEC4R46YntCtfY5Hd1pBkIjU0l4d8
-              z8Su9WTMEOwjQUEepS7L0NLi6kXZXYT8L40VpGs+32grBvBFHW0qEtQNrHJ36gMv
-              x2rXoFTF7HaXiSJx3wvVxAbRqOE9tBXLsmNHaWaAdWQG5o77V9+zvMri3cAeEg2w
-              VkKokb0dza7es7xG3tqS26k69SrwGeeuKo7qCHPH2cfyWmY5Yhv8iOoA59JzzbiK
-              UdxyzCHskrPSpRKVkVVwmY3RBt282TmSRG7td7e5ESSj50P2e5BI5uu1Hp/dvU4F
-              vYjV7kECgYEA6WqYoUpVsgQiqhvJwJIc/8gRm0mUy8TenI36z4Iim01Nt7fibWH7
-              XnsFqLGjXtYNVWvBcCrUl9doEnRbJeG2eRGbGKYAWVrOeFvwM4fYvw9GoOiJdDj4
-              cgWDe7eHbHE+UTqR7Nnr/UBfipoNWDh6X68HRBuXowh0Q6tOfxsrRFECgYEAyl/V
-              4b8bFp3pKZZCb+KPSYsQf793cRmrBexPcLWcDPYbMZQADEZ/VLjbrNrpTOWxUWJT
-              hr8MrWswnHO+l5AFu5CNO+QgV2dHLk+2w8qpdpFRPJCfXfo2D3wZ0c4cv3VCwv1V
-              5y7f6XWVjDWZYV4wj6c3shxZJjZ+9Hbhf3/twbcCgYA6fuRRR3fCbRbi2qPtBrEN
-              yO3gpMgNaQEA6vP4HPzfPrhDWmn8T5nXS61XYW03zxz4U1De81zj0K/cMBzHmZFJ
-              NghQXQmpWwBzWVcREvJWr1Vb7erEnaJlsMwKrSvbGWYspSj82oAxr3hCG+lMOpsw
-              b4S6pM+TpAK/EqdRY1WsgQKBgQCGoMaaTRXqL9bC0bEU2XVVCWxKb8c3uEmrwQ7/
-              /fD4NmjUzI5TnDps1CVfkqoNe+hAKddDFqmKXHqUOfOaxDbsFje+lf5l5tDVoDYH
-              fjTKKdYPIm7CiAeauYY7qpA5Vfq52Opixy4yEwUPp0CII67OggFtPaqY3zwJyWQt
-              +57hdQKBgGCXM/KKt7ceUDcNJxSGjvu0zD9D5Sv2ihYlEBT/JLaTCCJdvzREevaJ
-              1d+mpUAt0Lq6A8NWOMq8HPaxAik3rMQ0WtM5iG+XgsUqvTSb7NcshArDLuWGnW3m
-              MC4rM0UBYAS4QweduUSH1imrwH/1Gu5+PxbiecceRMMggWpzu0Bq
-              -----END RSA PRIVATE KEY-----
-        - kid: 8J1AxrlNZT
-          key: |
-              -----BEGIN EC PRIVATE KEY-----
-              MHcCAQEEIF1cjfIOEdy3BXJ72x6fKpEB8WP1ddZAUJAaqqr/6CpToAoGCCqGSM49
-              AwEHoUQDQgAEfHdNuI1Yeh3/uOq2PlnW2vymloOVpwBYebbw4VVsna9xhnutIdQW
-              dE8hkX8Yb0pIDasrDiwllVLzSvsWJAI0Kw==
-              -----END EC PRIVATE KEY-----
-        - kid: 3BW6un1EBi
-          key: |
-              -----BEGIN EC PRIVATE KEY-----
-              MIGkAgEBBDA+3ZV17r8TsiMdw1cpbTSNbyEd5SMy3VS1Mk/kz6O2Ev/3QZut8GE2
-              q3eGtLBoVQigBwYFK4EEACKhZANiAASs8Wxjk/uRimRKXnPr2/wDaXkN9wMDjYQK
-              mZULb+0ZP1/cXmuXuri8hUGhQvIU8KWY9PkpV+LMPEdpE54mHPKSLjq5CDXoSZ/P
-              9f7cdRaOZ000KQPZfIFR9ujJTtDN7Vs=
-              -----END EC PRIVATE KEY-----
-        - kid: pkZ0pTKK0X
-          key: |
-              -----BEGIN EC PRIVATE KEY-----
-              MHQCAQEEIHenfsXYPc5yzjZKUfvmydDR1YRwdsfZYvwHf/2wsYxooAcGBSuBBAAK
-              oUQDQgAEON1x7Vlu+nA0KvC5vYSOHhDUkfLYNZwYSLPFVT02h9E13yFFMIJegIBl
-              Aer+6PMZpPc8ycyeH9N+U9NAyliBhQ==
-              -----END EC PRIVATE KEY-----
-passwords:
-    enabled: true
-    schemes:
-        - version: 1
-          algorithm: argon2id
-    minimum_complexity: 0
-matrix:
-    homeserver: localhost
-    secret: AnotherRandomSecret
-    endpoint: "{{SYNAPSE_URL}}"
-policy:
-    wasm_module: /usr/local/share/mas-cli/policy.wasm
-    client_registration_entrypoint: client_registration/violation
-    register_entrypoint: register/violation
-    authorization_grant_entrypoint: authorization_grant/violation
-    password_entrypoint: password/violation
-    email_entrypoint: email/violation
-    data:
-        client_registration:
-            allow_insecure_uris: true # allow non-SSL and localhost URIs
-            allow_missing_contacts: true # EW doesn't have contacts at this time
-upstream_oauth2:
-    providers: []
-branding:
-    service_name: null
-    policy_uri: null
-    tos_uri: null
-    imprint: null
-    logo_uri: null
-account:
-    password_registration_enabled: true
-experimental:
-    access_token_ttl: 300
-    compat_token_ttl: 300

playwright/plugins/matrix-authentication-service/index.ts

@@ -1,145 +0,0 @@
-/*
-Copyright 2024 New Vector Ltd.
-Copyright 2023 The Matrix.org Foundation C.I.C.
-
-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 path, { basename } from "node:path";
-import os from "node:os";
-import * as fse from "fs-extra";
-import { BrowserContext, TestInfo } from "@playwright/test";
-
-import { getFreePort } from "../utils/port";
-import { Docker } from "../docker";
-import { PG_PASSWORD, PostgresDocker } from "../postgres";
-import { HomeserverInstance } from "../homeserver";
-import { Instance as MailhogInstance } from "../mailhog";
-
-// Docker tag to use for `ghcr.io/matrix-org/matrix-authentication-service` image.
-const TAG = "0.12.0";
-
-interface Instance {
-    containerId: string;
-    postgresId: string;
-    configDir: string;
-    port: number;
-}
-
-async function cfgDirFromTemplate(opts: {
-    postgresHost: string;
-    synapseUrl: string;
-    masPort: string;
-    smtpPort: string;
-}): Promise<{
-    configDir: string;
-}> {
-    const configPath = path.join(__dirname, "config.yaml");
-    const tempDir = await fse.mkdtemp(path.join(os.tmpdir(), "react-sdk-mas-"));
-
-    const outputHomeserver = path.join(tempDir, "config.yaml");
-    console.log(`Gen ${configPath} -> ${outputHomeserver}`);
-    let config = await fse.readFile(configPath, "utf8");
-    config = config.replace(/{{MAS_PORT}}/g, opts.masPort);
-    config = config.replace(/{{POSTGRES_HOST}}/g, opts.postgresHost);
-    config = config.replace(/{{POSTGRES_PASSWORD}}/g, PG_PASSWORD);
-    config = config.replace(/%{{SMTP_PORT}}/g, opts.smtpPort);
-    config = config.replace(/{{SYNAPSE_URL}}/g, opts.synapseUrl);
-
-    await fse.writeFile(outputHomeserver, config);
-
-    // Allow anyone to read, write and execute in the temp directory
-    // so that the DIND setup that we use to update the playwright screenshots work without any issues.
-    await fse.chmod(tempDir, 0o757);
-
-    return {
-        configDir: tempDir,
-    };
-}
-
-export class MatrixAuthenticationService {
-    private readonly masDocker = new Docker();
-    private readonly postgresDocker = new PostgresDocker("mas");
-    private instance: Instance;
-    public port: number;
-
-    constructor(private context: BrowserContext) {}
-
-    async prepare(): Promise<{ port: number }> {
-        this.port = await getFreePort();
-        return { port: this.port };
-    }
-
-    async start(homeserver: HomeserverInstance, mailhog: MailhogInstance): Promise<Instance> {
-        console.log(new Date(), "Starting mas...");
-
-        if (!this.port) await this.prepare();
-        const port = this.port;
-        const { containerId: postgresId, ipAddress: postgresIp } = await this.postgresDocker.start();
-        const { configDir } = await cfgDirFromTemplate({
-            masPort: port.toString(),
-            postgresHost: postgresIp,
-            synapseUrl: homeserver.config.dockerUrl,
-            smtpPort: mailhog.smtpPort.toString(),
-        });
-
-        console.log(new Date(), "starting mas container...", TAG);
-        const containerId = await this.masDocker.run({
-            image: "ghcr.io/element-hq/matrix-authentication-service:" + TAG,
-            containerName: "react-sdk-playwright-mas",
-            params: ["-p", `${port}:8080/tcp`, "-v", `${configDir}:/config`],
-            cmd: ["server", "--config", "/config/config.yaml"],
-        });
-        console.log(new Date(), "started!");
-
-        // Set up redirects
-        const baseUrl = `http://localhost:${port}`;
-        for (const path of [
-            "**/_matrix/client/*/login",
-            "**/_matrix/client/*/login/**",
-            "**/_matrix/client/*/logout",
-            "**/_matrix/client/*/refresh",
-        ]) {
-            await this.context.route(path, async (route) => {
-                await route.continue({
-                    url: new URL(route.request().url().split("/").slice(3).join("/"), baseUrl).href,
-                });
-            });
-        }
-
-        this.instance = { containerId, postgresId, port, configDir };
-        return this.instance;
-    }
-
-    async stop(testInfo: TestInfo): Promise<void> {
-        if (!this.instance) return; // nothing to stop
-        const id = this.instance.containerId;
-        const logPath = path.join("playwright", "logs", "matrix-authentication-service", id);
-        await fse.ensureDir(logPath);
-        await this.masDocker.persistLogsToFile({
-            stdoutFile: path.join(logPath, "stdout.log"),
-            stderrFile: path.join(logPath, "stderr.log"),
-        });
-
-        await this.masDocker.stop();
-        await this.postgresDocker.stop();
-
-        if (testInfo.status !== "passed") {
-            const logs = [path.join(logPath, "stdout.log"), path.join(logPath, "stderr.log")];
-            for (const path of logs) {
-                await testInfo.attach(`mas-${basename(path)}`, {
-                    path,
-                    contentType: "text/plain",
-                });
-            }
-            await testInfo.attach("mas-config.yaml", {
-                path: path.join(this.instance.configDir, "config.yaml"),
-                contentType: "text/plain",
-            });
-        }
-
-        await fse.remove(this.instance.configDir);
-        console.log(new Date(), "Stopped mas.");
-    }
-}

playwright/plugins/postgres/index.ts

@@ -1,66 +0,0 @@
-/*
-Copyright 2024 New Vector Ltd.
-Copyright 2023 The Matrix.org Foundation C.I.C.
-
-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 { Docker } from "../docker";
-
-export const PG_PASSWORD = "p4S5w0rD";
-
-/**
- * Class to manage a postgres database in docker
- */
-export class PostgresDocker extends Docker {
-    /**
-     * @param key an opaque string to use when naming the docker containers instantiated by this class
-     */
-    public constructor(private key: string) {
-        super();
-    }
-
-    private async waitForPostgresReady(ipAddress: string): Promise<void> {
-        const waitTimeMillis = 30000;
-        const startTime = new Date().getTime();
-        let lastErr: Error | null = null;
-        while (new Date().getTime() - startTime < waitTimeMillis) {
-            try {
-                // Note that we specify the IP address rather than letting it connect to the local
-                // socket: that's the listener we care about and empirically it matters.
-                await this.exec(["pg_isready", "-h", ipAddress, "-U", "postgres"], true);
-                lastErr = null;
-                break;
-            } catch (err) {
-                console.log("pg_isready: failed");
-                lastErr = err;
-            }
-        }
-        if (lastErr) {
-            console.log("rethrowing");
-            throw lastErr;
-        }
-    }
-
-    public async start(): Promise<{
-        ipAddress: string;
-        containerId: string;
-    }> {
-        console.log(new Date(), "starting postgres container");
-        const containerId = await this.run({
-            image: "postgres",
-            containerName: `react-sdk-playwright-postgres-${this.key}`,
-            params: ["--tmpfs=/pgtmpfs", "-e", "PGDATA=/pgtmpfs", "-e", `POSTGRES_PASSWORD=${PG_PASSWORD}`],
-            // Optimise for testing - https://www.postgresql.org/docs/current/non-durability.html
-            cmd: ["-c", `fsync=off`, "-c", `synchronous_commit=off`, "-c", `full_page_writes=off`],
-        });
-
-        const ipAddress = await this.getContainerIp();
-        console.log(new Date(), "postgres container up");
-
-        await this.waitForPostgresReady(ipAddress);
-        console.log(new Date(), "postgres container ready");
-        return { ipAddress, containerId };
-    }
-}

playwright/plugins/sliding-sync-proxy/index.ts

@@ -1,77 +0,0 @@
-/*
-Copyright 2024 New Vector Ltd.
-Copyright 2023 The Matrix.org Foundation C.I.C.
-
-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 type { BrowserContext, Route } from "@playwright/test";
-import { getFreePort } from "../utils/port";
-import { Docker } from "../docker";
-import { PG_PASSWORD, PostgresDocker } from "../postgres";
-
-// Docker tag to use for `ghcr.io/matrix-org/sliding-sync` image.
-const SLIDING_SYNC_PROXY_TAG = "v0.99.3";
-
-export interface ProxyInstance {
-    containerId: string;
-    postgresId: string;
-    port: number;
-}
-
-export class SlidingSyncProxy {
-    private readonly proxyDocker = new Docker();
-    private readonly postgresDocker = new PostgresDocker("sliding-sync");
-    private instance: ProxyInstance;
-
-    constructor(
-        private synapseIp: string,
-        private context: BrowserContext,
-    ) {}
-
-    private syncHandler = async (route: Route) => {
-        if (!this.instance) return route.abort("blockedbyclient");
-
-        const baseUrl = `http://localhost:${this.instance.port}`;
-        await route.continue({
-            url: new URL(route.request().url().split("/").slice(3).join("/"), baseUrl).href,
-        });
-    };
-
-    async start(): Promise<ProxyInstance> {
-        console.log(new Date(), "Starting sliding sync proxy...");
-
-        const { ipAddress: postgresIp, containerId: postgresId } = await this.postgresDocker.start();
-
-        const port = await getFreePort();
-        console.log(new Date(), "starting proxy container...", SLIDING_SYNC_PROXY_TAG);
-        const containerId = await this.proxyDocker.run({
-            image: "ghcr.io/matrix-org/sliding-sync:" + SLIDING_SYNC_PROXY_TAG,
-            containerName: "react-sdk-playwright-sliding-sync-proxy",
-            params: [
-                "-p",
-                `${port}:8008/tcp`,
-                "-e",
-                "SYNCV3_SECRET=bwahahaha",
-                "-e",
-                `SYNCV3_SERVER=${this.synapseIp}`,
-                "-e",
-                `SYNCV3_DB=user=postgres dbname=postgres password=${PG_PASSWORD} host=${postgresIp} sslmode=disable`,
-            ],
-        });
-        console.log(new Date(), "started!");
-
-        this.instance = { containerId, postgresId, port };
-        await this.context.route("**/_matrix/client/unstable/org.matrix.msc3575/sync*", this.syncHandler);
-        return this.instance;
-    }
-
-    async stop(): Promise<void> {
-        await this.context.unroute("**/_matrix/client/unstable/org.matrix.msc3575/sync*", this.syncHandler);
-
-        await this.postgresDocker.stop();
-        await this.proxyDocker.stop();
-        console.log(new Date(), "Stopped sliding sync proxy.");
-    }
-}

playwright/plugins/utils/object.ts

@@ -0,0 +1,16 @@
+/*
+Copyright 2024 New Vector Ltd.
+
+SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
+Please see LICENSE files in the repository root for full details.
+*/
+
+/**
+ * Deep copy the given object. The object MUST NOT have circular references and
+ * MUST NOT have functions.
+ * @param obj - The object to deep copy.
+ * @returns A copy of the object without any references to the original.
+ */
+export function deepCopy<T>(obj: T): T {
+    return JSON.parse(JSON.stringify(obj));
+}

playwright/services.ts

@@ -0,0 +1,140 @@
+/*
+Copyright 2024 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 { test as base } from "@playwright/test";
+import mailhog from "mailhog";
+import { GenericContainer, Network, StartedNetwork, StartedTestContainer, Wait } from "testcontainers";
+import { PostgreSqlContainer, StartedPostgreSqlContainer } from "@testcontainers/postgresql";
+
+import { SynapseConfigOptions, SynapseContainer } from "./testcontainers/synapse.ts";
+import { ContainerLogger } from "./testcontainers/utils.ts";
+import { StartedMatrixAuthenticationServiceContainer } from "./testcontainers/mas.ts";
+import { HomeserverContainer, StartedHomeserverContainer } from "./testcontainers/HomeserverContainer.ts";
+
+export interface Services {
+    logger: ContainerLogger;
+
+    network: StartedNetwork;
+    postgres: StartedPostgreSqlContainer;
+
+    mailhog: StartedTestContainer;
+    mailhogClient: mailhog.API;
+
+    synapseConfigOptions: SynapseConfigOptions;
+    _homeserver: HomeserverContainer<any>;
+    homeserver: StartedHomeserverContainer;
+    mas?: StartedMatrixAuthenticationServiceContainer;
+}
+
+export const test = base.extend<{}, Services>({
+    logger: [
+        // eslint-disable-next-line no-empty-pattern
+        async ({}, use) => {
+            const logger = new ContainerLogger();
+            await use(logger);
+        },
+        { scope: "worker" },
+    ],
+    network: [
+        // eslint-disable-next-line no-empty-pattern
+        async ({}, use) => {
+            const network = await new Network().start();
+            await use(network);
+            await network.stop();
+        },
+        { scope: "worker" },
+    ],
+    postgres: [
+        async ({ logger, network }, use) => {
+            const container = await new PostgreSqlContainer("postgres:13.3-alpine")
+                .withNetwork(network)
+                .withNetworkAliases("postgres")
+                .withLogConsumer(logger.getConsumer("postgres"))
+                .withTmpFs({
+                    "/dev/shm/pgdata/data": "",
+                })
+                .withEnvironment({
+                    PG_DATA: "/dev/shm/pgdata/data",
+                })
+                .withCommand([
+                    "-c",
+                    "shared_buffers=128MB",
+                    "-c",
+                    `fsync=off`,
+                    "-c",
+                    `synchronous_commit=off`,
+                    "-c",
+                    "full_page_writes=off",
+                ])
+                .start();
+            await use(container);
+            await container.stop();
+        },
+        { scope: "worker" },
+    ],
+
+    mailhog: [
+        async ({ logger, network }, use) => {
+            const container = await new GenericContainer("mailhog/mailhog:latest")
+                .withNetwork(network)
+                .withNetworkAliases("mailhog")
+                .withExposedPorts(8025)
+                .withLogConsumer(logger.getConsumer("mailhog"))
+                .withWaitStrategy(Wait.forListeningPorts())
+                .start();
+            await use(container);
+            await container.stop();
+        },
+        { scope: "worker" },
+    ],
+    mailhogClient: [
+        async ({ mailhog: container }, use) => {
+            await use(mailhog({ host: container.getHost(), port: container.getMappedPort(8025) }));
+        },
+        { scope: "worker" },
+    ],
+
+    synapseConfigOptions: [{}, { option: true, scope: "worker" }],
+    _homeserver: [
+        // eslint-disable-next-line no-empty-pattern
+        async ({}, use) => {
+            const container = new SynapseContainer();
+            await use(container);
+        },
+        { scope: "worker" },
+    ],
+    homeserver: [
+        async ({ logger, network, _homeserver: homeserver, synapseConfigOptions, mas }, use) => {
+            const container = await homeserver
+                .withNetwork(network)
+                .withNetworkAliases("homeserver")
+                .withLogConsumer(logger.getConsumer("synapse"))
+                .withConfig(synapseConfigOptions)
+                .start();
+
+            await use(container);
+            await container.stop();
+        },
+        { scope: "worker" },
+    ],
+    mas: [
+        // eslint-disable-next-line no-empty-pattern
+        async ({}, use) => {
+            // we stub the mas fixture to allow `homeserver` to depend on it to ensure
+            // when it is specified by `masHomeserver` it is started before the homeserver
+            await use(undefined);
+        },
+        { scope: "worker" },
+    ],
+
+    context: async ({ logger, context, request, homeserver }, use, testInfo) => {
+        homeserver.setRequest(request);
+        await logger.testStarted(testInfo);
+        await use(context);
+        await logger.testFinished(testInfo);
+    },
+});

playwright/stale-screenshot-reporter.ts

@@ -23,6 +23,7 @@ class StaleScreenshotReporter implements Reporter {
     private success = true;
 
     public onTestEnd(test: TestCase): void {
+        if (!test.ok()) return;
         for (const annotation of test.annotations) {
             if (annotation.type === "_screenshot") {
                 this.screenshots.add(annotation.description);

playwright/testcontainers/HomeserverContainer.ts

@@ -0,0 +1,22 @@
+/*
+Copyright 2024 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 { AbstractStartedContainer, GenericContainer } from "testcontainers";
+import { APIRequestContext } from "@playwright/test";
+
+import { StartedSynapseContainer } from "./synapse.ts";
+import { HomeserverInstance } from "../plugins/homeserver";
+
+export interface HomeserverContainer<Config> extends GenericContainer {
+    withConfigField(key: string, value: any): this;
+    withConfig(config: Partial<Config>): this;
+    start(): Promise<StartedSynapseContainer>;
+}
+
+export interface StartedHomeserverContainer extends AbstractStartedContainer, HomeserverInstance {
+    setRequest(request: APIRequestContext): void;
+}

playwright/testcontainers/dendrite.ts

@@ -0,0 +1,260 @@
+/*
+Copyright 2024 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 { GenericContainer, Wait } from "testcontainers";
+import * as YAML from "yaml";
+import { set } from "lodash";
+
+import { randB64Bytes } from "../plugins/utils/rand.ts";
+import { StartedSynapseContainer } from "./synapse.ts";
+import { deepCopy } from "../plugins/utils/object.ts";
+import { HomeserverContainer } from "./HomeserverContainer.ts";
+
+const DEFAULT_CONFIG = {
+    version: 2,
+    global: {
+        server_name: "localhost",
+        private_key: "matrix_key.pem",
+        old_private_keys: null,
+        key_validity_period: "168h0m0s",
+        cache: {
+            max_size_estimated: "1gb",
+            max_age: "1h",
+        },
+        well_known_server_name: "",
+        well_known_client_name: "",
+        trusted_third_party_id_servers: ["matrix.org", "vector.im"],
+        disable_federation: false,
+        presence: {
+            enable_inbound: false,
+            enable_outbound: false,
+        },
+        report_stats: {
+            enabled: false,
+            endpoint: "https://matrix.org/report-usage-stats/push",
+        },
+        server_notices: {
+            enabled: false,
+            local_part: "_server",
+            display_name: "Server Alerts",
+            avatar_url: "",
+            room_name: "Server Alerts",
+        },
+        jetstream: {
+            addresses: null,
+            disable_tls_validation: false,
+            storage_path: "./",
+            topic_prefix: "Dendrite",
+        },
+        metrics: {
+            enabled: false,
+            basic_auth: {
+                username: "metrics",
+                password: "metrics",
+            },
+        },
+        dns_cache: {
+            enabled: false,
+            cache_size: 256,
+            cache_lifetime: "5m",
+        },
+    },
+    app_service_api: {
+        disable_tls_validation: false,
+        config_files: null,
+    },
+    client_api: {
+        registration_disabled: false,
+        guests_disabled: true,
+        registration_shared_secret: "secret",
+        enable_registration_captcha: false,
+        recaptcha_public_key: "",
+        recaptcha_private_key: "",
+        recaptcha_bypass_secret: "",
+        turn: {
+            turn_user_lifetime: "5m",
+            turn_uris: null,
+            turn_shared_secret: "",
+        },
+        rate_limiting: {
+            enabled: true,
+            threshold: 20,
+            cooloff_ms: 500,
+            exempt_user_ids: null,
+        },
+    },
+    federation_api: {
+        send_max_retries: 16,
+        disable_tls_validation: false,
+        disable_http_keepalives: false,
+        key_perspectives: [
+            {
+                server_name: "matrix.org",
+                keys: [
+                    {
+                        key_id: "ed25519:auto",
+                        public_key: "Noi6WqcDj0QmPxCNQqgezwTlBKrfqehY1u2FyWP9uYw",
+                    },
+                    {
+                        key_id: "ed25519:a_RXGa",
+                        public_key: "l8Hft5qXKn1vfHrg3p4+W8gELQVo8N13JkluMfmn2sQ",
+                    },
+                ],
+            },
+        ],
+        prefer_direct_fetch: false,
+        database: {
+            connection_string: "file:dendrite-federationapi.db",
+        },
+    },
+    media_api: {
+        base_path: "./media_store",
+        max_file_size_bytes: 10485760,
+        dynamic_thumbnails: false,
+        max_thumbnail_generators: 10,
+        thumbnail_sizes: [
+            {
+                width: 32,
+                height: 32,
+                method: "crop",
+            },
+            {
+                width: 96,
+                height: 96,
+                method: "crop",
+            },
+            {
+                width: 640,
+                height: 480,
+                method: "scale",
+            },
+        ],
+        database: {
+            connection_string: "file:dendrite-mediaapi.db",
+        },
+    },
+    mscs: {
+        mscs: null,
+        database: {
+            connection_string: "file:dendrite-msc.db",
+        },
+    },
+    sync_api: {
+        search: {
+            enabled: false,
+            index_path: "./searchindex",
+            language: "en",
+        },
+        database: {
+            connection_string: "file:dendrite-syncapi.db",
+        },
+    },
+    user_api: {
+        bcrypt_cost: 10,
+        auto_join_rooms: null,
+        account_database: {
+            connection_string: "file:dendrite-userapi.db",
+        },
+    },
+    room_server: {
+        database: {
+            connection_string: "file:dendrite-roomserverapi.db",
+        },
+    },
+    key_server: {
+        database: {
+            connection_string: "file:dendrite-keyserverapi.db",
+        },
+    },
+    relay_api: {
+        database: {
+            connection_string: "file:dendrite-relayapi.db",
+        },
+    },
+    tracing: {
+        enabled: false,
+        jaeger: {
+            serviceName: "",
+            disabled: false,
+            rpc_metrics: false,
+            tags: [],
+            sampler: null,
+            reporter: null,
+            headers: null,
+            baggage_restrictions: null,
+            throttler: null,
+        },
+    },
+    logging: [
+        {
+            type: "std",
+            level: "debug",
+        },
+        {
+            type: "file",
+            level: "debug",
+            params: {
+                path: "./logs",
+            },
+        },
+    ],
+};
+
+export class DendriteContainer extends GenericContainer implements HomeserverContainer<typeof DEFAULT_CONFIG> {
+    private config: typeof DEFAULT_CONFIG;
+
+    constructor(image = "matrixdotorg/dendrite-monolith:main", binary = "/usr/bin/dendrite") {
+        super(image);
+
+        this.config = deepCopy(DEFAULT_CONFIG);
+        this.config.client_api.registration_shared_secret = randB64Bytes(16);
+
+        this.withEntrypoint(["/bin/sh"])
+            .withCommand([
+                "-c",
+                `/usr/bin/generate-keys -private-key /etc/dendrite/matrix_key.pem && ${binary} --config /etc/dendrite/dendrite.yaml --really-enable-open-registration true run`,
+            ])
+            .withExposedPorts(8008)
+            .withWaitStrategy(Wait.forHttp("/_matrix/client/versions", 8008));
+    }
+
+    public withConfigField(key: string, value: any): this {
+        set(this.config, key, value);
+        return this;
+    }
+
+    public withConfig(config: Partial<typeof DEFAULT_CONFIG>): this {
+        this.config = {
+            ...this.config,
+            ...config,
+        };
+        return this;
+    }
+
+    public override async start(): Promise<StartedSynapseContainer> {
+        this.withCopyContentToContainer([
+            {
+                target: "/etc/dendrite/dendrite.yaml",
+                content: YAML.stringify(this.config),
+            },
+        ]);
+
+        const container = await super.start();
+        // Surprisingly, Dendrite implements the same register user Admin API Synapse, so we can just extend it
+        return new StartedSynapseContainer(
+            container,
+            `http://${container.getHost()}:${container.getMappedPort(8008)}`,
+            this.config.client_api.registration_shared_secret,
+        );
+    }
+}
+
+export class PineconeContainer extends DendriteContainer {
+    constructor() {
+        super("matrixdotorg/dendrite-demo-pinecone:main", "/usr/bin/dendrite-demo-pinecone");
+    }
+}

playwright/testcontainers/mas.ts

@@ -0,0 +1,224 @@
+/*
+Copyright 2024 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 { AbstractStartedContainer, GenericContainer, StartedTestContainer, Wait } from "testcontainers";
+import { StartedPostgreSqlContainer } from "@testcontainers/postgresql";
+import * as YAML from "yaml";
+
+import { getFreePort } from "../plugins/utils/port.ts";
+import { deepCopy } from "../plugins/utils/object.ts";
+
+const DEFAULT_CONFIG = {
+    http: {
+        listeners: [
+            {
+                name: "web",
+                resources: [
+                    {
+                        name: "discovery",
+                    },
+                    {
+                        name: "human",
+                    },
+                    {
+                        name: "oauth",
+                    },
+                    {
+                        name: "compat",
+                    },
+                    {
+                        name: "graphql",
+                        playground: true,
+                    },
+                    {
+                        name: "assets",
+                        path: "/usr/local/share/mas-cli/assets/",
+                    },
+                ],
+                binds: [
+                    {
+                        address: "[::]:8080",
+                    },
+                ],
+                proxy_protocol: false,
+            },
+            {
+                name: "internal",
+                resources: [
+                    {
+                        name: "health",
+                    },
+                ],
+                binds: [
+                    {
+                        address: "[::]:8081",
+                    },
+                ],
+                proxy_protocol: false,
+            },
+        ],
+        trusted_proxies: ["192.128.0.0/16", "172.16.0.0/12", "10.0.0.0/10", "127.0.0.1/8", "fd00::/8", "::1/128"],
+        public_base: "", // Needs to be set
+        issuer: "", // Needs to be set
+    },
+    database: {
+        host: "postgres",
+        port: 5432,
+        database: "postgres",
+        username: "postgres",
+        password: "p4S5w0rD",
+        max_connections: 10,
+        min_connections: 0,
+        connect_timeout: 30,
+        idle_timeout: 600,
+        max_lifetime: 1800,
+    },
+    telemetry: {
+        tracing: {
+            exporter: "none",
+            propagators: [],
+        },
+        metrics: {
+            exporter: "none",
+        },
+        sentry: {
+            dsn: null,
+        },
+    },
+    templates: {
+        path: "/usr/local/share/mas-cli/templates/",
+        assets_manifest: "/usr/local/share/mas-cli/manifest.json",
+        translations_path: "/usr/local/share/mas-cli/translations/",
+    },
+    email: {
+        from: '"Authentication Service" <root@localhost>',
+        reply_to: '"Authentication Service" <root@localhost>',
+        transport: "smtp",
+        mode: "plain",
+        hostname: "mailhog",
+        port: 1025,
+        username: "username",
+        password: "password",
+    },
+    secrets: {
+        encryption: "984b18e207c55ad5fbb2a49b217481a722917ee87b2308d4cf314c83fed8e3b5",
+        keys: [
+            {
+                kid: "YEAhzrKipJ",
+                key: "-----BEGIN RSA PRIVATE KEY-----\nMIIEowIBAAKCAQEAuIV+AW5vx52I4CuumgSxp6yvKfIAnRdALeZZCoFkIGxUli1B\nS79NJ3ls46oLh1pSD9RrhaMp6HTNoi4K3hnP9Q9v77pD7KwdFKG3UdG1zksIB0s/\n+/Ey/DmX4LPluwBBS7r/LkQ1jk745lENA++oiDqZf2D/uP8jCHlvaSNyVKTqi1ki\nOXPd4T4xBUjzuas9ze5jQVSYtfOidgnv1EzUipbIxgvH1jNt4raRlmP8mOq7xEnW\nR+cF5x6n/g17PdSEfrwO4kz6aKGZuMP5lVlDEEnMHKabFSQDBl7+Mpok6jXutbtA\nuiBnsKEahF9eoj4na4fpbRNPdIVyoaN5eGvm5wIDAQABAoIBAApyFCYEmHNWaa83\nCdVSOrRhRDE9r+c0r79pcNT1ajOjrk4qFa4yEC4R46YntCtfY5Hd1pBkIjU0l4d8\nz8Su9WTMEOwjQUEepS7L0NLi6kXZXYT8L40VpGs+32grBvBFHW0qEtQNrHJ36gMv\nx2rXoFTF7HaXiSJx3wvVxAbRqOE9tBXLsmNHaWaAdWQG5o77V9+zvMri3cAeEg2w\nVkKokb0dza7es7xG3tqS26k69SrwGeeuKo7qCHPH2cfyWmY5Yhv8iOoA59JzzbiK\nUdxyzCHskrPSpRKVkVVwmY3RBt282TmSRG7td7e5ESSj50P2e5BI5uu1Hp/dvU4F\nvYjV7kECgYEA6WqYoUpVsgQiqhvJwJIc/8gRm0mUy8TenI36z4Iim01Nt7fibWH7\nXnsFqLGjXtYNVWvBcCrUl9doEnRbJeG2eRGbGKYAWVrOeFvwM4fYvw9GoOiJdDj4\ncgWDe7eHbHE+UTqR7Nnr/UBfipoNWDh6X68HRBuXowh0Q6tOfxsrRFECgYEAyl/V\n4b8bFp3pKZZCb+KPSYsQf793cRmrBexPcLWcDPYbMZQADEZ/VLjbrNrpTOWxUWJT\nhr8MrWswnHO+l5AFu5CNO+QgV2dHLk+2w8qpdpFRPJCfXfo2D3wZ0c4cv3VCwv1V\n5y7f6XWVjDWZYV4wj6c3shxZJjZ+9Hbhf3/twbcCgYA6fuRRR3fCbRbi2qPtBrEN\nyO3gpMgNaQEA6vP4HPzfPrhDWmn8T5nXS61XYW03zxz4U1De81zj0K/cMBzHmZFJ\nNghQXQmpWwBzWVcREvJWr1Vb7erEnaJlsMwKrSvbGWYspSj82oAxr3hCG+lMOpsw\nb4S6pM+TpAK/EqdRY1WsgQKBgQCGoMaaTRXqL9bC0bEU2XVVCWxKb8c3uEmrwQ7/\n/fD4NmjUzI5TnDps1CVfkqoNe+hAKddDFqmKXHqUOfOaxDbsFje+lf5l5tDVoDYH\nfjTKKdYPIm7CiAeauYY7qpA5Vfq52Opixy4yEwUPp0CII67OggFtPaqY3zwJyWQt\n+57hdQKBgGCXM/KKt7ceUDcNJxSGjvu0zD9D5Sv2ihYlEBT/JLaTCCJdvzREevaJ\n1d+mpUAt0Lq6A8NWOMq8HPaxAik3rMQ0WtM5iG+XgsUqvTSb7NcshArDLuWGnW3m\nMC4rM0UBYAS4QweduUSH1imrwH/1Gu5+PxbiecceRMMggWpzu0Bq\n-----END RSA PRIVATE KEY-----\n",
+            },
+            {
+                kid: "8J1AxrlNZT",
+                key: "-----BEGIN EC PRIVATE KEY-----\nMHcCAQEEIF1cjfIOEdy3BXJ72x6fKpEB8WP1ddZAUJAaqqr/6CpToAoGCCqGSM49\nAwEHoUQDQgAEfHdNuI1Yeh3/uOq2PlnW2vymloOVpwBYebbw4VVsna9xhnutIdQW\ndE8hkX8Yb0pIDasrDiwllVLzSvsWJAI0Kw==\n-----END EC PRIVATE KEY-----\n",
+            },
+            {
+                kid: "3BW6un1EBi",
+                key: "-----BEGIN EC PRIVATE KEY-----\nMIGkAgEBBDA+3ZV17r8TsiMdw1cpbTSNbyEd5SMy3VS1Mk/kz6O2Ev/3QZut8GE2\nq3eGtLBoVQigBwYFK4EEACKhZANiAASs8Wxjk/uRimRKXnPr2/wDaXkN9wMDjYQK\nmZULb+0ZP1/cXmuXuri8hUGhQvIU8KWY9PkpV+LMPEdpE54mHPKSLjq5CDXoSZ/P\n9f7cdRaOZ000KQPZfIFR9ujJTtDN7Vs=\n-----END EC PRIVATE KEY-----\n",
+            },
+            {
+                kid: "pkZ0pTKK0X",
+                key: "-----BEGIN EC PRIVATE KEY-----\nMHQCAQEEIHenfsXYPc5yzjZKUfvmydDR1YRwdsfZYvwHf/2wsYxooAcGBSuBBAAK\noUQDQgAEON1x7Vlu+nA0KvC5vYSOHhDUkfLYNZwYSLPFVT02h9E13yFFMIJegIBl\nAer+6PMZpPc8ycyeH9N+U9NAyliBhQ==\n-----END EC PRIVATE KEY-----\n",
+            },
+        ],
+    },
+    passwords: {
+        enabled: true,
+        schemes: [
+            {
+                version: 1,
+                algorithm: "argon2id",
+            },
+        ],
+        minimum_complexity: 0,
+    },
+    policy: {
+        wasm_module: "/usr/local/share/mas-cli/policy.wasm",
+        client_registration_entrypoint: "client_registration/violation",
+        register_entrypoint: "register/violation",
+        authorization_grant_entrypoint: "authorization_grant/violation",
+        password_entrypoint: "password/violation",
+        email_entrypoint: "email/violation",
+        data: {
+            client_registration: {
+                // allow non-SSL and localhost URIs
+                allow_insecure_uris: true,
+                // EW doesn't have contacts at this time
+                allow_missing_contacts: true,
+            },
+        },
+    },
+    upstream_oauth2: {
+        providers: [],
+    },
+    branding: {
+        service_name: null,
+        policy_uri: null,
+        tos_uri: null,
+        imprint: null,
+        logo_uri: null,
+    },
+    account: {
+        password_registration_enabled: true,
+    },
+    experimental: {
+        access_token_ttl: 300,
+        compat_token_ttl: 300,
+    },
+};
+
+export class MatrixAuthenticationServiceContainer extends GenericContainer {
+    private config: typeof DEFAULT_CONFIG;
+
+    constructor(db: StartedPostgreSqlContainer) {
+        super("ghcr.io/element-hq/matrix-authentication-service:0.12.0");
+
+        this.config = deepCopy(DEFAULT_CONFIG);
+        this.config.database.username = db.getUsername();
+        this.config.database.password = db.getPassword();
+
+        this.withExposedPorts(8080, 8081)
+            .withWaitStrategy(Wait.forHttp("/health", 8081))
+            .withCommand(["server", "--config", "/config/config.yaml"]);
+    }
+
+    public withConfig(config: object): this {
+        this.config = {
+            ...this.config,
+            ...config,
+        };
+        return this;
+    }
+
+    public override async start(): Promise<StartedMatrixAuthenticationServiceContainer> {
+        // MAS config issuer needs to know what URL it'll be accessed from, so we have to map the port manually
+        const port = await getFreePort();
+
+        this.config.http.public_base = `http://localhost:${port}/`;
+        this.config.http.issuer = `http://localhost:${port}/`;
+
+        this.withExposedPorts({
+            container: 8080,
+            host: port,
+        }).withCopyContentToContainer([
+            {
+                target: "/config/config.yaml",
+                content: YAML.stringify(this.config),
+            },
+        ]);
+
+        return new StartedMatrixAuthenticationServiceContainer(await super.start(), `http://localhost:${port}`);
+    }
+}
+
+export class StartedMatrixAuthenticationServiceContainer extends AbstractStartedContainer {
+    constructor(
+        container: StartedTestContainer,
+        public readonly baseUrl: string,
+    ) {
+        super(container);
+    }
+}

playwright/testcontainers/synapse.ts

@@ -0,0 +1,338 @@
+/*
+Copyright 2024 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 { AbstractStartedContainer, GenericContainer, StartedTestContainer, Wait } from "testcontainers";
+import { APIRequestContext } from "@playwright/test";
+import crypto from "node:crypto";
+import * as YAML from "yaml";
+import { set } from "lodash";
+
+import { getFreePort } from "../plugins/utils/port.ts";
+import { randB64Bytes } from "../plugins/utils/rand.ts";
+import { Credentials } from "../plugins/homeserver";
+import { deepCopy } from "../plugins/utils/object.ts";
+import { HomeserverContainer, StartedHomeserverContainer } from "./HomeserverContainer.ts";
+
+const DEFAULT_CONFIG = {
+    server_name: "localhost",
+    public_baseurl: "", // set by start method
+    pid_file: "/homeserver.pid",
+    web_client: false,
+    soft_file_limit: 0,
+    // Needs to be configured to log to the console like a good docker process
+    log_config: "/data/log.config",
+    listeners: [
+        {
+            // Listener is always port 8008 (configured in the container)
+            port: 8008,
+            tls: false,
+            bind_addresses: ["::"],
+            type: "http",
+            x_forwarded: true,
+            resources: [
+                {
+                    names: ["client"],
+                    compress: false,
+                },
+            ],
+        },
+    ],
+    database: {
+        // An sqlite in-memory database is fast & automatically wipes each time
+        name: "sqlite3",
+        args: {
+            database: ":memory:",
+        },
+    },
+    rc_messages_per_second: 10000,
+    rc_message_burst_count: 10000,
+    rc_registration: {
+        per_second: 10000,
+        burst_count: 10000,
+    },
+    rc_joins: {
+        local: {
+            per_second: 9999,
+            burst_count: 9999,
+        },
+        remote: {
+            per_second: 9999,
+            burst_count: 9999,
+        },
+    },
+    rc_joins_per_room: {
+        per_second: 9999,
+        burst_count: 9999,
+    },
+    rc_3pid_validation: {
+        per_second: 1000,
+        burst_count: 1000,
+    },
+    rc_invites: {
+        per_room: {
+            per_second: 1000,
+            burst_count: 1000,
+        },
+        per_user: {
+            per_second: 1000,
+            burst_count: 1000,
+        },
+    },
+    rc_login: {
+        address: {
+            per_second: 10000,
+            burst_count: 10000,
+        },
+        account: {
+            per_second: 10000,
+            burst_count: 10000,
+        },
+        failed_attempts: {
+            per_second: 10000,
+            burst_count: 10000,
+        },
+    },
+    media_store_path: "/tmp/media_store",
+    max_upload_size: "50M",
+    max_image_pixels: "32M",
+    dynamic_thumbnails: false,
+    enable_registration: true,
+    enable_registration_without_verification: true,
+    disable_msisdn_registration: false,
+    registrations_require_3pid: [],
+    enable_metrics: false,
+    report_stats: false,
+    // These placeholders will be replaced with values generated at start
+    registration_shared_secret: "secret",
+    macaroon_secret_key: "secret",
+    form_secret: "secret",
+    // Signing key must be here: it will be generated to this file
+    signing_key_path: "/data/localhost.signing.key",
+    trusted_key_servers: [],
+    password_config: {
+        enabled: true,
+    },
+    ui_auth: {},
+    background_updates: {
+        // Inhibit background updates as this Synapse isn't long-lived
+        min_batch_size: 100000,
+        sleep_duration_ms: 100000,
+    },
+    enable_authenticated_media: true,
+    email: undefined,
+    user_consent: undefined,
+    server_notices: undefined,
+    allow_guest_access: false,
+    experimental_features: {},
+    oidc_providers: [],
+    serve_server_wellknown: true,
+    presence: {
+        enabled: true,
+        include_offline_users_on_sync: true,
+    },
+};
+
+export type SynapseConfigOptions = Partial<typeof DEFAULT_CONFIG>;
+
+export class SynapseContainer extends GenericContainer implements HomeserverContainer<typeof DEFAULT_CONFIG> {
+    private config: typeof DEFAULT_CONFIG;
+
+    constructor() {
+        super(
+            `ghcr.io/element-hq/synapse:develop@sha256:b69222d98abe9625d46f5d3cb01683d5dc173ae339215297138392cfeec935d9`,
+        );
+
+        this.config = deepCopy(DEFAULT_CONFIG);
+        this.config.registration_shared_secret = randB64Bytes(16);
+        this.config.macaroon_secret_key = randB64Bytes(16);
+        this.config.form_secret = randB64Bytes(16);
+
+        const signingKey = randB64Bytes(32);
+        this.withWaitStrategy(Wait.forHttp("/health", 8008)).withCopyContentToContainer([
+            { target: this.config.signing_key_path, content: `ed25519 x ${signingKey}` },
+            {
+                target: this.config.log_config,
+                content: YAML.stringify({
+                    version: 1,
+                    formatters: {
+                        precise: {
+                            format: "%(asctime)s - %(name)s - %(lineno)d - %(levelname)s - %(request)s - %(message)s",
+                        },
+                    },
+                    handlers: {
+                        console: {
+                            class: "logging.StreamHandler",
+                            formatter: "precise",
+                        },
+                    },
+                    loggers: {
+                        "synapse.storage.SQL": {
+                            level: "DEBUG",
+                        },
+                        "twisted": {
+                            handlers: ["console"],
+                            propagate: false,
+                        },
+                    },
+                    root: {
+                        level: "DEBUG",
+                        handlers: ["console"],
+                    },
+                    disable_existing_loggers: false,
+                }),
+            },
+        ]);
+    }
+
+    public withConfigField(key: string, value: any): this {
+        set(this.config, key, value);
+        return this;
+    }
+
+    public withConfig(config: Partial<typeof DEFAULT_CONFIG>): this {
+        this.config = {
+            ...this.config,
+            ...config,
+        };
+        return this;
+    }
+
+    public override async start(): Promise<StartedSynapseContainer> {
+        // Synapse config public_baseurl needs to know what URL it'll be accessed from, so we have to map the port manually
+        const port = await getFreePort();
+
+        this.withExposedPorts({
+            container: 8008,
+            host: port,
+        })
+            .withConfig({
+                public_baseurl: `http://localhost:${port}`,
+            })
+            .withCopyContentToContainer([
+                {
+                    target: "/data/homeserver.yaml",
+                    content: YAML.stringify(this.config),
+                },
+            ]);
+
+        return new StartedSynapseContainer(
+            await super.start(),
+            `http://localhost:${port}`,
+            this.config.registration_shared_secret,
+        );
+    }
+}
+
+export class StartedSynapseContainer extends AbstractStartedContainer implements StartedHomeserverContainer {
+    private adminToken?: string;
+    private request?: APIRequestContext;
+
+    constructor(
+        container: StartedTestContainer,
+        public readonly baseUrl: string,
+        private readonly registrationSharedSecret: string,
+    ) {
+        super(container);
+    }
+
+    public setRequest(request: APIRequestContext): void {
+        this.request = request;
+    }
+
+    private async registerUserInternal(
+        username: string,
+        password: string,
+        displayName?: string,
+        admin = false,
+    ): Promise<Credentials> {
+        const url = `${this.baseUrl}/_synapse/admin/v1/register`;
+        const { nonce } = await this.request.get(url).then((r) => r.json());
+        const mac = crypto
+            .createHmac("sha1", this.registrationSharedSecret)
+            .update(`${nonce}\0${username}\0${password}\0${admin ? "" : "not"}admin`)
+            .digest("hex");
+        const res = await this.request.post(url, {
+            data: {
+                nonce,
+                username,
+                password,
+                mac,
+                admin,
+                displayname: displayName,
+            },
+        });
+
+        if (!res.ok()) {
+            throw await res.json();
+        }
+
+        const data = await res.json();
+        return {
+            homeServer: data.home_server,
+            accessToken: data.access_token,
+            userId: data.user_id,
+            deviceId: data.device_id,
+            password,
+            displayName,
+            username,
+        };
+    }
+
+    public registerUser(username: string, password: string, displayName?: string): Promise<Credentials> {
+        return this.registerUserInternal(username, password, displayName, false);
+    }
+
+    public async loginUser(userId: string, password: string): Promise<Credentials> {
+        const url = `${this.baseUrl}/_matrix/client/v3/login`;
+        const res = await this.request.post(url, {
+            data: {
+                type: "m.login.password",
+                identifier: {
+                    type: "m.id.user",
+                    user: userId,
+                },
+                password: password,
+            },
+        });
+        const json = await res.json();
+
+        return {
+            password,
+            accessToken: json.access_token,
+            userId: json.user_id,
+            deviceId: json.device_id,
+            homeServer: json.home_server,
+            username: userId.slice(1).split(":")[0],
+        };
+    }
+
+    public async setThreepid(userId: string, medium: string, address: string): Promise<void> {
+        if (this.adminToken === undefined) {
+            const result = await this.registerUserInternal("admin", "totalyinsecureadminpassword", undefined, true);
+            this.adminToken = result.accessToken;
+        }
+
+        const url = `${this.baseUrl}/_synapse/admin/v2/users/${userId}`;
+        const res = await this.request.put(url, {
+            data: {
+                threepids: [
+                    {
+                        medium,
+                        address,
+                    },
+                ],
+            },
+            headers: {
+                Authorization: `Bearer ${this.adminToken}`,
+            },
+        });
+
+        if (!res.ok()) {
+            throw await res.json();
+        }
+    }
+}

playwright/testcontainers/utils.ts

@@ -0,0 +1,43 @@
+/*
+Copyright 2024 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 { TestInfo } from "@playwright/test";
+import { Readable } from "stream";
+import stripAnsi from "strip-ansi";
+
+export class ContainerLogger {
+    private logs: Record<string, string> = {};
+
+    public getConsumer(container: string) {
+        this.logs[container] = "";
+        return (stream: Readable) => {
+            stream.on("data", (chunk) => {
+                this.logs[container] += chunk.toString();
+            });
+            stream.on("err", (chunk) => {
+                this.logs[container] += "ERR " + chunk.toString();
+            });
+        };
+    }
+
+    public async testStarted(testInfo: TestInfo) {
+        for (const container in this.logs) {
+            this.logs[container] = "";
+        }
+    }
+
+    public async testFinished(testInfo: TestInfo) {
+        if (testInfo.status !== "passed") {
+            for (const container in this.logs) {
+                await testInfo.attach(container, {
+                    body: stripAnsi(this.logs[container]),
+                    contentType: "text/plain",
+                });
+            }
+        }
+    }
+}

res/css/_components.pcss

@@ -278,9 +278,9 @@
 @import "./views/rooms/_CallGuestLinkButton.pcss";
 @import "./views/rooms/_DecryptionFailureBar.pcss";
 @import "./views/rooms/_E2EIcon.pcss";
+@import "./views/rooms/_E2EIconView.pcss";
 @import "./views/rooms/_EditMessageComposer.pcss";
 @import "./views/rooms/_EmojiButton.pcss";
-@import "./views/rooms/_EntityTile.pcss";
 @import "./views/rooms/_EventBubbleTile.pcss";
 @import "./views/rooms/_EventPreview.pcss";
 @import "./views/rooms/_EventTile.pcss";
@@ -290,13 +290,17 @@
 @import "./views/rooms/_LinkPreviewGroup.pcss";
 @import "./views/rooms/_LinkPreviewWidget.pcss";
 @import "./views/rooms/_LiveContentSummary.pcss";
-@import "./views/rooms/_MemberList.pcss";
+@import "./views/rooms/_MemberListHeaderView.pcss";
+@import "./views/rooms/_MemberListView.pcss";
+@import "./views/rooms/_MemberTileView.pcss";
 @import "./views/rooms/_MessageComposer.pcss";
 @import "./views/rooms/_MessageComposerFormatBar.pcss";
 @import "./views/rooms/_NewRoomIntro.pcss";
 @import "./views/rooms/_NotificationBadge.pcss";
+@import "./views/rooms/_OverflowTile.pcss";
 @import "./views/rooms/_PinnedEventTile.pcss";
 @import "./views/rooms/_PinnedMessageBanner.pcss";
+@import "./views/rooms/_PresenceIconView.pcss";
 @import "./views/rooms/_PresenceLabel.pcss";
 @import "./views/rooms/_ReadReceiptGroup.pcss";
 @import "./views/rooms/_ReplyPreview.pcss";

res/css/views/messages/_DisambiguatedProfile.pcss

@@ -21,8 +21,29 @@ Please see LICENSE files in the repository root for full details.
     }
 
     .mx_DisambiguatedProfile_mxid {
-        margin-inline-start: 5px;
         color: $secondary-content;
         font-size: var(--cpd-font-size-body-sm);
+        margin-inline-start: 5px;
+    }
+}
+
+/** Disambiguated profile needs to have a different layout in the member tile */
+.mx_MemberTileView .mx_DisambiguatedProfile {
+    display: flex;
+    flex-direction: column;
+
+    .mx_DisambiguatedProfile_mxid {
+        margin-inline-start: 0;
+        font: var(--cpd-font-body-sm-regular);
+    }
+
+    span:not(.mx_DisambiguatedProfile_mxid) {
+        /**
+        In a member tile, this span element is a flex child and so
+        we need the following for text overflow to work.
+        **/
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
     }
 }

res/css/views/rooms/_E2EIconView.pcss

@@ -0,0 +1,20 @@
+/*
+Copyright 2024 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.
+*/
+
+.mx_E2EIconView {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.mx_E2EIconView_warning {
+    color: var(--cpd-color-icon-critical-primary);
+}
+
+.mx_E2EIconView_verified {
+    color: var(--cpd-color-icon-success-primary);
+}

res/css/views/rooms/_EntityTile.pcss

@@ -1,128 +0,0 @@
-/*
-Copyright 2024 New Vector Ltd.
-Copyright 2020 The Matrix.org Foundation C.I.C.
-Copyright 2015, 2016 OpenMarket 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.
-*/
-
-.mx_EntityTile {
-    display: flex;
-    align-items: center;
-    color: $primary-content;
-    cursor: pointer;
-
-    .mx_E2EIcon {
-        margin: 0;
-        position: absolute;
-        bottom: 2px;
-        right: 7px;
-    }
-}
-
-.mx_EntityTile:hover {
-    padding-right: 30px;
-    position: relative; /* to keep the chevron aligned */
-}
-
-.mx_EntityTile:hover::before {
-    content: "";
-    position: absolute;
-    top: calc(50% - 8px); /* center */
-    right: -8px;
-    mask: url("@vector-im/compound-design-tokens/icons/chevron-right.svg");
-    mask-repeat: no-repeat;
-    mask-position: center;
-    width: 16px;
-    height: 16px;
-    background-color: $header-panel-text-primary-color;
-}
-
-.mx_EntityTile:not(.mx_EntityTile_unreachable) .mx_PresenceLabel {
-    display: none;
-}
-
-.mx_EntityTile:hover .mx_PresenceLabel {
-    display: block;
-}
-
-.mx_EntityTile_invite {
-    display: table-cell;
-    vertical-align: middle;
-    margin-left: 10px;
-    width: 26px;
-}
-
-.mx_EntityTile_avatar {
-    padding-left: 3px;
-    padding-right: 12px;
-    padding-top: 4px;
-    padding-bottom: 4px;
-    position: relative;
-    line-height: 0;
-}
-
-.mx_EntityTile_name {
-    flex: 1 1 0;
-    overflow: hidden;
-    font: var(--cpd-font-body-md-regular);
-    text-overflow: ellipsis;
-    white-space: nowrap;
-}
-
-.mx_EntityTile_details {
-    overflow: hidden;
-    flex: 1;
-}
-
-.mx_EntityTile_ellipsis .mx_EntityTile_name {
-    font-style: italic;
-    color: $primary-content;
-}
-
-.mx_EntityTile_invitePlaceholder .mx_EntityTile_name {
-    font-style: italic;
-    color: $primary-content;
-}
-
-.mx_EntityTile_unavailable .mx_EntityTile_avatar,
-.mx_EntityTile_unavailable .mx_EntityTile_name,
-.mx_EntityTile_offline_beenactive .mx_EntityTile_avatar,
-.mx_EntityTile_offline_beenactive .mx_EntityTile_name {
-    opacity: 0.5;
-}
-
-.mx_EntityTile_offline_neveractive .mx_EntityTile_avatar,
-.mx_EntityTile_offline_neveractive .mx_EntityTile_name {
-    opacity: 0.25;
-}
-
-.mx_EntityTile_unknown .mx_EntityTile_avatar,
-.mx_EntityTile_unknown .mx_EntityTile_name,
-.mx_EntityTile_unreachable .mx_EntityTile_avatar,
-.mx_EntityTile_unreachable .mx_EntityTile_name {
-    opacity: 0.25;
-}
-
-.mx_EntityTile_subtext {
-    font-size: $font-11px;
-    opacity: 0.5;
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: clip;
-}
-
-.mx_EntityTile_power {
-    padding-inline-start: 6px;
-    font-size: $font-10px;
-    color: $secondary-content;
-    max-width: 6em;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-}
-
-.mx_EntityTile:hover .mx_EntityTile_power {
-    display: none;
-}

res/css/views/rooms/_MemberList.pcss

@@ -1,69 +0,0 @@
-/*
-Copyright 2024 New Vector Ltd.
-Copyright 2015, 2016 OpenMarket 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.
-*/
-
-.mx_MemberList {
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-    min-height: 0;
-
-    .mx_Spinner {
-        flex: 1 0 auto;
-    }
-
-    .mx_SearchBox {
-        margin-bottom: 5px;
-    }
-
-    h2 {
-        text-transform: uppercase;
-        color: $h3-color;
-        font-weight: var(--cpd-font-weight-semibold);
-        font-size: $font-13px;
-        padding-left: 3px;
-        padding-right: 12px;
-        margin-top: 8px;
-        margin-bottom: 4px;
-    }
-
-    .mx_AutoHideScrollbar {
-        flex: 1 1 0;
-        margin-top: var(--cpd-space-3x);
-    }
-}
-
-.mx_MemberList_chevron {
-    position: absolute;
-    right: 35px;
-    margin-top: -15px;
-}
-
-.mx_MemberList_border {
-    overflow-y: auto;
-
-    order: 1;
-    flex: 1 1 0px;
-}
-
-.mx_MemberList_query {
-    height: 16px;
-
-    /* stricter rule to override the one in _common.pcss */
-    &[type="text"] {
-        font-size: $font-12px;
-    }
-}
-
-.mx_MemberList_wrapper {
-    padding: 10px;
-}
-
-.mx_MemberList_invite {
-    margin: 0 var(--cpd-space-2x);
-    width: calc(100% - var(--cpd-space-4x));
-}

res/css/views/rooms/_MemberListHeaderView.pcss

@@ -0,0 +1,37 @@
+/*
+Copyright 2024 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.
+*/
+
+.mx_MemberListHeaderView {
+    border-bottom: var(--cpd-border-width-1) solid var(--cpd-color-gray-400);
+    max-height: 112px;
+
+    .mx_MemberListHeaderView_container {
+        margin-top: var(--cpd-space-6x);
+        width: 100%;
+    }
+
+    .mx_MemberListHeaderView_invite_small {
+        margin-left: var(--cpd-space-3x);
+    }
+
+    .mx_MemberListHeaderView_invite_large {
+        width: 288px;
+        height: 36px;
+    }
+
+    .mx_MemberListHeaderView_label {
+        padding: var(--cpd-space-6x) 0 var(--cpd-space-2x) var(--cpd-space-4x);
+        box-sizing: border-box;
+        width: 100%;
+        color: var(--cpd-color-text-secondary);
+        font: var(--cpd-font-body-sm-semibold);
+    }
+
+    .mx_MemberListHeaderView_search {
+        width: 240px;
+    }
+}

res/css/views/rooms/_MemberListView.pcss

@@ -0,0 +1,17 @@
+/*
+Copyright 2024 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.
+*/
+
+.mx_MemberListView {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    min-height: 0;
+
+    .mx_MemberListView_container {
+        height: 100%;
+    }
+}

res/css/views/rooms/_MemberTileView.pcss

@@ -0,0 +1,58 @@
+/*
+Copyright 2024 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.
+*/
+
+.mx_MemberTileView {
+    display: flex;
+    padding: var(--cpd-space-3x) var(--cpd-space-3x) var(--cpd-space-3x) var(--cpd-space-4x);
+    box-sizing: border-box;
+    height: 56px;
+    border-bottom: var(--cpd-border-width-1) solid var(--cpd-color-gray-300);
+
+    .mx_MemberTileView_left,
+    .mx_MemberTileView_right {
+        display: flex;
+        align-items: center;
+        gap: var(--cpd-space-2x);
+    }
+
+    .mx_MemberTileView_left {
+        flex-basis: 209px;
+        flex-grow: 1;
+        min-width: 0;
+    }
+
+    .mx_MemberTileView_name {
+        font: var(--cpd-font-body-md-medium);
+        font-size: 15px;
+        min-width: 0;
+    }
+
+    .mx_MemberTileView_user_label {
+        font: var(--cpd-font-body-sm-regular);
+        font-size: 13px;
+    }
+
+    .mx_MemberTileView_avatar {
+        position: relative;
+        height: 32px;
+        width: 32px;
+    }
+
+    .mx_E2EIconView {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+    }
+
+    .mx_E2EIconView_warning {
+        color: var(--cpd-color-icon-critical-primary);
+    }
+
+    .mx_E2EIconView_verified {
+        color: var(--cpd-color-icon-success-primary);
+    }
+}