diff --git a/playwright/e2e/devtools/devtools.spec.ts b/playwright/e2e/devtools/devtools.spec.ts index c9aa983821..471b76c28b 100644 --- a/playwright/e2e/devtools/devtools.spec.ts +++ b/playwright/e2e/devtools/devtools.spec.ts @@ -9,7 +9,7 @@ import { test, expect } from "../../element-web-test"; test.describe("Devtools", () => { test.use({ - displayName: "Alice" + displayName: "Alice", }); test("should render the devtools", { tag: "@screenshot" }, async ({ page, homeserver, user, app }) => { diff --git a/playwright/e2e/devtools/upgraderoom.spec.ts b/playwright/e2e/devtools/upgraderoom.spec.ts index 0df3ee310c..e7288ba264 100644 --- a/playwright/e2e/devtools/upgraderoom.spec.ts +++ b/playwright/e2e/devtools/upgraderoom.spec.ts @@ -10,7 +10,7 @@ import { test, expect } from "../../element-web-test"; test.describe("Room upgrade dialog", () => { test.use({ - displayName: "Alice" + displayName: "Alice", }); test("should render the room upgrade dialog", { tag: "@screenshot" }, async ({ page, homeserver, user, app }) => { diff --git a/playwright/e2e/invite/decline-and-block-invite-dialog.spec.ts b/playwright/e2e/invite/decline-and-block-invite-dialog.spec.ts index a232ad492b..82a65f4272 100644 --- a/playwright/e2e/invite/decline-and-block-invite-dialog.spec.ts +++ b/playwright/e2e/invite/decline-and-block-invite-dialog.spec.ts @@ -12,10 +12,14 @@ test.describe("Decline and block invite dialog", function () { displayName: "Hanako", }); - test("should show decline and block dialog for a room", { tag: "@screenshot" }, async ({ page, app, user, bot }) => { - await bot.createRoom({ name: "Test Room", invite: [user.userId] }); - await app.viewRoomByName("Test Room"); - await page.getByRole("button", { name: "Decline and block" }).click(); - await expect(page.locator(".mx_Dialog")).toMatchScreenshot("decline-and-block-invite-empty.png"); - }); + test( + "should show decline and block dialog for a room", + { tag: "@screenshot" }, + async ({ page, app, user, bot }) => { + await bot.createRoom({ name: "Test Room", invite: [user.userId] }); + await app.viewRoomByName("Test Room"); + await page.getByRole("button", { name: "Decline and block" }).click(); + await expect(page.locator(".mx_Dialog")).toMatchScreenshot("decline-and-block-invite-empty.png"); + }, + ); }); diff --git a/playwright/e2e/location/location.spec.ts b/playwright/e2e/location/location.spec.ts index 494583fb9d..29bc502355 100644 --- a/playwright/e2e/location/location.spec.ts +++ b/playwright/e2e/location/location.spec.ts @@ -58,15 +58,19 @@ test.describe("Location sharing", { tag: "@no-firefox" }, () => { await expect(page.locator(".mx_Marker")).toBeVisible(); }); - test("is prompted for and can consent to live location sharing", { tag: "@screenshot"}, async ({ page, user, app }) => { - await app.viewRoomById(await app.client.createRoom({})); + test( + "is prompted for and can consent to live location sharing", + { tag: "@screenshot" }, + async ({ page, user, app }) => { + await app.viewRoomById(await app.client.createRoom({})); - const composerOptions = await app.openMessageComposerOptions(); - await composerOptions.getByRole("menuitem", { name: "Location", exact: true }).click(); - const menu = page.locator(".mx_LocationShareMenu"); + const composerOptions = await app.openMessageComposerOptions(); + await composerOptions.getByRole("menuitem", { name: "Location", exact: true }).click(); + const menu = page.locator(".mx_LocationShareMenu"); - await menu.getByRole("button", { name: "My live location"}).click(); - await menu.getByLabel("Enable live location sharing").check(); - await expect(menu).toMatchScreenshot("location-live-share-dialog.png"); - }); + await menu.getByRole("button", { name: "My live location" }).click(); + await menu.getByLabel("Enable live location sharing").check(); + await expect(menu).toMatchScreenshot("location-live-share-dialog.png"); + }, + ); }); diff --git a/playwright/e2e/room/create-room.spec.ts b/playwright/e2e/room/create-room.spec.ts index 2fd49de75a..a6055597f9 100644 --- a/playwright/e2e/room/create-room.spec.ts +++ b/playwright/e2e/room/create-room.spec.ts @@ -14,29 +14,30 @@ const topic = "A decently explanatory topic for a test room."; test.describe("Create Room", () => { test.use({ displayName: "Jim" }); + test( + "should create a public room with name, topic & address set", + { tag: "@screenshot" }, + async ({ page, user, app }) => { + const dialog = await app.openCreateRoomDialog(); + // Fill name & topic + await dialog.getByRole("textbox", { name: "Name" }).fill(name); + await dialog.getByRole("textbox", { name: "Topic" }).fill(topic); + // Change room to public + await dialog.getByRole("button", { name: "Room visibility" }).click(); + await dialog.getByRole("option", { name: "Public room" }).click(); + // Fill room address + await dialog.getByRole("textbox", { name: "Room address" }).fill("test-room-1"); + // Snapshot it + await expect(dialog).toMatchScreenshot("create-room.png"); - test("should create a public room with name, topic & address set", { tag: "@screenshot" }, async ({ page, user, app }) => { + // Submit + await dialog.getByRole("button", { name: "Create room" }).click(); - const dialog = await app.openCreateRoomDialog(); - // Fill name & topic - await dialog.getByRole("textbox", { name: "Name" }).fill(name); - await dialog.getByRole("textbox", { name: "Topic" }).fill(topic); - // Change room to public - await dialog.getByRole("button", { name: "Room visibility" }).click(); - await dialog.getByRole("option", { name: "Public room" }).click(); - // Fill room address - await dialog.getByRole("textbox", { name: "Room address" }).fill("test-room-1"); - // Snapshot it - await expect(dialog).toMatchScreenshot("create-room.png"); - - // Submit - await dialog.getByRole("button", { name: "Create room" }).click(); - - - await expect(page).toHaveURL(new RegExp(`/#/room/#test-room-1:${user.homeServer}`)); - const header = page.locator(".mx_RoomHeader"); - await expect(header).toContainText(name); - }); + await expect(page).toHaveURL(new RegExp(`/#/room/#test-room-1:${user.homeServer}`)); + const header = page.locator(".mx_RoomHeader"); + await expect(header).toContainText(name); + }, + ); test("should create a video room", { tag: "@screenshot" }, async ({ page, user, app }) => { await app.settings.setValue("feature_video_rooms", null, SettingLevel.DEVICE, true); diff --git a/playwright/e2e/settings/notifications/notifications-settings-2-tab.spec.ts b/playwright/e2e/settings/notifications/notifications-settings-2-tab.spec.ts index ea8298134a..1770bb3df8 100644 --- a/playwright/e2e/settings/notifications/notifications-settings-2-tab.spec.ts +++ b/playwright/e2e/settings/notifications/notifications-settings-2-tab.spec.ts @@ -13,13 +13,13 @@ test.describe("Notifications 2 tab", () => { displayName: "Alice", }); - test("should display notification settings", {tag: "@screenshot"}, async ({ page, app, user }) => { + test("should display notification settings", { tag: "@screenshot" }, async ({ page, app, user }) => { await app.settings.setValue("feature_notification_settings2", null, SettingLevel.DEVICE, true); await page.setViewportSize({ width: 1024, height: 2000 }); const settings = await app.settings.openUserSettings("Notifications"); await expect(settings).toMatchScreenshot("standard-notifications-2-settings.png", { // Mask the mxid. - mask: [settings.locator("#mx_NotificationSettings2_MentionCheckbox span")] + mask: [settings.locator("#mx_NotificationSettings2_MentionCheckbox span")], }); }); }); diff --git a/playwright/e2e/settings/notifications/notifications-settings-tab.spec.ts b/playwright/e2e/settings/notifications/notifications-settings-tab.spec.ts index c0f3b66fc9..f3b590dcac 100644 --- a/playwright/e2e/settings/notifications/notifications-settings-tab.spec.ts +++ b/playwright/e2e/settings/notifications/notifications-settings-tab.spec.ts @@ -12,7 +12,7 @@ test.describe("Notifications tab", () => { displayName: "Alice", }); - test("should display notification settings", {tag: "@screenshot"}, async ({ page, app, user }) => { + test("should display notification settings", { tag: "@screenshot" }, async ({ page, app, user }) => { await page.setViewportSize({ width: 1024, height: 1400 }); const settings = await app.settings.openUserSettings("Notifications"); await settings.getByLabel("Enable notifications for this account").check(); diff --git a/playwright/e2e/settings/room-settings/room-security-tab.spec.ts b/playwright/e2e/settings/room-settings/room-security-tab.spec.ts index a396ee6076..914655328d 100644 --- a/playwright/e2e/settings/room-settings/room-security-tab.spec.ts +++ b/playwright/e2e/settings/room-settings/room-security-tab.spec.ts @@ -24,13 +24,13 @@ test.describe("Roles & Permissions room settings tab", () => { settings = await app.settings.openRoomSettings("Security & Privacy"); }); - test("should be able to toggle on encryption in a room", { tag: "@screenshot"}, async ({ page, app, user }) => { + test("should be able to toggle on encryption in a room", { tag: "@screenshot" }, async ({ page, app, user }) => { await page.setViewportSize({ width: 1024, height: 1400 }); const encryptedToggle = settings.getByLabel("Encrypted"); await encryptedToggle.click(); // Accept the dialog. - await page.getByRole("button", { name: "Ok "}).click(); + await page.getByRole("button", { name: "Ok " }).click(); await expect(encryptedToggle).toBeChecked(); await expect(encryptedToggle).toBeDisabled(); diff --git a/playwright/e2e/settings/room-settings/room-video-tab.spec.ts b/playwright/e2e/settings/room-settings/room-video-tab.spec.ts index 1d59b75b07..fdd1406782 100644 --- a/playwright/e2e/settings/room-settings/room-video-tab.spec.ts +++ b/playwright/e2e/settings/room-settings/room-video-tab.spec.ts @@ -27,10 +27,14 @@ test.describe("Voice & Video room settings tab", () => { settings = await app.settings.openRoomSettings("Voice & Video"); }); - test("should be able to toggle on Element Call in the room", { tag: "@screenshot"}, async ({ page, app, user }) => { - await page.setViewportSize({ width: 1024, height: 1400 }); - const callToggle = settings.getByLabel("Enable Element Call as an additional calling option in this room"); - await callToggle.check(); - await expect(settings).toMatchScreenshot("room-video-settings.png"); - }); + test( + "should be able to toggle on Element Call in the room", + { tag: "@screenshot" }, + async ({ page, app, user }) => { + await page.setViewportSize({ width: 1024, height: 1400 }); + const callToggle = settings.getByLabel("Enable Element Call as an additional calling option in this room"); + await callToggle.check(); + await expect(settings).toMatchScreenshot("room-video-settings.png"); + }, + ); }); diff --git a/playwright/e2e/settings/security-user-settings-tab.spec.ts b/playwright/e2e/settings/security-user-settings-tab.spec.ts index 5915f34158..377cae7495 100644 --- a/playwright/e2e/settings/security-user-settings-tab.spec.ts +++ b/playwright/e2e/settings/security-user-settings-tab.spec.ts @@ -41,14 +41,16 @@ test.describe("Security user settings tab", () => { }); }); - test("should render the security tab", { tag: "@screenshot"}, async ({ app, page, user }) => { + test("should render the security tab", { tag: "@screenshot" }, async ({ app, page, user }) => { await page.setViewportSize({ width: 1024, height: 1400 }); const tab = await app.settings.openUserSettings("Security"); - await expect(tab).toMatchScreenshot("security-settings-tab.png", { mask: [ - // Contains IM name. - tab.locator("#mx_SetIntegrationManager_BodyText"), - tab.locator("#mx_SetIntegrationManager_ManagerName"), - ]}); + await expect(tab).toMatchScreenshot("security-settings-tab.png", { + mask: [ + // Contains IM name. + tab.locator("#mx_SetIntegrationManager_BodyText"), + tab.locator("#mx_SetIntegrationManager_ManagerName"), + ], + }); }); test("should be able to set an ID server", async ({ app, context, user, page }) => { diff --git a/playwright/e2e/spaces/spaces.spec.ts b/playwright/e2e/spaces/spaces.spec.ts index 8ec81363da..f8e5bb3476 100644 --- a/playwright/e2e/spaces/spaces.spec.ts +++ b/playwright/e2e/spaces/spaces.spec.ts @@ -370,14 +370,15 @@ test.describe("Spaces", () => { await expect(page.locator(".mx_SpaceRoomView")).toMatchScreenshot("space-room-view.png"); }); - - test.only("should render spaces visibility settings", { tag: "@screenshot" }, async ({ page, app, user, bot }) => { + test("should render spaces visibility settings", { tag: "@screenshot" }, async ({ page, app, user, bot }) => { await app.client.createSpace({ name: "My Space", }); await app.viewSpaceByName("My space"); await page.getByLabel("Settings", { exact: true }).click(); await app.settings.switchTab("Visibility"); - await expect(page.locator("#mx_tabpanel_SPACE_VISIBILITY_TAB")).toMatchScreenshot("space-visibility-settings.png"); + await expect(page.locator("#mx_tabpanel_SPACE_VISIBILITY_TAB")).toMatchScreenshot( + "space-visibility-settings.png", + ); }); }); diff --git a/playwright/e2e/widgets/permissions-dialog.spec.ts b/playwright/e2e/widgets/permissions-dialog.spec.ts index af0bea9cf7..ad282403c7 100644 --- a/playwright/e2e/widgets/permissions-dialog.spec.ts +++ b/playwright/e2e/widgets/permissions-dialog.spec.ts @@ -46,48 +46,50 @@ test.describe("Widger permissions dialog", () => { demoWidgetUrl = webserver.start(DEMO_WIDGET_HTML); }); - test("should be updated if user is re-invited into the room with updated state event", { tag: "@screenshot" }, async ({ - page, - app, - user, - }) => { - const roomId = await app.client.createRoom({ - name: ROOM_NAME, - }); + test( + "should be updated if user is re-invited into the room with updated state event", + { tag: "@screenshot" }, + async ({ page, app, user }) => { + const roomId = await app.client.createRoom({ + name: ROOM_NAME, + }); - // setup widget via state event - await app.client.sendStateEvent( - roomId, - "im.vector.modular.widgets", - { - id: DEMO_WIDGET_ID, - creatorUserId: "somebody", - type: DEMO_WIDGET_TYPE, - name: DEMO_WIDGET_NAME, - url: demoWidgetUrl, - }, - DEMO_WIDGET_ID, - ); + // setup widget via state event + await app.client.sendStateEvent( + roomId, + "im.vector.modular.widgets", + { + id: DEMO_WIDGET_ID, + creatorUserId: "somebody", + type: DEMO_WIDGET_TYPE, + name: DEMO_WIDGET_NAME, + url: demoWidgetUrl, + }, + DEMO_WIDGET_ID, + ); - // set initial layout - await app.client.sendStateEvent( - roomId, - "io.element.widgets.layout", - { - widgets: { - [DEMO_WIDGET_ID]: { - container: "top", - index: 1, - width: 100, - height: 0, + // set initial layout + await app.client.sendStateEvent( + roomId, + "io.element.widgets.layout", + { + widgets: { + [DEMO_WIDGET_ID]: { + container: "top", + index: 1, + width: 100, + height: 0, + }, }, }, - }, - "", - ); + "", + ); - // open the room - await app.viewRoomByName(ROOM_NAME); - await expect(page.locator(".mx_WidgetCapabilitiesPromptDialog")).toMatchScreenshot("widget-capabilites-prompt.png"); - }); + // open the room + await app.viewRoomByName(ROOM_NAME); + await expect(page.locator(".mx_WidgetCapabilitiesPromptDialog")).toMatchScreenshot( + "widget-capabilites-prompt.png", + ); + }, + ); }); diff --git a/playwright/pages/ElementAppPage.ts b/playwright/pages/ElementAppPage.ts index ccc1985c0a..5d72703d06 100644 --- a/playwright/pages/ElementAppPage.ts +++ b/playwright/pages/ElementAppPage.ts @@ -51,7 +51,7 @@ export class ElementAppPage { /** * Open room creation dialog. */ - public async openCreateRoomDialog(roomKindname: "New room"|"New video room" = "New room"): Promise { + public async openCreateRoomDialog(roomKindname: "New room" | "New video room" = "New room"): Promise { await this.page.getByRole("button", { name: "Add room", exact: true }).click(); await this.page.getByRole("menuitem", { name: roomKindname, exact: true }).click(); return this.page.locator(".mx_CreateRoomDialog"); diff --git a/playwright/pages/settings.ts b/playwright/pages/settings.ts index fbccf38fea..0ea8c50348 100644 --- a/playwright/pages/settings.ts +++ b/playwright/pages/settings.ts @@ -43,7 +43,7 @@ export class Settings { * @param {*} value The new value of the setting, may be null. * @return {Promise} Resolves when the setting has been changed. */ - public async setValue(settingName: string, roomId: string|null, level: SettingLevel, value: any): Promise { + public async setValue(settingName: string, roomId: string | null, level: SettingLevel, value: any): Promise { return this.page.evaluate< Promise, {