diff --git a/cypress/e2e/left-panel/left-panel.spec.ts b/cypress/e2e/left-panel/left-panel.spec.ts deleted file mode 100644 index 232cffe9cc..0000000000 --- a/cypress/e2e/left-panel/left-panel.spec.ts +++ /dev/null @@ -1,42 +0,0 @@ -/* -Copyright 2023 Suguru Hirahara - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -/// - -import { HomeserverInstance } from "../../plugins/utils/homeserver"; - -describe("LeftPanel", () => { - let homeserver: HomeserverInstance; - - beforeEach(() => { - cy.startHomeserver("default").then((data) => { - homeserver = data; - - cy.initTestUser(homeserver, "Hanako"); - }); - }); - - afterEach(() => { - cy.stopHomeserver(homeserver); - }); - - it("should render the Rooms list", () => { - // create rooms and check room names are correct - cy.createRoom({ name: "Apple" }).then(() => cy.findByRole("treeitem", { name: "Apple" })); - cy.createRoom({ name: "Pineapple" }).then(() => cy.findByRole("treeitem", { name: "Pineapple" })); - cy.createRoom({ name: "Orange" }).then(() => cy.findByRole("treeitem", { name: "Orange" })); - }); -}); diff --git a/cypress/e2e/login/consent.spec.ts b/cypress/e2e/login/consent.spec.ts deleted file mode 100644 index 32f4e0f033..0000000000 --- a/cypress/e2e/login/consent.spec.ts +++ /dev/null @@ -1,75 +0,0 @@ -/* -Copyright 2022 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -/// - -import { SinonStub } from "cypress/types/sinon"; - -import { HomeserverInstance } from "../../plugins/utils/homeserver"; - -describe("Consent", () => { - let homeserver: HomeserverInstance; - - beforeEach(() => { - cy.startHomeserver("consent").then((data) => { - homeserver = data; - - cy.initTestUser(homeserver, "Bob"); - }); - }); - - afterEach(() => { - cy.stopHomeserver(homeserver); - }); - - it("should prompt the user to consent to terms when server deems it necessary", () => { - // Attempt to create a room using the js-sdk which should return an error with `M_CONSENT_NOT_GIVEN` - cy.window().then((win) => { - win.mxMatrixClientPeg.matrixClient.createRoom({}).catch(() => {}); - - // Stub `window.open` - clicking the primary button below will call it - cy.stub(win, "open").as("windowOpen").returns({}); - }); - - // Accept terms & conditions - cy.get(".mx_QuestionDialog").within(() => { - cy.get("#mx_BaseDialog_title").within(() => { - cy.findByText("Terms and Conditions"); - }); - cy.findByRole("button", { name: "Review terms and conditions" }).click(); - }); - - cy.get("@windowOpen").then((stub) => { - const url = stub.getCall(0).args[0]; - - // Go to Homeserver's consent page and accept it - cy.origin(homeserver.baseUrl, { args: { url } }, ({ url }) => { - cy.visit(url); - - cy.get('[type="submit"]').click(); - cy.contains("p", "Danke schoen"); - }); - }); - - // go back to the app - cy.visit("/"); - // wait for the app to re-load - cy.get(".mx_MatrixChat", { timeout: 15000 }); - - // attempt to perform the same action again and expect it to not fail - cy.createRoom({}); - }); -}); diff --git a/cypress/e2e/user-onboarding/user-onboarding-new.spec.ts b/cypress/e2e/user-onboarding/user-onboarding-new.spec.ts deleted file mode 100644 index 5d79c9c58e..0000000000 --- a/cypress/e2e/user-onboarding/user-onboarding-new.spec.ts +++ /dev/null @@ -1,96 +0,0 @@ -/* -Copyright 2022 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -/// - -import { MatrixClient } from "../../global"; -import { HomeserverInstance } from "../../plugins/utils/homeserver"; - -describe("User Onboarding (new user)", () => { - let homeserver: HomeserverInstance; - - const bot1Name = "BotBob"; - let bot1: MatrixClient; - - beforeEach(() => { - cy.startHomeserver("default").then((data) => { - homeserver = data; - cy.initTestUser(homeserver, "Jane Doe"); - cy.window({ log: false }).then((win) => { - win.localStorage.setItem("mx_registration_time", "1656633601"); - }); - cy.reload().then(() => { - // wait for the app to load - return cy.get(".mx_MatrixChat", { timeout: 15000 }); - }); - cy.getBot(homeserver, { displayName: bot1Name }).then((_bot1) => { - bot1 = _bot1; - }); - cy.get(".mx_UserOnboardingPage").should("exist"); - cy.findByRole("button", { name: "Welcome" }).should("exist"); - cy.get(".mx_UserOnboardingList") - .should("exist") - .should(($list) => { - const list = $list.get(0); - expect(getComputedStyle(list).opacity).to.be.eq("1"); - }); - }); - }); - - afterEach(() => { - cy.stopHomeserver(homeserver); - }); - - it("page is shown and preference exists", () => { - cy.get(".mx_UserOnboardingPage").percySnapshotElement("User onboarding page"); - cy.openUserSettings("Preferences"); - cy.findByText("Show shortcut to welcome checklist above the room list").should("exist"); - }); - - it("app download dialog", () => { - cy.findByRole("button", { name: "Download apps" }).click(); - cy.get("[role=dialog]").get("#mx_BaseDialog_title").findByText("Download Element").should("exist"); - cy.get("[role=dialog]").percySnapshotElement("App download dialog", { - widths: [640], - }); - }); - - it("using find friends action should increase progress", () => { - cy.get(".mx_ProgressBar") - .invoke("val") - .then((oldProgress) => { - const findPeopleAction = cy.findByRole("button", { name: "Find friends" }); - expect(findPeopleAction).to.exist; - findPeopleAction.click(); - cy.get(".mx_InviteDialog_editor").findByRole("textbox").type(bot1.getUserId()); - cy.findByRole("button", { name: "Go" }).click(); - cy.get(".mx_InviteDialog_buttonAndSpinner").should("not.exist"); - const message = "Hi!"; - cy.findByRole("textbox", { name: "Send a message…" }).type(`${message}{enter}`); - cy.get(".mx_MTextBody.mx_EventTile_content").findByText(message); - cy.visit("/#/home"); - cy.get(".mx_UserOnboardingPage").should("exist"); - cy.findByRole("button", { name: "Welcome" }).should("exist"); - cy.get(".mx_UserOnboardingList") - .should("exist") - .should(($list) => { - const list = $list.get(0); - expect(getComputedStyle(list).opacity).to.be.eq("1"); - }); - cy.get(".mx_ProgressBar").invoke("val").should("be.greaterThan", oldProgress); - }); - }); -}); diff --git a/cypress/e2e/user-onboarding/user-onboarding-old.spec.ts b/cypress/e2e/user-onboarding/user-onboarding-old.spec.ts deleted file mode 100644 index 502bdd2a0a..0000000000 --- a/cypress/e2e/user-onboarding/user-onboarding-old.spec.ts +++ /dev/null @@ -1,49 +0,0 @@ -/* -Copyright 2022 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -/// - -import { HomeserverInstance } from "../../plugins/utils/homeserver"; - -describe("User Onboarding (old user)", () => { - let homeserver: HomeserverInstance; - - beforeEach(() => { - cy.startHomeserver("default").then((data) => { - homeserver = data; - cy.initTestUser(homeserver, "Jane Doe"); - cy.window({ log: false }).then((win) => { - win.localStorage.setItem("mx_registration_time", "2"); - }); - cy.reload().then(() => { - // wait for the app to load - return cy.get(".mx_MatrixChat", { timeout: 15000 }); - }); - }); - }); - - afterEach(() => { - cy.visit("/#/home"); - cy.stopHomeserver(homeserver); - }); - - it("page and preference are hidden", () => { - cy.get(".mx_UserOnboardingPage").should("not.exist"); - cy.get(".mx_UserOnboardingButton").should("not.exist"); - cy.openUserSettings("Preferences"); - cy.findByText(/Show shortcut to welcome page above the room list/).should("not.exist"); - }); -}); diff --git a/package.json b/package.json index 0cab33910a..dd468c2a32 100644 --- a/package.json +++ b/package.json @@ -46,9 +46,9 @@ "start:all": "echo THIS IS FOR LEGACY PURPOSES ONLY. && yarn start:build", "start:build": "babel src -w -s -d lib --verbose --extensions \".ts,.js\"", "lint": "yarn lint:types && yarn lint:js && yarn lint:style && yarn lint:workflows", - "lint:js": "eslint --max-warnings 0 src test cypress && prettier --check .", - "lint:js-fix": "eslint --fix src test cypress && prettier --loglevel=warn --write .", - "lint:types": "tsc --noEmit --jsx react && tsc --noEmit --jsx react -p cypress", + "lint:js": "eslint --max-warnings 0 src test cypress playwright && prettier --check .", + "lint:js-fix": "eslint --fix src test cypress playwright && prettier --loglevel=warn --write .", + "lint:types": "tsc --noEmit --jsx react && tsc --noEmit --jsx react -p cypress && tsc --noEmit --jsx react -p playwright", "lint:style": "stylelint \"res/css/**/*.pcss\"", "test": "jest", "test:cypress": "cypress run", @@ -226,7 +226,7 @@ "stylelint-config-standard": "^34.0.0", "stylelint-scss": "^5.0.0", "ts-node": "^10.9.1", - "typescript": "5.1.6", + "typescript": "5.2.2", "@axe-core/playwright": "^4.8.1", "@action-validator/core": "^0.5.3", "@action-validator/cli": "^0.5.3" diff --git a/playwright/e2e/left-panel/left-panel.spec.ts b/playwright/e2e/left-panel/left-panel.spec.ts new file mode 100644 index 0000000000..ae0efcad0c --- /dev/null +++ b/playwright/e2e/left-panel/left-panel.spec.ts @@ -0,0 +1,31 @@ +/* +Copyright 2023 Suguru Hirahara + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +import { test, expect } from "../../element-web-test"; + +test.describe("LeftPanel", () => { + test.use({ + displayName: "Hanako", + }); + + test("should render the Rooms list", async ({ page, app, user }) => { + // create rooms and check room names are correct + for (const name of ["Apple", "Pineapple", "Orange"]) { + await app.createRoom({ name }); + await expect(page.getByRole("treeitem", { name })).toBeVisible(); + } + }); +}); diff --git a/playwright/e2e/login/consent.spec.ts b/playwright/e2e/login/consent.spec.ts new file mode 100644 index 0000000000..eb966d7141 --- /dev/null +++ b/playwright/e2e/login/consent.spec.ts @@ -0,0 +1,55 @@ +/* +Copyright 2022 The Matrix.org Foundation C.I.C. + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +import { Page } from "@playwright/test"; + +import { test, expect } from "../../element-web-test"; + +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, + user, + app, + }) => { + // Attempt to create a room using the js-sdk which should return an error with `M_CONSENT_NOT_GIVEN` + await app.createRoom({}).catch(() => {}); + const newPagePromise = new Promise((resolve) => context.once("page", resolve)); + + const dialog = page.locator(".mx_QuestionDialog"); + // Accept terms & conditions + await expect(dialog.getByRole("heading", { name: "Terms and Conditions" })).toBeVisible(); + await page.getByRole("button", { name: "Review terms and conditions" }).click(); + + const newPage = await newPagePromise; + await newPage.locator('[type="submit"]').click(); + await expect(newPage.getByText("Danke schoen")).toBeVisible(); + + // go back to the app + await page.goto("/"); + // wait for the app to re-load + await expect(page.locator(".mx_MatrixChat")).toBeVisible(); + + // attempt to perform the same action again and expect it to not fail + await app.createRoom({ name: "Test Room" }); + await expect(page.getByText("Test Room")).toBeVisible(); + }); +}); diff --git a/playwright/e2e/login/utils.ts b/playwright/e2e/login/utils.ts index 856e3f610b..4bb3023269 100644 --- a/playwright/e2e/login/utils.ts +++ b/playwright/e2e/login/utils.ts @@ -43,7 +43,7 @@ export async function doTokenRegistration( // Synapse prompts us to pick a user ID await expect(page.getByRole("heading", { name: "Create your account" })).toBeVisible(); - await page.getByRole("textbox", { name: "Username (required)" }).type("alice"); + await page.getByRole("textbox", { name: "Username (required)" }).fill("alice"); // wait for username validation to start, and complete await expect(page.locator("#field-username-output")).toHaveText(""); diff --git a/playwright/e2e/user-onboarding/user-onboarding-new.spec.ts b/playwright/e2e/user-onboarding/user-onboarding-new.spec.ts new file mode 100644 index 0000000000..106706e965 --- /dev/null +++ b/playwright/e2e/user-onboarding/user-onboarding-new.spec.ts @@ -0,0 +1,75 @@ +/* +Copyright 2022 The Matrix.org Foundation C.I.C. + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +import { test, expect } from "../../element-web-test"; + +test.describe("User Onboarding (new user)", () => { + test.use({ + displayName: "Jane Doe", + }); + + // This first beforeEach happens before the `user` fixture runs + test.beforeEach(async ({ page }) => { + await page.addInitScript(() => { + window.localStorage.setItem("mx_registration_time", "1656633601"); + }); + }); + + test.beforeEach(async ({ page, user }) => { + await expect(page.locator(".mx_UserOnboardingPage")).toBeVisible(); + await expect(page.getByRole("button", { name: "Welcome" })).toBeVisible(); + await expect(page.locator(".mx_UserOnboardingList")).toBeVisible(); + }); + + test("page is shown and preference exists", async ({ page, app }) => { + await expect(page.locator(".mx_UserOnboardingPage")).toHaveScreenshot(); + await app.openUserSettings("Preferences"); + await expect(page.getByText("Show shortcut to welcome checklist above the room list")).toBeVisible(); + }); + + test("app download dialog", async ({ page }) => { + await page.getByRole("button", { name: "Download apps" }).click(); + await expect( + page.getByRole("dialog").getByRole("heading", { level: 2, name: "Download Element" }), + ).toBeVisible(); + await expect(page.getByRole("dialog")).toHaveScreenshot(); + }); + + test("using find friends action should increase progress", async ({ page, homeserver }) => { + const bot = await homeserver.registerUser("botbob", "password", "BotBob"); + + const oldProgress = parseFloat(await page.getByRole("progressbar").getAttribute("value")); + await page.getByRole("button", { name: "Find friends" }).click(); + await page.locator(".mx_InviteDialog_editor").getByRole("textbox").fill(bot.userId); + await page.getByRole("button", { name: "Go" }).click(); + await expect(page.locator(".mx_InviteDialog_buttonAndSpinner")).not.toBeVisible(); + + const message = "Hi!"; + const composer = page.getByRole("textbox", { name: "Send a message…" }); + await composer.fill(`${message}`); + await composer.press("Enter"); + await expect(page.locator(".mx_MTextBody.mx_EventTile_content", { hasText: message })).toBeVisible(); + + await page.goto("/#/home"); + await expect(page.locator(".mx_UserOnboardingPage")).toBeVisible(); + await expect(page.getByRole("button", { name: "Welcome" })).toBeVisible(); + await expect(page.locator(".mx_UserOnboardingList")).toBeVisible(); + + await page.waitForTimeout(500); // await progress bar animation + const progress = parseFloat(await page.getByRole("progressbar").getAttribute("value")); + expect(progress).toBeGreaterThan(oldProgress); + }); +}); diff --git a/playwright/e2e/user-onboarding/user-onboarding-new.spec.ts-snapshots/User-Onboarding-new-user-app-download-dialog-1-Legacy-Crypto-linux.png b/playwright/e2e/user-onboarding/user-onboarding-new.spec.ts-snapshots/User-Onboarding-new-user-app-download-dialog-1-Legacy-Crypto-linux.png new file mode 100644 index 0000000000..932bfc6c3a Binary files /dev/null and b/playwright/e2e/user-onboarding/user-onboarding-new.spec.ts-snapshots/User-Onboarding-new-user-app-download-dialog-1-Legacy-Crypto-linux.png differ diff --git a/playwright/e2e/user-onboarding/user-onboarding-new.spec.ts-snapshots/User-Onboarding-new-user-app-download-dialog-1-Rust-Crypto-linux.png b/playwright/e2e/user-onboarding/user-onboarding-new.spec.ts-snapshots/User-Onboarding-new-user-app-download-dialog-1-Rust-Crypto-linux.png new file mode 100644 index 0000000000..932bfc6c3a Binary files /dev/null and b/playwright/e2e/user-onboarding/user-onboarding-new.spec.ts-snapshots/User-Onboarding-new-user-app-download-dialog-1-Rust-Crypto-linux.png differ diff --git a/playwright/e2e/user-onboarding/user-onboarding-new.spec.ts-snapshots/User-Onboarding-new-user-page-is-shown-and-preference-exists-1-Legacy-Crypto-linux.png b/playwright/e2e/user-onboarding/user-onboarding-new.spec.ts-snapshots/User-Onboarding-new-user-page-is-shown-and-preference-exists-1-Legacy-Crypto-linux.png new file mode 100644 index 0000000000..29f7adc4dd Binary files /dev/null and b/playwright/e2e/user-onboarding/user-onboarding-new.spec.ts-snapshots/User-Onboarding-new-user-page-is-shown-and-preference-exists-1-Legacy-Crypto-linux.png differ diff --git a/playwright/e2e/user-onboarding/user-onboarding-new.spec.ts-snapshots/User-Onboarding-new-user-page-is-shown-and-preference-exists-1-Rust-Crypto-linux.png b/playwright/e2e/user-onboarding/user-onboarding-new.spec.ts-snapshots/User-Onboarding-new-user-page-is-shown-and-preference-exists-1-Rust-Crypto-linux.png new file mode 100644 index 0000000000..29f7adc4dd Binary files /dev/null and b/playwright/e2e/user-onboarding/user-onboarding-new.spec.ts-snapshots/User-Onboarding-new-user-page-is-shown-and-preference-exists-1-Rust-Crypto-linux.png differ diff --git a/playwright/e2e/user-onboarding/user-onboarding-old.spec.ts b/playwright/e2e/user-onboarding/user-onboarding-old.spec.ts new file mode 100644 index 0000000000..99bbcedd98 --- /dev/null +++ b/playwright/e2e/user-onboarding/user-onboarding-old.spec.ts @@ -0,0 +1,36 @@ +/* +Copyright 2022 The Matrix.org Foundation C.I.C. + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +import { test, expect } from "../../element-web-test"; + +test.describe("User Onboarding (old user)", () => { + test.use({ + displayName: "Jane Doe", + }); + + test.beforeEach(async ({ page }) => { + await page.addInitScript(() => { + window.localStorage.setItem("mx_registration_time", "2"); + }); + }); + + test("page and preference are hidden", async ({ page, user, app }) => { + await expect(page.locator(".mx_UserOnboardingPage")).not.toBeVisible(); + await expect(page.locator(".mx_UserOnboardingButton")).not.toBeVisible(); + await app.openUserSettings("Preferences"); + await expect(page.getByText("Show shortcut to welcome checklist above the room list")).not.toBeVisible(); + }); +}); diff --git a/playwright/element-web-test.ts b/playwright/element-web-test.ts index ee1ae67f3a..9592a2d1eb 100644 --- a/playwright/element-web-test.ts +++ b/playwright/element-web-test.ts @@ -23,6 +23,7 @@ import type { IConfigOptions } from "../src/IConfigOptions"; import { Credentials, HomeserverInstance, StartHomeserverOpts } from "./plugins/utils/homeserver"; import { Synapse } from "./plugins/synapse"; import { Instance } from "./plugins/mailhog"; +import { ElementAppPage } from "./pages/ElementAppPage"; import { OAuthServer } from "./plugins/oauth_server"; import { Toasts } from "./pages/toasts"; @@ -60,6 +61,7 @@ export const test = base.extend< displayName: string; }; displayName?: string; + app: ElementAppPage; mailhog?: { api: mailhog.API; instance: Instance }; toasts: Toasts; } @@ -150,6 +152,9 @@ export const test = base.extend< expect(results.violations).toEqual([]); }), + app: async ({ page }, use) => { + await use(new ElementAppPage(page)); + }, toasts: async ({ page }, use) => { await use(new Toasts(page)); }, diff --git a/playwright/global.d.ts b/playwright/global.d.ts new file mode 100644 index 0000000000..784c09cee4 --- /dev/null +++ b/playwright/global.d.ts @@ -0,0 +1,25 @@ +/* +Copyright 2023 The Matrix.org Foundation C.I.C. + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +import { type MatrixClient } from "matrix-js-sdk/src/matrix"; + +declare global { + interface Window { + mxMatrixClientPeg: { + get(): MatrixClient; + }; + } +} diff --git a/playwright/pages/ElementAppPage.ts b/playwright/pages/ElementAppPage.ts new file mode 100644 index 0000000000..a913675f0c --- /dev/null +++ b/playwright/pages/ElementAppPage.ts @@ -0,0 +1,68 @@ +/* +Copyright 2023 The Matrix.org Foundation C.I.C. + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +import { type Locator, type Page } from "@playwright/test"; +import { type ICreateRoomOpts } from "matrix-js-sdk/src/matrix"; + +export class ElementAppPage { + public constructor(private readonly page: Page) {} + + /** + * Open the top left user menu, returning a Locator to the resulting context menu. + */ + public async openUserMenu(): Promise { + await this.page.getByRole("button", { name: "User menu" }).click(); + const locator = this.page.locator(".mx_ContextualMenu"); + await locator.waitFor(); + return locator; + } + + /** + * Switch settings tab to the one by the given name + * @param tab the name of the tab to switch to. + */ + public async switchTab(tab: string): Promise { + await this.page + .locator(".mx_TabbedView_tabLabels") + .locator(".mx_TabbedView_tabLabel", { hasText: tab }) + .click(); + } + + /** + * Open user settings (via user menu), returns a locator to the dialog + * @param tab the name of the tab to switch to after opening, optional. + */ + public async openUserSettings(tab?: string): Promise { + const locator = await this.openUserMenu(); + await locator.getByRole("menuitem", { name: "All settings", exact: true }).click(); + if (tab) await this.switchTab(tab); + return this.page.locator(".mx_UserSettingsDialog"); + } + + /** + * Create a room with given options. + * @param options the options to apply when creating the room + * @return the ID of the newly created room + */ + public async createRoom(options: ICreateRoomOpts): Promise { + return this.page.evaluate, ICreateRoomOpts>(async (options) => { + return window.mxMatrixClientPeg + .get() + .createRoom(options) + .then((res) => res.room_id); + }, options); + } +} diff --git a/playwright/plugins/synapse/index.ts b/playwright/plugins/synapse/index.ts index 432fe006d7..3ac861cd18 100644 --- a/playwright/plugins/synapse/index.ts +++ b/playwright/plugins/synapse/index.ts @@ -193,6 +193,10 @@ export class Synapse implements Homeserver, HomeserverInstance { }, }); + if (!res.ok()) { + throw await res.json(); + } + const data = await res.json(); return { homeServer: data.home_server, diff --git a/playwright/tsconfig.json b/playwright/tsconfig.json index 7651d24e97..cea25ebab7 100644 --- a/playwright/tsconfig.json +++ b/playwright/tsconfig.json @@ -2,11 +2,15 @@ "compilerOptions": { "target": "es2016", "jsx": "react", - "lib": ["es2021", "dom", "dom.iterable"], + "lib": ["ESNext", "es2021", "dom", "dom.iterable"], "resolveJsonModule": true, "esModuleInterop": true, "moduleResolution": "node", "module": "es2022" }, - "include": ["**/*.ts", "../src/@types/global.d.ts"] + "include": [ + "**/*.ts", + "../node_modules/matrix-js-sdk/src/@types/*.d.ts", + "../node_modules/matrix-js-sdk/node_modules/@matrix-org/olm/index.d.ts" + ] } diff --git a/yarn.lock b/yarn.lock index d0dd55aeda..20f71f9443 100644 --- a/yarn.lock +++ b/yarn.lock @@ -9986,10 +9986,10 @@ typed-array-length@^1.0.4: for-each "^0.3.3" is-typed-array "^1.1.9" -typescript@5.1.6: - version "5.1.6" - resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.1.6.tgz#02f8ac202b6dad2c0dd5e0913745b47a37998274" - integrity sha512-zaWCozRZ6DLEWAWFrVDz1H6FVXzUSfTy5FUMWsQlU8Ym5JP9eO4xkTIROFCQvhQf61z6O/G6ugw3SgAnvvm+HA== +typescript@5.2.2: + version "5.2.2" + resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.2.2.tgz#5ebb5e5a5b75f085f22bc3f8460fba308310fa78" + integrity sha512-mI4WrpHsbCIcwT9cF4FZvr80QUeKvsUsUvKDoR+X/7XHQH98xYD8YHZg7ANtz2GtZt/CBq2QJ0thkGJMHfqc1w== ua-parser-js@^1.0.2: version "1.0.37"