@element-hq/element-web-playwright-common 3.0.0 → 3.1.0

package/lib/fixtures/toasts.d.ts

@@ -0,0 +1,64 @@
+import { type Locator, type Page } from "@playwright/test";
+export declare const test: import("playwright/test").TestType<import("playwright/test").PlaywrightTestArgs & import("playwright/test").PlaywrightTestOptions & {
+    axe: import("@axe-core/playwright").AxeBuilder;
+} & import("./services.js").TestFixtures & {
+    /**
+     * Convenience functions for handling toasts.
+     */
+    toasts: Toasts;
+}, import("playwright/test").PlaywrightWorkerArgs & import("playwright/test").PlaywrightWorkerOptions & import("./services.js").WorkerOptions & import("./services.js").Services>;
+declare class Toasts {
+    readonly page: Page;
+    constructor(page: Page);
+    /**
+     * Assert that no toasts exist
+     */
+    assertNoToasts(): Promise<void>;
+    /**
+     * Assert that a toast with the given title exists, and return it
+     *
+     * @param title - Expected title of the toast
+     * @param timeout - Time to retry the assertion for in milliseconds.
+     *                  Defaults to `timeout` in `TestConfig.expect`.
+     * @returns the Locator for the matching toast
+     */
+    getToast(title: string, timeout?: number): Promise<Locator>;
+    /**
+     * Find a toast with the given title, if it exists.
+     *
+     * @param title - Title of the toast.
+     * @returns the Locator for the matching toast, or an empty locator if it
+     *          doesn't exist.
+     */
+    getToastIfExists(title: string): Locator;
+    /**
+     * Accept a toast with the given title. Only works for the first toast in
+     * the stack.
+     *
+     * @param title - Expected title of the toast
+     */
+    acceptToast(title: string): Promise<void>;
+    /**
+     * Accept a toast with the given title, if it exists. Only works for the
+     * first toast in the stack.
+     *
+     * @param title - Title of the toast
+     */
+    acceptToastIfExists(title: string): Promise<void>;
+    /**
+     * Reject a toast with the given title. Only works for the first toast in
+     * the stack.
+     *
+     * @param title - Expected title of the toast
+     */
+    rejectToast(title: string): Promise<void>;
+    /**
+     * Reject a toast with the given title, if it exists. Only works for the
+     * first toast in the stack.
+     *
+     * @param title - Title of the toast
+     */
+    rejectToastIfExists(title: string): Promise<void>;
+}
+export {};
+//# sourceMappingURL=toasts.d.ts.map

package/lib/fixtures/toasts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"toasts.d.ts","sourceRoot":"","sources":["../../src/fixtures/toasts.ts"],"names":[],"mappings":"AAOA,OAAO,EAAU,KAAK,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAQnE,eAAO,MAAM,IAAI;;;IACb;;OAEG;YACK,MAAM;iLAMhB,CAAC;AAEH,cAAM,MAAM;aAC2B,IAAI,EAAE,IAAI;gBAAV,IAAI,EAAE,IAAI;IAE7C;;OAEG;IACU,cAAc,IAAI,OAAO,CAAC,IAAI,CAAC;IAI5C;;;;;;;OAOG;IACU,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC,OAAO,CAAC;IAMxE;;;;;;OAMG;IACI,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO;IAI/C;;;;;OAKG;IACU,WAAW,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IAItD;;;;;OAKG;IACU,mBAAmB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IAO9D;;;;;OAKG;IACU,WAAW,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IAKtD;;;;;OAKG;IACU,mBAAmB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;CAMjE"}

package/lib/fixtures/toasts.js

@@ -0,0 +1,97 @@
+/*
+ * Copyright 2026 Element Creations 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 { expect } from "@playwright/test";
+// We want to avoid using `mergeTests` in index.ts because it drops useful type
+// information about the fixtures. Instead, we add `services` into our fixture
+// suite by using its `test` as a base, so that there is a linear hierarchy.
+import { test as base } from "./services.js";
+// This fixture provides convenient handling of Element Web's toasts.
+export const test = base.extend({
+    toasts: async ({ page }, use) => {
+        const toasts = new Toasts(page);
+        await use(toasts);
+    },
+});
+class Toasts {
+    page;
+    constructor(page) {
+        this.page = page;
+    }
+    /**
+     * Assert that no toasts exist
+     */
+    async assertNoToasts() {
+        await expect(this.page.locator(".mx_Toast_toast")).not.toBeVisible();
+    }
+    /**
+     * Assert that a toast with the given title exists, and return it
+     *
+     * @param title - Expected title of the toast
+     * @param timeout - Time to retry the assertion for in milliseconds.
+     *                  Defaults to `timeout` in `TestConfig.expect`.
+     * @returns the Locator for the matching toast
+     */
+    async getToast(title, timeout) {
+        const toast = this.getToastIfExists(title);
+        await expect(toast).toBeVisible({ timeout });
+        return toast;
+    }
+    /**
+     * Find a toast with the given title, if it exists.
+     *
+     * @param title - Title of the toast.
+     * @returns the Locator for the matching toast, or an empty locator if it
+     *          doesn't exist.
+     */
+    getToastIfExists(title) {
+        return this.page.locator(".mx_Toast_toast", { hasText: title }).first();
+    }
+    /**
+     * Accept a toast with the given title. Only works for the first toast in
+     * the stack.
+     *
+     * @param title - Expected title of the toast
+     */
+    async acceptToast(title) {
+        const toast = await this.getToast(title);
+        await toast.locator('.mx_Toast_buttons button[data-kind="primary"]').click();
+    }
+    /**
+     * Accept a toast with the given title, if it exists. Only works for the
+     * first toast in the stack.
+     *
+     * @param title - Title of the toast
+     */
+    async acceptToastIfExists(title) {
+        const toast = this.getToastIfExists(title).locator('.mx_Toast_buttons button[data-kind="primary"]');
+        if ((await toast.count()) > 0) {
+            await toast.click();
+        }
+    }
+    /**
+     * Reject a toast with the given title. Only works for the first toast in
+     * the stack.
+     *
+     * @param title - Expected title of the toast
+     */
+    async rejectToast(title) {
+        const toast = await this.getToast(title);
+        await toast.locator('.mx_Toast_buttons button[data-kind="secondary"]').click();
+    }
+    /**
+     * Reject a toast with the given title, if it exists. Only works for the
+     * first toast in the stack.
+     *
+     * @param title - Title of the toast
+     */
+    async rejectToastIfExists(title) {
+        const toast = this.getToastIfExists(title).locator('.mx_Toast_buttons button[data-kind="secondary"]');
+        if ((await toast.count()) > 0) {
+            await toast.click();
+        }
+    }
+}

package/lib/fixtures/user.d.ts

@@ -5,6 +5,17 @@ export declare function populateLocalStorageWithCredentials(page: Page, credenti
 export declare const test: import("playwright/test").TestType<import("playwright/test").PlaywrightTestArgs & import("playwright/test").PlaywrightTestOptions & {
     axe: import("@axe-core/playwright").AxeBuilder;
 } & import("./services.js").TestFixtures & {
+    toasts: {
+        readonly page: Page;
+        assertNoToasts(): Promise<void>;
+        getToast(title: string, timeout?: number): Promise<import("playwright-core").Locator>;
+        getToastIfExists(title: string): import("playwright-core").Locator;
+        acceptToast(title: string): Promise<void>;
+        acceptToastIfExists(title: string): Promise<void>;
+        rejectToast(title: string): Promise<void>;
+        rejectToastIfExists(title: string): Promise<void>;
+    };
+} & {
     /**
      * The displayname to use for the user registered in {@link #credentials}.
      *

package/lib/fixtures/user.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"user.d.ts","sourceRoot":"","sources":["../../src/fixtures/user.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAI7C,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAEnD,0IAA0I;AAC1I,wBAAsB,mCAAmC,CAAC,IAAI,EAAE,IAAI,EAAE,WAAW,EAAE,WAAW,iBAuB7F;AAED,eAAO,MAAM,IAAI;;;IACb;;;;;OAKG;kBACW,MAAM;IAEpB;;;OAGG;iBACU,WAAW;IAExB;;;;;;OAMG;yBACkB,IAAI;IAEzB;;;;OAIG;UACG,WAAW;iLA+BnB,CAAC"}
+{"version":3,"file":"user.d.ts","sourceRoot":"","sources":["../../src/fixtures/user.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAO7C,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAEnD,0IAA0I;AAC1I,wBAAsB,mCAAmC,CAAC,IAAI,EAAE,IAAI,EAAE,WAAW,EAAE,WAAW,iBAuB7F;AAED,eAAO,MAAM,IAAI;;;;;;;;;;;;;;IACb;;;;;OAKG;kBACW,MAAM;IAEpB;;;OAGG;iBACU,WAAW;IAExB;;;;;;OAMG;yBACkB,IAAI;IAEzB;;;;OAIG;UACG,WAAW;iLA+BnB,CAAC"}

package/lib/fixtures/user.js

@@ -6,7 +6,10 @@ SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
 Please see LICENSE files in the repository root for full details.
 */
 import { sample, uniqueId } from "lodash-es";
-import { test as base } from "./services.js";
+// We want to avoid using `mergeTests` in index.ts because it drops useful type
+// information about the fixtures. Instead, we add `toasts` into our fixture
+// suite by using its `test` as a base, so that there is a linear hierarchy.
+import { test as base } from "./toasts.js";
 /** Adds an initScript to the given page which will populate localStorage appropriately so that Element will use the given credentials. */
 export async function populateLocalStorageWithCredentials(page, credentials) {
     await page.addInitScript(({ credentials }) => {

package/lib/index.d.ts

@@ -41,6 +41,17 @@ export interface TestFixtures {
 export declare const test: import("playwright/test").TestType<import("playwright/test").PlaywrightTestArgs & import("playwright/test").PlaywrightTestOptions & {
     axe: import("@axe-core/playwright").AxeBuilder;
 } & import("./fixtures/services.js").TestFixtures & {
+    toasts: {
+        readonly page: import("playwright-core").Page;
+        assertNoToasts(): Promise<void>;
+        getToast(title: string, timeout?: number): Promise<import("playwright-core").Locator>;
+        getToastIfExists(title: string): import("playwright-core").Locator;
+        acceptToast(title: string): Promise<void>;
+        acceptToastIfExists(title: string): Promise<void>;
+        rejectToast(title: string): Promise<void>;
+        rejectToastIfExists(title: string): Promise<void>;
+    };
+} & {
     displayName?: string;
     credentials: import("./utils/api.js").Credentials;
     pageWithCredentials: import("playwright-core").Page;

package/lib/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,KAAK,MAAM,IAAI,UAAU,EAAE,MAAM,oCAAoC,CAAC;AAK/E,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AAEnC,OAAO,EAAE,mCAAmC,EAAE,MAAM,oBAAoB,CAAC;AAQzE,MAAM,WAAW,MAAO,SAAQ,UAAU;IACtC,qBAAqB,EAAE;QACnB,cAAc,CAAC,EAAE;YACb,QAAQ,EAAE,MAAM,CAAC;YACjB,WAAW,CAAC,EAAE,MAAM,CAAC;SACxB,CAAC;QACF,mBAAmB,CAAC,EAAE;YAClB,QAAQ,EAAE,MAAM,CAAC;YACjB,WAAW,CAAC,EAAE,MAAM,CAAC;SACxB,CAAC;KACL,CAAC;IACF,yBAAyB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACpD,gBAAgB,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC1C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAClC,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;CACtB;AAGD,eAAO,MAAM,WAAW,EAAE,OAAO,CAAC,MAAM,CAevC,CAAC;AAEF,MAAM,WAAW,YAAY;IACzB;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC;IAEpC,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,eAAe,EAAE,OAAO,CAAC;IACzB;;;;;;;;OAQG;IACH,kBAAkB,EAAE,OAAO,CAAC;CAC/B;AAED,eAAO,MAAM,IAAI;;;;;;;kNAmBf,CAAC;AAEH,OAAO,EAAE,MAAM,EAAE,KAAK,wBAAwB,EAAE,MAAM,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,KAAK,MAAM,IAAI,UAAU,EAAE,MAAM,oCAAoC,CAAC;AAK/E,cAAc,wBAAwB,CAAC;AACvC,cAAc,oBAAoB,CAAC;AAEnC,OAAO,EAAE,mCAAmC,EAAE,MAAM,oBAAoB,CAAC;AAQzE,MAAM,WAAW,MAAO,SAAQ,UAAU;IACtC,qBAAqB,EAAE;QACnB,cAAc,CAAC,EAAE;YACb,QAAQ,EAAE,MAAM,CAAC;YACjB,WAAW,CAAC,EAAE,MAAM,CAAC;SACxB,CAAC;QACF,mBAAmB,CAAC,EAAE;YAClB,QAAQ,EAAE,MAAM,CAAC;YACjB,WAAW,CAAC,EAAE,MAAM,CAAC;SACxB,CAAC;KACL,CAAC;IACF,yBAAyB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACpD,gBAAgB,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC1C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAClC,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;CACtB;AAGD,eAAO,MAAM,WAAW,EAAE,OAAO,CAAC,MAAM,CAevC,CAAC;AAEF,MAAM,WAAW,YAAY;IACzB;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC;IAEpC,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,eAAe,EAAE,OAAO,CAAC;IACzB;;;;;;;;OAQG;IACH,kBAAkB,EAAE,OAAO,CAAC;CAC/B;AAED,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;kNAmBf,CAAC;AAEH,OAAO,EAAE,MAAM,EAAE,KAAK,wBAAwB,EAAE,MAAM,mBAAmB,CAAC"}

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@element-hq/element-web-playwright-common",
     "type": "module",
-    "version": "3.0.0",
+    "version": "3.1.0",
     "license": "SEE LICENSE IN README.md",
     "repository": {
         "type": "git",
@@ -19,10 +19,10 @@
     },
     "scripts": {
         "prepack": "nx build:playwright",
-        "lint:types": "tsc --noEmit"
+        "lint:types": "nx lint:types"
     },
     "devDependencies": {
-        "@element-hq/element-web-module-api": "*",
+        "@element-hq/element-web-module-api": "workspace:*",
         "@types/lodash-es": "^4.17.12",
         "typescript": "^5.8.2",
         "wait-on": "^9.0.4"

package/project.json

@@ -8,7 +8,13 @@
             "command": "tsc",
             "inputs": ["src"],
             "outputs": ["{projectRoot}/lib"],
-            "options": { "cwd": "packages/playwright-common" }
+            "options": { "cwd": "packages/playwright-common" },
+            "dependsOn": ["^build"]
+        },
+        "lint:types": {
+            "command": "pnpm exec tsc --noEmit",
+            "options": { "cwd": "packages/playwright-common" },
+            "dependsOn": ["^build"]
         },
         "docker:prebuild": {
             "cache": true,

package/src/fixtures/toasts.ts

@@ -0,0 +1,109 @@
+/*
+ * Copyright 2026 Element Creations 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 { expect, type Locator, type Page } from "@playwright/test";
+
+// We want to avoid using `mergeTests` in index.ts because it drops useful type
+// information about the fixtures. Instead, we add `services` into our fixture
+// suite by using its `test` as a base, so that there is a linear hierarchy.
+import { test as base } from "./services.js";
+
+// This fixture provides convenient handling of Element Web's toasts.
+export const test = base.extend<{
+    /**
+     * Convenience functions for handling toasts.
+     */
+    toasts: Toasts;
+}>({
+    toasts: async ({ page }, use) => {
+        const toasts = new Toasts(page);
+        await use(toasts);
+    },
+});
+
+class Toasts {
+    public constructor(public readonly page: Page) {}
+
+    /**
+     * Assert that no toasts exist
+     */
+    public async assertNoToasts(): Promise<void> {
+        await expect(this.page.locator(".mx_Toast_toast")).not.toBeVisible();
+    }
+
+    /**
+     * Assert that a toast with the given title exists, and return it
+     *
+     * @param title - Expected title of the toast
+     * @param timeout - Time to retry the assertion for in milliseconds.
+     *                  Defaults to `timeout` in `TestConfig.expect`.
+     * @returns the Locator for the matching toast
+     */
+    public async getToast(title: string, timeout?: number): Promise<Locator> {
+        const toast = this.getToastIfExists(title);
+        await expect(toast).toBeVisible({ timeout });
+        return toast;
+    }
+
+    /**
+     * Find a toast with the given title, if it exists.
+     *
+     * @param title - Title of the toast.
+     * @returns the Locator for the matching toast, or an empty locator if it
+     *          doesn't exist.
+     */
+    public getToastIfExists(title: string): Locator {
+        return this.page.locator(".mx_Toast_toast", { hasText: title }).first();
+    }
+
+    /**
+     * Accept a toast with the given title. Only works for the first toast in
+     * the stack.
+     *
+     * @param title - Expected title of the toast
+     */
+    public async acceptToast(title: string): Promise<void> {
+        const toast = await this.getToast(title);
+        await toast.locator('.mx_Toast_buttons button[data-kind="primary"]').click();
+    }
+    /**
+     * Accept a toast with the given title, if it exists. Only works for the
+     * first toast in the stack.
+     *
+     * @param title - Title of the toast
+     */
+    public async acceptToastIfExists(title: string): Promise<void> {
+        const toast = this.getToastIfExists(title).locator('.mx_Toast_buttons button[data-kind="primary"]');
+        if ((await toast.count()) > 0) {
+            await toast.click();
+        }
+    }
+
+    /**
+     * Reject a toast with the given title. Only works for the first toast in
+     * the stack.
+     *
+     * @param title - Expected title of the toast
+     */
+    public async rejectToast(title: string): Promise<void> {
+        const toast = await this.getToast(title);
+        await toast.locator('.mx_Toast_buttons button[data-kind="secondary"]').click();
+    }
+
+    /**
+     * Reject a toast with the given title, if it exists. Only works for the
+     * first toast in the stack.
+     *
+     * @param title - Title of the toast
+     */
+    public async rejectToastIfExists(title: string): Promise<void> {
+        const toast = this.getToastIfExists(title).locator('.mx_Toast_buttons button[data-kind="secondary"]');
+        if ((await toast.count()) > 0) {
+            await toast.click();
+        }
+    }
+}

package/src/fixtures/user.ts

@@ -9,7 +9,10 @@ Please see LICENSE files in the repository root for full details.
 import { type Page } from "@playwright/test";
 import { sample, uniqueId } from "lodash-es";
 
-import { test as base } from "./services.js";
+// We want to avoid using `mergeTests` in index.ts because it drops useful type
+// information about the fixtures. Instead, we add `toasts` into our fixture
+// suite by using its `test` as a base, so that there is a linear hierarchy.
+import { test as base } from "./toasts.js";
 import { type Credentials } from "../utils/api.js";
 
 /** Adds an initScript to the given page which will populate localStorage appropriately so that Element will use the given credentials. */