diff --git a/playwright/e2e/accessibility/keyboard-navigation.spec.ts b/playwright/e2e/accessibility/keyboard-navigation.spec.ts index e22664c8985..6635a01d577 100644 --- a/playwright/e2e/accessibility/keyboard-navigation.spec.ts +++ b/playwright/e2e/accessibility/keyboard-navigation.spec.ts @@ -29,7 +29,7 @@ test.describe("Landmark navigation tests", () => { // Pressing Control+F6 again will focus room search await page.keyboard.press("ControlOrMeta+F6"); - await expect(page.locator(".mx_RoomSearch")).toBeFocused(); + await expect(page.locator(".mx_RoomListSearch_search")).toBeFocused(); // Pressing Control+F6 again will focus the message composer await page.keyboard.press("ControlOrMeta+F6"); @@ -44,7 +44,7 @@ test.describe("Landmark navigation tests", () => { await expect(page.locator(".mx_HomePage")).toBeFocused(); await page.keyboard.press("ControlOrMeta+Shift+F6"); - await expect(page.locator(".mx_RoomSearch")).toBeFocused(); + await expect(page.locator(".mx_RoomListSearch_search")).toBeFocused(); await page.keyboard.press("ControlOrMeta+Shift+F6"); await expect(page.locator(".mx_SpaceButton_active")).toBeFocused(); @@ -75,11 +75,11 @@ test.describe("Landmark navigation tests", () => { // Pressing Control+F6 again will focus room search await page.keyboard.press("ControlOrMeta+F6"); - await expect(page.locator(".mx_RoomSearch")).toBeFocused(); + await expect(page.locator(".mx_RoomListSearch_search")).toBeFocused(); // Pressing Control+F6 again will focus the room tile in the room list await page.keyboard.press("ControlOrMeta+F6"); - await expect(page.locator(".mx_RoomTile_selected")).toBeFocused(); + await expect(page.locator(".mx_RoomListItemView_selected")).toBeFocused(); // Pressing Control+F6 again will focus the message composer await page.keyboard.press("ControlOrMeta+F6"); @@ -94,10 +94,10 @@ test.describe("Landmark navigation tests", () => { await expect(page.locator(".mx_BasicMessageComposer_input")).toBeFocused(); await page.keyboard.press("ControlOrMeta+Shift+F6"); - await expect(page.locator(".mx_RoomTile_selected")).toBeFocused(); + await expect(page.locator(".mx_RoomListItemView_selected")).toBeFocused(); await page.keyboard.press("ControlOrMeta+Shift+F6"); - await expect(page.locator(".mx_RoomSearch")).toBeFocused(); + await expect(page.locator(".mx_RoomListSearch_search")).toBeFocused(); await page.keyboard.press("ControlOrMeta+Shift+F6"); await expect(page.locator(".mx_SpaceButton_active")).toBeFocused(); @@ -131,11 +131,11 @@ test.describe("Landmark navigation tests", () => { // Pressing Control+F6 again will focus room search await page.keyboard.press("ControlOrMeta+F6"); - await expect(page.locator(".mx_RoomSearch")).toBeFocused(); + await expect(page.locator(".mx_RoomListSearch_search")).toBeFocused(); // Pressing Control+F6 again will focus the room tile in the room list await page.keyboard.press("ControlOrMeta+F6"); - await expect(page.locator(".mx_RoomTile")).toBeFocused(); + await expect(page.locator(".mx_RoomListItemView")).toBeFocused(); // Pressing Control+F6 again will focus the home section await page.keyboard.press("ControlOrMeta+F6"); @@ -150,10 +150,10 @@ test.describe("Landmark navigation tests", () => { await expect(page.locator(".mx_HomePage")).toBeFocused(); await page.keyboard.press("ControlOrMeta+Shift+F6"); - await expect(page.locator(".mx_RoomTile")).toBeFocused(); + await expect(page.locator(".mx_RoomListItemView")).toBeFocused(); await page.keyboard.press("ControlOrMeta+Shift+F6"); - await expect(page.locator(".mx_RoomSearch")).toBeFocused(); + await expect(page.locator(".mx_RoomListSearch_search")).toBeFocused(); await page.keyboard.press("ControlOrMeta+Shift+F6"); await expect(page.locator(".mx_SpaceButton_active")).toBeFocused(); diff --git a/playwright/e2e/composer/CIDER.spec.ts b/playwright/e2e/composer/CIDER.spec.ts index 0d3454d351c..fcfbd1aad35 100644 --- a/playwright/e2e/composer/CIDER.spec.ts +++ b/playwright/e2e/composer/CIDER.spec.ts @@ -108,7 +108,10 @@ test.describe("Composer", () => { const composer = page.getByRole("textbox", { name: "Send an unencrypted message…" }); await composer.pressSequentially("@bob"); - await page.getByRole("option", { name: "Bob" }).click(); + + // Note that we include the user ID here as the room tile is also an 'option' role + // with text 'Bob' + await page.getByRole("option", { name: `Bob ${bot.credentials.userId}` }).click(); await expect(composer.getByText("Bob")).toBeVisible(); await expect(composer).toMatchScreenshot("mention.png"); await composer.press("Enter"); diff --git a/playwright/e2e/crypto/backups-mas.spec.ts b/playwright/e2e/crypto/backups-mas.spec.ts index fda82c220dd..4cada7a49b9 100644 --- a/playwright/e2e/crypto/backups-mas.spec.ts +++ b/playwright/e2e/crypto/backups-mas.spec.ts @@ -49,7 +49,7 @@ test.describe("Encryption state after registration", () => { "Pa$sW0rD!", ); - await page.getByRole("button", { name: "Add room" }).click(); + await page.getByRole("navigation", { name: "Room list" }).getByRole("button", { name: "Add" }).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(); @@ -78,7 +78,7 @@ test.describe("Key backup reset from elsewhere", () => { await page.getByRole("button", { name: "Continue" }).click(); await registerAccountMas(page, mailpitClient, testUsername, `${testUsername}@email.com`, testPassword); - await page.getByRole("button", { name: "Add room" }).click(); + await page.getByRole("navigation", { name: "Room list" }).getByRole("button", { name: "Add" }).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(); diff --git a/playwright/e2e/crypto/crypto.spec.ts b/playwright/e2e/crypto/crypto.spec.ts index 0df312f19c5..eff4e0110d1 100644 --- a/playwright/e2e/crypto/crypto.spec.ts +++ b/playwright/e2e/crypto/crypto.spec.ts @@ -21,7 +21,8 @@ const checkDMRoom = async (page: Page) => { }; const startDMWithBob = async (page: Page, bob: Bot) => { - await page.locator(".mx_LegacyRoomList").getByRole("button", { name: "Start chat" }).click(); + await page.getByRole("navigation", { name: "Room list" }).getByRole("button", { name: "Add" }).click(); + await page.getByRole("menuitem", { name: "Start chat" }).click(); await page.getByTestId("invite-dialog-input").fill(bob.credentials.userId); await page.locator(".mx_InviteDialog_tile_nameStack_name").getByText("Bob").click(); await expect( diff --git a/playwright/e2e/crypto/decryption-failure-messages.spec.ts b/playwright/e2e/crypto/decryption-failure-messages.spec.ts index 529251b223b..306e073c00a 100644 --- a/playwright/e2e/crypto/decryption-failure-messages.spec.ts +++ b/playwright/e2e/crypto/decryption-failure-messages.spec.ts @@ -143,10 +143,7 @@ test.describe("Cryptography", function () { ); // Alice accepts the invite - await expect( - page.getByRole("group", { name: "Invites" }).locator(".mx_RoomSublist_tiles").getByRole("treeitem"), - ).toHaveCount(1); - await page.getByRole("treeitem", { name: "Test room" }).click(); + await page.getByRole("option", { name: "Test room" }).click(); await page.locator(".mx_RoomView").getByRole("button", { name: "Accept" }).click(); // Bob sends an encrypted event and an undecryptable event @@ -280,10 +277,7 @@ test.describe("Cryptography", function () { ); // Alice accepts the invite - await expect( - page.getByRole("group", { name: "Invites" }).locator(".mx_RoomSublist_tiles").getByRole("treeitem"), - ).toHaveCount(1); - await page.getByRole("treeitem", { name: "Test room" }).click(); + await page.getByRole("option", { name: "Test room" }).click(); await page.locator(".mx_RoomView").getByRole("button", { name: "Accept" }).click(); // wait until we're joined and see the timeline diff --git a/playwright/e2e/crypto/toasts.spec.ts b/playwright/e2e/crypto/toasts.spec.ts index c96615d7ebc..7c455e5658f 100644 --- a/playwright/e2e/crypto/toasts.spec.ts +++ b/playwright/e2e/crypto/toasts.spec.ts @@ -23,7 +23,7 @@ test.describe("Key storage out of sync toast", () => { await deleteCachedSecrets(page); // We won't be prompted for crypto setup unless we have an e2e room, so make one - await page.getByRole("button", { name: "Add room" }).click(); + await page.getByRole("navigation", { name: "Room list" }).getByRole("button", { name: "Add" }).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(); @@ -68,7 +68,7 @@ test.describe("'Turn on key storage' toast", () => { await logIntoElementAndVerify(page, credentials, recoveryKey.encodedPrivateKey); // We won't be prompted for crypto setup unless we have an e2e room, so make one - await page.getByRole("button", { name: "Add room" }).click(); + await page.getByRole("navigation", { name: "Room list" }).getByRole("button", { name: "Add" }).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(); diff --git a/playwright/e2e/crypto/utils.ts b/playwright/e2e/crypto/utils.ts index f3660ae747a..484e9a37b05 100644 --- a/playwright/e2e/crypto/utils.ts +++ b/playwright/e2e/crypto/utils.ts @@ -438,8 +438,8 @@ export async function sendMessageInCurrentRoom(page: Page, message: string): Pro * @param isEncrypted - Whether the room should be encrypted */ export async function createRoom(page: Page, roomName: string, isEncrypted: boolean): Promise { - await page.getByRole("button", { name: "Add room" }).click(); - await page.locator(".mx_IconizedContextMenu").getByRole("menuitem", { name: "New room" }).click(); + await page.getByRole("navigation", { name: "Room list" }).getByRole("button", { name: "Add" }).click(); + await page.getByRole("menuitem", { name: "New room" }).click(); const dialog = page.locator(".mx_Dialog"); diff --git a/playwright/e2e/invite/invite-dialog.spec.ts b/playwright/e2e/invite/invite-dialog.spec.ts index 8d64e6e0474..5c249f8d66f 100644 --- a/playwright/e2e/invite/invite-dialog.spec.ts +++ b/playwright/e2e/invite/invite-dialog.spec.ts @@ -77,7 +77,8 @@ test.describe("Invite dialog", function () { "should support inviting a user to Direct Messages", { tag: "@screenshot" }, async ({ page, app, user, bot }) => { - await page.locator(".mx_LegacyRoomList").getByRole("button", { name: "Start chat" }).click(); + await page.getByRole("navigation", { name: "Room list" }).getByRole("button", { name: "Add" }).click(); + await page.getByRole("menuitem", { name: "Start chat" }).click(); const other = page.locator(".mx_InviteDialog_other"); // Assert that the header is rendered diff --git a/playwright/e2e/knock/knock-into-room.spec.ts b/playwright/e2e/knock/knock-into-room.spec.ts index be6619697de..26440a6e1ea 100644 --- a/playwright/e2e/knock/knock-into-room.spec.ts +++ b/playwright/e2e/knock/knock-into-room.spec.ts @@ -59,7 +59,7 @@ test.describe("Knock Into Room", () => { // Knocked room should appear in Rooms await expect( - page.getByRole("group", { name: "Rooms" }).getByRole("treeitem", { name: "Cybersecurity" }), + page.getByTestId("room-list").getByRole("option", { name: "Open room Cybersecurity" }), ).toBeVisible(); // bot waits for knock request from Alice @@ -77,7 +77,7 @@ test.describe("Knock Into Room", () => { await bot.inviteUser(room.roomId, user.userId); await expect( - page.getByRole("group", { name: "Invites" }).getByRole("treeitem", { name: "Cybersecurity" }), + page.getByTestId("room-list").getByRole("option", { name: "Open room Cybersecurity" }), ).toBeVisible(); // Alice have to accept invitation in order to join the room. @@ -85,7 +85,7 @@ test.describe("Knock Into Room", () => { await page.locator(".mx_RoomView").getByRole("button", { name: "Accept" }).click(); await expect( - page.getByRole("group", { name: "Rooms" }).getByRole("treeitem", { name: "Cybersecurity" }), + page.getByTestId("room-list").getByRole("option", { name: "Open room Cybersecurity" }), ).toBeVisible(); await expect(page.getByText("Alice joined the room")).toBeVisible(); @@ -136,7 +136,7 @@ test.describe("Knock Into Room", () => { // Knocked room should appear in Rooms await expect( - page.getByRole("group", { name: "Rooms" }).getByRole("treeitem", { name: "Cybersecurity" }), + page.getByTestId("room-list").getByRole("option", { name: "Open room Cybersecurity" }), ).toBeVisible(); // bot waits for knock request from Alice @@ -154,7 +154,7 @@ test.describe("Knock Into Room", () => { await bot.inviteUser(room.roomId, user.userId); await expect( - page.getByRole("group", { name: "Invites" }).getByRole("treeitem", { name: "Cybersecurity" }), + page.getByTestId("room-list").getByRole("option", { name: "Open room Cybersecurity" }), ).toBeVisible(); // Alice have to accept invitation in order to join the room. @@ -162,7 +162,7 @@ test.describe("Knock Into Room", () => { await page.locator(".mx_RoomView").getByRole("button", { name: "Accept" }).click(); await expect( - page.getByRole("group", { name: "Rooms" }).getByRole("treeitem", { name: "Cybersecurity" }), + page.getByTestId("room-list").getByRole("option", { name: "Open room Cybersecurity" }), ).toBeVisible(); await expect(page.getByText("Alice joined the room")).toBeVisible(); @@ -215,14 +215,14 @@ test.describe("Knock Into Room", () => { await expect(roomPreviewBar.getByRole("heading", { name: "Request to join sent" })).toBeVisible(); // Knocked room should appear in Rooms - page.getByRole("group", { name: "Rooms" }).getByRole("treeitem", { name: "Cybersecurity" }); + page.getByTestId("room-list").getByRole("option", { name: "Open room Cybersecurity" }); await roomPreviewBar.getByRole("button", { name: "Cancel request" }).click(); await expect(roomPreviewBar.getByRole("heading", { name: "Ask to join Cybersecurity?" })).toBeVisible(); await expect(roomPreviewBar.getByRole("button", { name: "Request access" })).toBeVisible(); await expect( - page.getByRole("group", { name: "Rooms" }).getByRole("treeitem", { name: "Cybersecurity" }), + page.getByTestId("room-list").getByRole("option", { name: "Open room Cybersecurity" }), ).not.toBeVisible(); }); @@ -244,7 +244,7 @@ test.describe("Knock Into Room", () => { // Knocked room should appear in Rooms await expect( - page.getByRole("group", { name: "Rooms" }).getByRole("treeitem", { name: "Cybersecurity" }), + page.getByTestId("room-list").getByRole("option", { name: "Open room Cybersecurity" }), ).toBeVisible(); // bot waits for knock request from Alice @@ -262,13 +262,10 @@ test.describe("Knock Into Room", () => { await bot.kick(room.roomId, user.userId); // Room should stay in Rooms and have red badge when knock is denied - await expect( - page.getByRole("group", { name: "Rooms" }).getByRole("treeitem", { name: "Cybersecurity", exact: true }), - ).not.toBeVisible(); await expect( page - .getByRole("group", { name: "Rooms" }) - .getByRole("treeitem", { name: "Cybersecurity 1 unread mention." }), + .getByTestId("room-list") + .getByRole("option", { name: "Open room Cybersecurity with 1 unread mention." }), ).toBeVisible(); await expect(roomPreviewBar.getByRole("heading", { name: "You have been denied access" })).toBeVisible(); diff --git a/playwright/e2e/left-panel/left-panel.spec.ts b/playwright/e2e/left-panel/left-panel.spec.ts index 3850df5cd07..cae6fd8934f 100644 --- a/playwright/e2e/left-panel/left-panel.spec.ts +++ b/playwright/e2e/left-panel/left-panel.spec.ts @@ -17,7 +17,7 @@ test.describe("LeftPanel", () => { // create rooms and check room names are correct for (const name of ["Apple", "Pineapple", "Orange"]) { await app.client.createRoom({ name }); - await expect(page.getByRole("treeitem", { name })).toBeVisible(); + await expect(page.getByRole("option", { name: `Open room ${name}` })).toBeVisible(); } }); }); diff --git a/playwright/e2e/read-receipts/index.ts b/playwright/e2e/read-receipts/index.ts index 067d3d16d2e..f93d2cf03e2 100644 --- a/playwright/e2e/read-receipts/index.ts +++ b/playwright/e2e/read-receipts/index.ts @@ -6,7 +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. */ -import type { JSHandle, Page } from "@playwright/test"; +import type { JSHandle, Locator, Page } from "@playwright/test"; import type { MatrixEvent, Room, IndexedDBStore, ReceiptType } from "matrix-js-sdk/src/matrix"; import { test as base, expect } from "../../element-web-test"; import { type Bot } from "../../pages/bot"; @@ -428,7 +428,7 @@ class Helpers { } getRoomListTile(label: string) { - return this.page.getByRole("treeitem", { name: new RegExp("^" + label) }); + return this.page.getByRole("option", { name: new RegExp("^Open room " + label) }); } /** @@ -446,8 +446,8 @@ class Helpers { */ async assertRead(room: RoomRef) { const tile = this.getRoomListTile(room.name); - await expect(tile.locator(".mx_NotificationBadge_dot")).not.toBeVisible(); - await expect(tile.locator(".mx_NotificationBadge_count")).not.toBeVisible(); + await expect(tile.getByTestId("notification-decoration")).not.toBeVisible(); + await expect(tile).not.toHaveAccessibleName(/with \d* unread message/); } /** @@ -463,15 +463,18 @@ class Helpers { /** * Assert a given room is marked as unread (via the room list tile) * @param room - the name of the room to check - * @param count - the numeric count to assert, or if "." specified then a bold/dot (no count) state is asserted + * @param count - the numeric count to assert */ - async assertUnread(room: RoomRef, count: number | ".") { + async assertUnread(room: RoomRef, count: number) { const tile = this.getRoomListTile(room.name); - if (count === ".") { - await expect(tile.locator(".mx_NotificationBadge_dot")).toBeVisible(); - } else { - await expect(tile.locator(".mx_NotificationBadge_count")).toHaveText(count.toString()); - } + await expect(tile).toBeVisible(); + await expect(tile).toHaveAccessibleName(/with \d* unread message/); + } + + async unreadCountForRoomTile(tile: Locator): Promise { + const accessibleName = await tile.getAttribute("aria-label"); + const match = accessibleName?.match(/(\d+)\s+unread message/); + return match ? parseInt(match[1], 10) : 0; } /** @@ -487,7 +490,7 @@ class Helpers { // .toBeLessThan doesn't have a retry mechanism, so we use .poll await expect .poll(async () => { - return parseInt(await tile.locator(".mx_NotificationBadge_count").textContent(), 10); + return this.unreadCountForRoomTile(tile); }) .toBeLessThan(lessThan); } @@ -505,7 +508,7 @@ class Helpers { // .toBeGreaterThan doesn't have a retry mechanism, so we use .poll await expect .poll(async () => { - return parseInt(await tile.locator(".mx_NotificationBadge_count").textContent(), 10); + return this.unreadCountForRoomTile(tile); }) .toBeGreaterThan(greaterThan); } @@ -596,24 +599,15 @@ class Helpers { await button.click(); } - /** - * Toggle the `Show rooms with unread messages first` option for the room list - */ - async toggleRoomUnreadOrder() { - await this.toggleRoomListMenu(); - await this.page.getByText("Show rooms with unread messages first").click(); - // Close contextual menu - await this.page.locator(".mx_ContextualMenu_background").click(); - } - /** * Assert that the room list is ordered as expected * @param rooms */ async assertRoomListOrder(rooms: Array<{ name: string }>) { - const roomList = this.page.locator(".mx_RoomTile_title"); + const roomListContainer = this.page.getByTestId("room-list"); + const roomTiles = roomListContainer.getByRole("option"); for (const [i, room] of rooms.entries()) { - await expect(roomList.nth(i)).toHaveText(room.name); + await expect(roomTiles.nth(i)).toHaveAccessibleName(new RegExp(`${room.name}`)); } } } diff --git a/playwright/e2e/read-receipts/read-receipts.spec.ts b/playwright/e2e/read-receipts/read-receipts.spec.ts index 8ebce22b52e..b1142bae59b 100644 --- a/playwright/e2e/read-receipts/read-receipts.spec.ts +++ b/playwright/e2e/read-receipts/read-receipts.spec.ts @@ -112,7 +112,7 @@ test.describe("Read receipts", { tag: "@mergequeue" }, () => { const main3 = await sendMessage(bot); // (So the room starts off unread) - await expect(page.getByLabel(`${otherRoomName} 3 unread messages.`)).toBeVisible(); + await expect(page.getByLabel(`${otherRoomName} with 3 unread messages.`)).toBeVisible(); // When we send a threaded receipt for the last event in main // And an unthreaded receipt for an earlier event @@ -147,13 +147,13 @@ test.describe("Read receipts", { tag: "@mergequeue" }, () => { await sendMessage(bot); // (The room starts off unread) - await expect(page.getByLabel(`${otherRoomName} 3 unread messages.`)).toBeVisible(); + await expect(page.getByLabel(`${otherRoomName} with 3 unread messages.`)).toBeVisible(); // When we send a threaded receipt for the second-last event in main await sendThreadedReadReceipt(app, main2); // Then the room has only one unread - await expect(page.getByLabel(`${otherRoomName} 1 unread message.`)).toBeVisible(); + await expect(page.getByLabel(`${otherRoomName} with 1 unread message.`)).toBeVisible(); }); test("Considers room read if there is only a main thread and we have a main receipt", async ({ @@ -166,7 +166,7 @@ test.describe("Read receipts", { tag: "@mergequeue" }, () => { await sendMessage(bot); const main3 = await sendMessage(bot); // (The room starts off unread) - await expect(page.getByLabel(`${otherRoomName} 3 unread messages.`)).toBeVisible(); + await expect(page.getByLabel(`${otherRoomName} with 3 unread messages.`)).toBeVisible(); // When we send a threaded receipt for the last event in main await sendThreadedReadReceipt(app, main3); @@ -186,7 +186,7 @@ test.describe("Read receipts", { tag: "@mergequeue" }, () => { const thread1a = await botSendThreadMessage(bot, main1.event_id); await botSendThreadMessage(bot, main1.event_id); // 1 unread on the main thread, 2 in the new thread that aren't shown - await expect(page.getByLabel(`${otherRoomName} 1 unread message.`)).toBeVisible(); + await expect(page.getByLabel(`${otherRoomName} with 1 unread message.`)).toBeVisible(); // When we send receipts for main, and the second-last in the thread await sendThreadedReadReceipt(app, main1); @@ -203,7 +203,7 @@ test.describe("Read receipts", { tag: "@mergequeue" }, () => { await botSendThreadMessage(bot, main1.event_id); const thread1b = await botSendThreadMessage(bot, main1.event_id); // 1 unread on the main thread, 2 in the new thread which don't show - await expect(page.getByLabel(`${otherRoomName} 1 unread message.`)).toBeVisible(); + await expect(page.getByLabel(`${otherRoomName} with 1 unread message.`)).toBeVisible(); // When we send receipts for main, and the last in the thread await sendThreadedReadReceipt(app, main1); @@ -226,7 +226,7 @@ test.describe("Read receipts", { tag: "@mergequeue" }, () => { const thread1a = await botSendThreadMessage(bot, main1.event_id); await botSendThreadMessage(bot, main1.event_id); // 1 unread on the main thread, 2 in the new thread which don't count - await expect(page.getByLabel(`${otherRoomName} 1 unread message.`)).toBeVisible(); + await expect(page.getByLabel(`${otherRoomName} with 1 unread message.`)).toBeVisible(); // When we send an unthreaded receipt for the second-last in the thread await sendUnthreadedReadReceipt(app, thread1a); @@ -251,7 +251,7 @@ test.describe("Read receipts", { tag: "@mergequeue" }, () => { const thread1b = await botSendThreadMessage(bot, main1.event_id); await sendMessage(bot); // 2 unreads on the main thread, 2 in the new thread which don't count - await expect(page.getByLabel(`${otherRoomName} 2 unread messages.`)).toBeVisible(); + await expect(page.getByLabel(`${otherRoomName} with 2 unread messages.`)).toBeVisible(); // When we send an unthreaded receipt for the last in the thread await sendUnthreadedReadReceipt(app, thread1b); @@ -259,7 +259,7 @@ test.describe("Read receipts", { tag: "@mergequeue" }, () => { // Then the room has only one unread - the one in the // main thread, because it is later than the unthreaded // receipt. - await expect(page.getByLabel(`${otherRoomName} 1 unread message.`)).toBeVisible(); + await expect(page.getByLabel(`${otherRoomName} with 1 unread message.`)).toBeVisible(); }); /** @@ -291,7 +291,9 @@ test.describe("Read receipts", { tag: "@mergequeue" }, () => { const uriEncodedLastMessageId = encodeURIComponent(lastMessageId); // wait until all messages have been received - await expect(page.getByLabel(`${otherRoomName} ${sendMessageResponses.length} unread messages.`)).toBeVisible(); + await expect( + page.getByLabel(`${otherRoomName} with ${sendMessageResponses.length} unread messages.`), + ).toBeVisible(); // switch to the room with the messages await page.goto(`/#/room/${otherRoomId}`); diff --git a/playwright/e2e/read-receipts/room-list-order.spec.ts b/playwright/e2e/read-receipts/room-list-order.spec.ts index e940c45b878..405cdf22ed8 100644 --- a/playwright/e2e/read-receipts/room-list-order.spec.ts +++ b/playwright/e2e/read-receipts/room-list-order.spec.ts @@ -12,7 +12,7 @@ import { test } from "."; test.describe("Read receipts", { tag: "@mergequeue" }, () => { test.describe("Room list order", () => { - test("Rooms with unread messages appear at the top of room list if 'unread first' is selected", async ({ + test("Rooms with unread messages appear at the top of room list with default 'activity' ordering", async ({ roomAlpha: room1, roomBeta: room2, util, @@ -22,15 +22,18 @@ test.describe("Read receipts", { tag: "@mergequeue" }, () => { await util.goTo(room2); // Display the unread first room - await util.toggleRoomUnreadOrder(); await util.receiveMessages(room1, ["Msg1"]); await page.reload(); + // switch rooms so they can re-order in the list + await util.goTo(room1); + // Room 1 has an unread message and should be displayed first + // (as the default is to sort by activity) await util.assertRoomListOrder([room1, room2]); }); - test("Rooms with unread threads appear at the top of room list if 'unread first' is selected", async ({ + test("Rooms with unread threads appear at the top of room list with default 'activity' order", async ({ roomAlpha: room1, roomBeta: room2, util, @@ -42,7 +45,6 @@ test.describe("Read receipts", { tag: "@mergequeue" }, () => { await util.assertRead(room1); // Display the unread first room - await util.toggleRoomUnreadOrder(); await util.receiveMessages(room1, [msg.threadedOff("Msg1", "Resp1")]); await util.saveAndReload(); diff --git a/playwright/e2e/room/create-room.spec.ts b/playwright/e2e/room/create-room.spec.ts index a5c1004c6d0..9424ee4e328 100644 --- a/playwright/e2e/room/create-room.spec.ts +++ b/playwright/e2e/room/create-room.spec.ts @@ -46,7 +46,7 @@ test.describe("Create Room", () => { test("should allow us to start a chat and show encryption state", async ({ page, user, app }) => { await page.getByRole("button", { name: "Add", exact: true }).click(); - await page.getByText("Start new chat").click(); + await page.getByRole("menuitem", { name: "Start chat" }).click(); await page.getByTestId("invite-dialog-input").fill(user.userId); diff --git a/playwright/e2e/room/room-header.spec.ts b/playwright/e2e/room/room-header.spec.ts index 5f14bfc85fa..2f681fe3d36 100644 --- a/playwright/e2e/room/room-header.spec.ts +++ b/playwright/e2e/room/room-header.spec.ts @@ -15,6 +15,11 @@ import { type ElementAppPage } from "../../pages/ElementAppPage"; test.describe("Room Header", () => { test.use({ displayName: "Sakura", + config: { + features: { + feature_new_room_list: false, + }, + }, }); test.describe("with feature_notifications enabled", () => { @@ -23,7 +28,7 @@ test.describe("Room Header", () => { }); test("should render default buttons properly", { tag: "@screenshot" }, async ({ page, app, user }) => { await app.client.createRoom({ name: "Test Room" }); - await app.viewRoomByName("Test Room"); + await app.viewRoomByNameOnOldRoomList("Test Room"); const header = page.locator(".mx_RoomHeader"); @@ -61,7 +66,7 @@ test.describe("Room Header", () => { "officia deserunt mollit anim id est laborum."; await app.client.createRoom({ name: LONG_ROOM_NAME }); - await app.viewRoomByName(LONG_ROOM_NAME); + await app.viewRoomByNameOnOldRoomList(LONG_ROOM_NAME); const header = page.locator(".mx_RoomHeader"); // Wait until the room name is set @@ -86,7 +91,7 @@ test.describe("Room Header", () => { test("should render room header icon correctly", { tag: "@screenshot" }, async ({ page, app, user }) => { await app.client.createRoom({ name: "Test Room", visibility: "public" as Visibility }); - await app.viewRoomByName("Test Room"); + await app.viewRoomByNameOnOldRoomList("Test Room"); const header = page.locator(".mx_RoomHeader"); @@ -106,7 +111,7 @@ test.describe("Room Header", () => { await page.getByRole("button", { name: "Create video room" }).click(); - await app.viewRoomByName("Test video room"); + await app.viewRoomByNameOnOldRoomList("Test video room"); }; test.describe("and with feature_notifications enabled", () => { diff --git a/playwright/e2e/room_options/marked_unread.spec.ts b/playwright/e2e/room_options/marked_unread.spec.ts index 2817bbc921a..911404e881e 100644 --- a/playwright/e2e/room_options/marked_unread.spec.ts +++ b/playwright/e2e/room_options/marked_unread.spec.ts @@ -34,7 +34,7 @@ test.describe("Mark as Unread", () => { await bot.sendMessage(roomId, "I am a robot. Beep."); // Regular notification on new message - await expect(page.getByLabel(TEST_ROOM_NAME + " 1 unread message.")).toBeVisible(); + await expect(page.getByLabel(`Open room ${TEST_ROOM_NAME} with 1 unread message.`)).toBeVisible(); await expect(page).toHaveTitle("Element [1]"); await page.goto("/#/room/" + roomId); @@ -48,9 +48,12 @@ test.describe("Mark as Unread", () => { const roomTile = page.getByLabel(TEST_ROOM_NAME); await roomTile.focus(); - await roomTile.getByRole("button", { name: "Room options" }).click(); + await roomTile.getByRole("button", { name: "More Options" }).click(); await page.getByRole("menuitem", { name: "Mark as unread" }).click(); - await expect(page.getByLabel(TEST_ROOM_NAME + " Unread messages.")).toBeVisible(); + // focus the user menu to avoid to have hover decoration + await page.getByRole("button", { name: "User menu" }).focus(); + + await expect(roomTile.getByTestId("notification-decoration")).toBeVisible(); }); }); diff --git a/playwright/e2e/sliding-sync/sliding-sync.spec.ts b/playwright/e2e/sliding-sync/sliding-sync.spec.ts index b540cd11d51..d7ef96dae99 100644 --- a/playwright/e2e/sliding-sync/sliding-sync.spec.ts +++ b/playwright/e2e/sliding-sync/sliding-sync.spec.ts @@ -6,7 +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. */ -import { type Page, type Request } from "@playwright/test"; +import { type Locator, type Page, type Request } from "@playwright/test"; import { test as base, expect } from "../../element-web-test"; import type { ElementAppPage } from "../../pages/ElementAppPage"; @@ -38,7 +38,7 @@ const test = base.extend<{ test.describe("Sliding Sync", () => { const checkOrder = async (wantOrder: string[], page: Page) => { - await expect(page.getByRole("group", { name: "Rooms" }).locator(".mx_RoomTile_title")).toHaveText(wantOrder); + await expect(page.getByTestId("room-list").locator(".mx_RoomListItemView_text")).toHaveText(wantOrder); }; const bumpRoom = async (roomId: string, app: ElementAppPage) => { @@ -50,6 +50,18 @@ test.describe("Sliding Sync", () => { }); }; + function getPrimaryFilters(page: Page): Locator { + return page.getByTestId("primary-filters"); + } + + function getRoomOptionsMenu(page: Page): Locator { + return page.getByRole("button", { name: "Room Options" }); + } + + function getFilterExpandButton(page: Page): Locator { + return getPrimaryFilters(page).getByRole("button", { name: "Expand filter list" }); + } + test.use({ config: { features: { @@ -69,20 +81,15 @@ test.describe("Sliding Sync", () => { // create rooms and check room names are correct for (const fruit of ["Apple", "Pineapple", "Orange"]) { await app.client.createRoom({ name: fruit }); - await expect(page.getByRole("treeitem", { name: fruit })).toBeVisible(); + await expect(page.getByRole("option", { name: `Open room ${fruit}` })).toBeVisible(); } - + const roomList = page.getByTestId("room-list"); // Check count, 3 fruits + 1 testRoom = 4 - await expect(page.locator(".mx_RoomSublist_tiles").getByRole("treeitem")).toHaveCount(4); + await expect(roomList.getByRole("option")).toHaveCount(4); await checkOrder(["Orange", "Pineapple", "Apple", "Test Room"], page); - const locator = page.getByRole("group", { name: "Rooms" }).locator(".mx_RoomSublist_headerContainer"); - await locator.hover(); - await locator.getByRole("button", { name: "List options" }).click(); - - // force click as the radio button's size is zero - await page.getByRole("menuitemradio", { name: "A-Z" }).dispatchEvent("click"); - await expect(page.locator(".mx_StyledRadioButton_checked").getByText("A-Z")).toBeVisible(); + await getRoomOptionsMenu(page).click(); + await page.getByRole("menuitemradio", { name: "A-Z" }).click(); await checkOrder(["Apple", "Orange", "Pineapple", "Test Room"], page); }); @@ -93,11 +100,11 @@ test.describe("Sliding Sync", () => { for (const fruit of ["Apple", "Pineapple", "Orange"]) { const id = await app.client.createRoom({ name: fruit }); roomIds.push(id); - await expect(page.getByRole("treeitem", { name: fruit })).toBeVisible(); + await expect(page.getByRole("option", { name: `Open room ${fruit}` })).toBeVisible(); } // Select the Test Room - await page.getByRole("treeitem", { name: "Test Room" }).click(); + await page.getByRole("option", { name: "Open room Test Room" }).click(); const [apple, pineapple, orange] = roomIds; await checkOrder(["Orange", "Pineapple", "Apple", "Test Room"], page); await bumpRoom(apple, app); @@ -116,7 +123,7 @@ test.describe("Sliding Sync", () => { for (const fruit of ["Apple", "Pineapple", "Orange"]) { const id = await app.client.createRoom({ name: fruit }); roomIds.push(id); - await expect(page.getByRole("treeitem", { name: fruit })).toBeVisible(); + await expect(page.getByRole("option", { name: `Open room ${fruit}` })).toBeVisible(); } // Given a list of Orange, Pineapple, Apple - if Pineapple is active and a message is sent in Apple, the list should @@ -124,7 +131,7 @@ test.describe("Sliding Sync", () => { // be Apple, Orange Pineapple - only when you click on a different room do things reshuffle. // Select the Pineapple room - await page.getByRole("treeitem", { name: "Pineapple" }).click(); + await page.getByRole("option", { name: "Open room Pineapple" }).click(); await checkOrder(["Orange", "Pineapple", "Apple", "Test Room"], page); // Move Apple @@ -132,7 +139,7 @@ test.describe("Sliding Sync", () => { await checkOrder(["Apple", "Pineapple", "Orange", "Test Room"], page); // Select the Test Room - await page.getByRole("treeitem", { name: "Test Room" }).click(); + await page.getByRole("option", { name: "Open room Test Room" }).click(); // the rooms reshuffle to match reality await checkOrder(["Apple", "Orange", "Pineapple", "Test Room"], page); @@ -142,25 +149,20 @@ test.describe("Sliding Sync", () => { // send a message in the test room: unread notification count should increment await bob.sendMessage(testRoom.roomId, "Hello World"); - const treeItemLocator1 = page.getByRole("treeitem", { name: "Test Room 1 unread message." }); - await expect(treeItemLocator1.locator(".mx_NotificationBadge_count")).toHaveText("1"); - // await expect(page.locator(".mx_NotificationBadge")).not.toHaveClass("mx_NotificationBadge_highlighted"); - await expect(treeItemLocator1.locator(".mx_NotificationBadge")).not.toHaveClass( - /mx_NotificationBadge_highlighted/, - ); + const itemLocator1 = page.getByRole("option", { name: "Open room David Langley with 1 unread message." }); + await expect(itemLocator1.getByTestId("notification-decoration")).toHaveText("1"); // send an @mention: highlight count (red) should be 2. await bob.sendMessage(testRoom.roomId, `Hello ${user.displayName}`); - const treeItemLocator2 = page.getByRole("treeitem", { - name: "Test Room 2 unread messages including mentions.", + const itemLocator2 = page.getByRole("treeitem", { + name: "Open room Test Room 2 unread messages including mentions.", }); - await expect(treeItemLocator2.locator(".mx_NotificationBadge_count")).toHaveText("2"); - await expect(treeItemLocator2.locator(".mx_NotificationBadge")).toHaveClass(/mx_NotificationBadge_highlighted/); + await expect(itemLocator2.getByTestId("notification-decoration")).toHaveText("2"); // click on the room, the notif counts should disappear - await page.getByRole("treeitem", { name: "Test Room 2 unread messages including mentions." }).click(); + await page.getByRole("option", { name: "Open room Test Room 2 unread messages including mentions." }).click(); await expect( - page.getByRole("treeitem", { name: "Test Room" }).locator("mx_NotificationBadge_count"), + page.getByRole("option", { name: "Open room Test Room" }).getByTestId("notification-decoration"), ).not.toBeAttached(); }); @@ -175,7 +177,9 @@ test.describe("Sliding Sync", () => { // wait for this message to arrive, tell by the room list resorting await checkOrder(["Test Room", "Dummy"], page); - await expect(page.getByRole("treeitem", { name: "Test Room" }).locator(".mx_NotificationBadge")).toBeAttached(); + await expect( + page.getByRole("option", { name: "Open room Test Room" }).getByTestId("notification-decoration"), + ).toBeAttached(); }); test("should update user settings promptly", async ({ page, app }) => { @@ -193,7 +197,7 @@ test.describe("Sliding Sync", () => { for (const fruit of ["Apple", "Pineapple", "Orange"]) { const id = await app.client.createRoom({ name: fruit }); roomIds.push(id); - await expect(page.getByRole("treeitem", { name: fruit })).toBeVisible(); + await expect(page.getByRole("option", { name: `Open room ${fruit}` })).toBeVisible(); } const [roomAId, roomPId] = roomIds; @@ -206,7 +210,7 @@ test.describe("Sliding Sync", () => { // 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(), + page.getByRole("option", { name: "Open room Apple", exact: true }).click(), ]); const roomSubscriptions = request.postDataJSON().room_subscriptions; expect(roomSubscriptions, "room_subscriptions is object").toBeDefined(); @@ -214,7 +218,7 @@ test.describe("Sliding Sync", () => { // Switch to another room and wait for playwright to get the request await Promise.all([ page.waitForRequest(matchRoomSubRequest(roomPId)), - page.getByRole("treeitem", { name: "Pineapple", exact: true }).click(), + page.getByRole("option", { name: "Open room Pineapple", exact: true }).click(), ]); }); @@ -240,34 +244,29 @@ test.describe("Sliding Sync", () => { { roomNames, clientUserId }, ); - await expect( - page.getByRole("group", { name: "Invites" }).locator(".mx_RoomSublist_tiles").getByRole("treeitem"), - ).toHaveCount(3); + await getFilterExpandButton(page).click(); + const primaryFilters = getPrimaryFilters(page); + await primaryFilters.getByRole("option", { name: "Invites" }).click(); + + await expect(page.getByTestId("room-list").getByRole("option")).toHaveCount(3); // Select the room to join - await page.getByRole("treeitem", { name: "Room to Join" }).click(); + await page.getByRole("option", { name: "Open room Room to Join" }).click(); // Accept the invite await page.locator(".mx_RoomView").getByRole("button", { name: "Accept" }).click(); - await checkOrder(["Room to Join", "Test Room"], page); + await checkOrder(["Room to Rescind", "Room to Reject"], page); // Select the room to reject - await page.getByRole("treeitem", { name: "Room to Reject" }).click(); + await page.getByRole("option", { name: "Open room Room to Reject" }).click(); // Decline the invite await page.locator(".mx_RoomView").getByRole("button", { name: "Decline", exact: true }).click(); - await expect( - page.getByRole("group", { name: "Invites" }).locator(".mx_RoomSublist_tiles").getByRole("treeitem"), - ).toHaveCount(2); + await expect(page.getByTestId("room-list").getByRole("option")).toHaveCount(1); - // check the lists are correct - await checkOrder(["Room to Join", "Test Room"], page); - - const titleLocator = page.getByRole("group", { name: "Invites" }).locator(".mx_RoomTile_title"); - await expect(titleLocator).toHaveCount(1); - await expect(titleLocator).toHaveText("Room to Rescind"); + await expect(page.getByRole("option", { name: "Open room Room to Rescind" })).toBeVisible(); // now rescind the invite await bot.evaluate( @@ -277,10 +276,14 @@ test.describe("Sliding Sync", () => { { roomRescind, clientUserId }, ); + await page.getByRole("option", { name: "Open room Room to Rescind" }).click(); + + await page.locator(".mx_RoomView").getByRole("button", { name: "Forget this room", exact: true }).click(); + + await primaryFilters.getByRole("option", { name: "Invites" }).click(); + // Wait for the rescind to take effect and check the joined list once more - await expect( - page.getByRole("group", { name: "Rooms" }).locator(".mx_RoomSublist_tiles").getByRole("treeitem"), - ).toHaveCount(2); + await expect(page.getByTestId("room-list").getByRole("option")).toHaveCount(2); await checkOrder(["Room to Join", "Test Room"], page); }); @@ -293,19 +296,27 @@ test.describe("Sliding Sync", () => { await app.client.evaluate(async (client, roomId) => { await client.setRoomTag(roomId, "m.favourite", { order: 0.5 }); }, roomId); - await expect(page.getByRole("group", { name: "Favourites" }).getByText("Favourite DM")).toBeVisible(); - await expect(page.getByRole("group", { name: "People" }).getByText("Favourite DM")).not.toBeAttached(); + + await getFilterExpandButton(page).click(); + const primaryFilters = getPrimaryFilters(page); + await primaryFilters.getByRole("option", { name: "Favourites" }).click(); + + await expect(page.getByRole("option", { name: "Favourite DM" })).toBeVisible(); + + await primaryFilters.getByRole("option", { name: "People" }).click(); + + await expect(page.getByRole("option", { name: "Favourite DM" })).not.toBeAttached(); }); // Regression test for a bug in SS mode, but would be useful to have in non-SS mode too. // This ensures we are setting RoomViewStore state correctly. test("should clear the reply to field when swapping rooms", async ({ page, app, testRoom }) => { await app.client.createRoom({ name: "Other Room" }); - await expect(page.getByRole("treeitem", { name: "Other Room" })).toBeVisible(); + await expect(page.getByRole("option", { name: "Open room Other Room" })).toBeVisible(); await app.client.sendMessage(testRoom.roomId, "Hello world"); // select the room - await page.getByRole("treeitem", { name: "Test Room" }).click(); + await page.getByRole("option", { name: "Open room Test Room" }).click(); await expect(page.locator(".mx_ReplyPreview")).not.toBeAttached(); @@ -318,13 +329,13 @@ test.describe("Sliding Sync", () => { await expect(page.locator(".mx_ReplyPreview")).toBeVisible(); // now click Other Room - await page.getByRole("treeitem", { name: "Other Room" }).click(); + await page.getByRole("option", { name: "Open room Other Room" }).click(); // ensure the reply-to disappears await expect(page.locator(".mx_ReplyPreview")).not.toBeAttached(); // click back - await page.getByRole("treeitem", { name: "Test Room" }).click(); + await page.getByRole("option", { name: "Open room Test Room" }).click(); // ensure the reply-to reappears await expect(page.locator(".mx_ReplyPreview")).toBeVisible(); @@ -338,7 +349,7 @@ test.describe("Sliding Sync", () => { await app.client.sendMessage(testRoom.roomId, "Reply to me"); // select the room - await page.getByRole("treeitem", { name: "Test Room" }).click(); + await page.getByRole("option", { name: "Open room Test Room" }).click(); await expect(page.locator(".mx_ReplyPreview")).not.toBeAttached(); // click reply-to on the Reply to me message diff --git a/playwright/e2e/spaces/spaces.spec.ts b/playwright/e2e/spaces/spaces.spec.ts index 3eaae8544f5..19e619e9c69 100644 --- a/playwright/e2e/spaces/spaces.spec.ts +++ b/playwright/e2e/spaces/spaces.spec.ts @@ -96,9 +96,9 @@ test.describe("Spaces", () => { await page.getByRole("button", { name: "Go to my first room" }).click(); // Assert rooms exist in the room list - await expect(page.getByRole("treeitem", { name: "General" })).toBeVisible(); - await expect(page.getByRole("treeitem", { name: "Random" })).toBeVisible(); - await expect(page.getByRole("treeitem", { name: "Jokes" })).toBeVisible(); + await expect(page.getByRole("option", { name: "General" })).toBeVisible(); + await expect(page.getByRole("option", { name: "Random" })).toBeVisible(); + await expect(page.getByRole("option", { name: "Jokes" })).toBeVisible(); }, ); @@ -127,10 +127,10 @@ test.describe("Spaces", () => { await page.getByRole("button", { name: "Skip for now" }).click(); // Assert rooms exist in the room list - const roomList = page.getByRole("tree", { name: "Rooms" }); - await expect(roomList.getByRole("treeitem", { name: "General", exact: true })).toBeVisible(); - await expect(roomList.getByRole("treeitem", { name: "Random", exact: true })).toBeVisible(); - await expect(roomList.getByRole("treeitem", { name: "Projects", exact: true })).toBeVisible(); + const roomList = page.getByRole("listbox", { name: "Room list", exact: true }); + await expect(roomList.getByRole("option", { name: "General" })).toBeVisible(); + await expect(roomList.getByRole("option", { name: "Random" })).toBeVisible(); + await expect(roomList.getByRole("option", { name: "Projects" })).toBeVisible(); // Assert rooms exist in the space explorer await expect( @@ -200,7 +200,7 @@ test.describe("Spaces", () => { await page.getByRole("button", { name: "Skip for now" }).click(); - await page.getByRole("button", { name: "Add room" }).click(); + await page.getByRole("main").getByRole("button", { name: "Add" }).click(); await page.getByRole("menuitem", { name: "Add existing room" }).click(); await page.getByRole("checkbox", { name: "Sample Room" }).click(); @@ -424,10 +424,10 @@ test.describe("Spaces", () => { await page.getByRole("button", { name: "Skip for now" }).click(); // Assert rooms exist in the room list - const roomList = page.getByRole("tree", { name: "Rooms" }); - await expect(roomList.getByRole("treeitem", { name: "General", exact: true })).toBeVisible(); - await expect(roomList.getByRole("treeitem", { name: "Random", exact: true })).toBeVisible(); - await expect(roomList.getByRole("treeitem", { name: "Projects", exact: true })).toBeVisible(); + const roomList = page.getByRole("listbox", { name: "Room list", exact: true }); + await expect(roomList.getByRole("option", { name: "General" })).toBeVisible(); + await expect(roomList.getByRole("option", { name: "Random" })).toBeVisible(); + await expect(roomList.getByRole("option", { name: "Projects" })).toBeVisible(); // Assert rooms exist in the space explorer await expect( diff --git a/playwright/e2e/spaces/threads-activity-centre/index.ts b/playwright/e2e/spaces/threads-activity-centre/index.ts index a050175c83a..cf889f64ccc 100644 --- a/playwright/e2e/spaces/threads-activity-centre/index.ts +++ b/playwright/e2e/spaces/threads-activity-centre/index.ts @@ -377,7 +377,7 @@ export class Helpers { * Expand the space panel */ expandSpacePanel() { - return this.page.getByRole("button", { name: "Expand" }).click(); + return this.page.getByRole("navigation", { name: "Spaces" }).getByRole("button", { name: "Expand" }).click(); } /** diff --git a/playwright/e2e/spotlight/spotlight.spec.ts b/playwright/e2e/spotlight/spotlight.spec.ts index 7a5f7d4ea85..e07643c193d 100644 --- a/playwright/e2e/spotlight/spotlight.spec.ts +++ b/playwright/e2e/spotlight/spotlight.spec.ts @@ -36,7 +36,7 @@ async function startDM(app: ElementAppPage, page: Page, name: string): Promise { // Assert DM exists by checking for the first message and the room being in the room list await expect(page.locator(".mx_EventTile_body").filter({ hasText: "Hey!" })).toBeAttached({ timeout: 3000 }); - await expect(page.getByRole("group", { name: "People" })).toContainText(bot2.credentials.displayName); + await expect( + page.getByTestId("room-list").getByRole("option", { name: `Open room ${bot2.credentials.displayName}` }), + ).toBeVisible(); // Invite BotBob into existing DM with ByteBot const dmRooms = await app.client.evaluate((client, userId) => { @@ -279,7 +281,9 @@ test.describe("Spotlight", () => { const groupDmName = await app.client.evaluate((client, id) => client.getRoom(id).name, dmRooms[0]); await app.client.inviteUser(dmRooms[0], bot1.credentials.userId); await expect(roomHeaderName(page).first()).toContainText(groupDmName); - await expect(page.getByRole("group", { name: "People" }).first()).toContainText(groupDmName); + await expect( + page.getByTestId("room-list").getByRole("option", { name: `Open room ${groupDmName}` }), + ).toBeVisible(); // Search for BotBob by id, should return group DM and user spotlight = await app.openSpotlight(); diff --git a/playwright/e2e/timeline/media-preview-settings.spec.ts b/playwright/e2e/timeline/media-preview-settings.spec.ts index e32a7dbc82c..617aa08c09f 100644 --- a/playwright/e2e/timeline/media-preview-settings.spec.ts +++ b/playwright/e2e/timeline/media-preview-settings.spec.ts @@ -50,9 +50,12 @@ test.describe("Media preview settings", () => { } `, }); - await expect( - page.getByRole("tree", { name: "Rooms" }).getByRole("treeitem", { name: "Test room" }), - ).toMatchScreenshot("invite-room-tree-no-avatar.png"); + + const testRoomTile = page + .getByRole("listbox", { name: "Room list" }) + .getByRole("option", { name: "Test room" }); + await expect(testRoomTile).toBeVisible(); + await expect(testRoomTile).toMatchScreenshot("invite-room-tree-no-avatar.png"); // And then go back to being visible settings = await app.settings.openUserSettings("Preferences"); @@ -70,9 +73,7 @@ test.describe("Media preview settings", () => { } `, }); - await expect( - page.getByRole("tree", { name: "Rooms" }).getByRole("treeitem", { name: "Test room" }), - ).toMatchScreenshot("invite-room-tree-with-avatar.png"); + await expect(testRoomTile).toMatchScreenshot("invite-room-tree-with-avatar.png"); }); test("should be able to hide media in rooms globally", async ({ page, app, room, user }) => { diff --git a/playwright/e2e/voip/pstn.spec.ts b/playwright/e2e/voip/pstn.spec.ts index 9a35d9b9c3d..0275b88067b 100644 --- a/playwright/e2e/voip/pstn.spec.ts +++ b/playwright/e2e/voip/pstn.spec.ts @@ -24,7 +24,7 @@ test.describe("PSTN", () => { await toasts.rejectToast("Notifications"); await toasts.assertNoToasts(); - await expect(page.locator(".mx_LeftPanel_filterContainer")).toMatchScreenshot("dialpad-trigger.png"); + await expect(page.locator(".mx_RoomListSearch")).toMatchScreenshot("dialpad-trigger.png"); await page.getByLabel("Open dial pad").click(); await expect(page.locator(".mx_Dialog")).toMatchScreenshot("dialpad.png"); }); diff --git a/playwright/pages/ElementAppPage.ts b/playwright/pages/ElementAppPage.ts index bba0ec5a214..816583fd497 100644 --- a/playwright/pages/ElementAppPage.ts +++ b/playwright/pages/ElementAppPage.ts @@ -51,9 +51,10 @@ export class ElementAppPage { /** * Open room creation dialog. */ + 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(); + await this.page.getByRole("navigation", { name: "Room list" }).getByRole("button", { name: "Add" }).click(); + await this.page.getByRole("menuitem", { name: roomKindname }).click(); return this.page.locator(".mx_CreateRoomDialog"); } @@ -70,12 +71,23 @@ export class ElementAppPage { /** * Opens the given room by name. The room must be visible in the + * room list and the room may contain unread messages. + * + * @param name The exact room name to find and click on/open. + */ + public async viewRoomByName(name: string): Promise { + // We get the room list by test-id which is a listbox and matching title=name + return this.page.getByTestId("room-list").locator(`[title="${name}"]`).first().click(); + } + + /** + * Opens the given room on the old room list by name. The room must be visible in the * room list, but the room list may be folded horizontally, and the * room may contain unread messages. * * @param name The exact room name to find and click on/open. */ - public async viewRoomByName(name: string): Promise { + public async viewRoomByNameOnOldRoomList(name: string): Promise { // We look for the room inside the room list, which is a tree called Rooms. // // There are 3 cases: diff --git a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--dark-theme--bubble-layout-linux.png b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--dark-theme--bubble-layout-linux.png index 17bc4bfc785..03d2084fdbb 100644 Binary files a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--dark-theme--bubble-layout-linux.png and b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--dark-theme--bubble-layout-linux.png differ diff --git a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--dark-theme--group-layout-linux.png b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--dark-theme--group-layout-linux.png index 30e0de96ce0..d1edd45eb8b 100644 Binary files a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--dark-theme--group-layout-linux.png and b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--dark-theme--group-layout-linux.png differ diff --git a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--dark-theme--irc-layout-linux.png b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--dark-theme--irc-layout-linux.png index f2fd0de1145..ad25839e87d 100644 Binary files a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--dark-theme--irc-layout-linux.png and b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--dark-theme--irc-layout-linux.png differ diff --git a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--high-contrast--bubble-layout-linux.png b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--high-contrast--bubble-layout-linux.png index ab9b63960dd..933c790e3de 100644 Binary files a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--high-contrast--bubble-layout-linux.png and b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--high-contrast--bubble-layout-linux.png differ diff --git a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--high-contrast--group-layout-linux.png b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--high-contrast--group-layout-linux.png index 7e6137c4eb4..bba9a07cf10 100644 Binary files a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--high-contrast--group-layout-linux.png and b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--high-contrast--group-layout-linux.png differ diff --git a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--high-contrast--irc-layout-linux.png b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--high-contrast--irc-layout-linux.png index 519a46371d3..585d8cb5ee4 100644 Binary files a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--high-contrast--irc-layout-linux.png and b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--high-contrast--irc-layout-linux.png differ diff --git a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--bubble-layout-linux.png b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--bubble-layout-linux.png index 0a299b63d10..7cd3f0c8719 100644 Binary files a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--bubble-layout-linux.png and b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--bubble-layout-linux.png differ diff --git a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--group-layout-linux.png b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--group-layout-linux.png index 83078098728..195c907273d 100644 Binary files a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--group-layout-linux.png and b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--group-layout-linux.png differ diff --git a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--irc-layout-linux.png b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--irc-layout-linux.png index f57a1e27a61..fccee422d7b 100644 Binary files a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--irc-layout-linux.png and b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--irc-layout-linux.png differ diff --git a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--monospace-font--bubble-layout-linux.png b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--monospace-font--bubble-layout-linux.png index 8a6dec92735..d54c186e2da 100644 Binary files a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--monospace-font--bubble-layout-linux.png and b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--monospace-font--bubble-layout-linux.png differ diff --git a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--monospace-font--group-layout-linux.png b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--monospace-font--group-layout-linux.png index b6a2ed0bfc4..92ad8df33fd 100644 Binary files a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--monospace-font--group-layout-linux.png and b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--monospace-font--group-layout-linux.png differ diff --git a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--monospace-font--irc-layout-linux.png b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--monospace-font--irc-layout-linux.png index c59ef184c4b..c2972f34db2 100644 Binary files a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--monospace-font--irc-layout-linux.png and b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player--light-theme--monospace-font--irc-layout-linux.png differ diff --git a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-bubble-layout-linux.png b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-bubble-layout-linux.png index 9d863939327..4e77b7d094a 100644 Binary files a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-bubble-layout-linux.png and b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-bubble-layout-linux.png differ diff --git a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-chain-bubble-layout-linux.png b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-chain-bubble-layout-linux.png index 470366cb9bb..d5f4e7a7cac 100644 Binary files a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-chain-bubble-layout-linux.png and b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-chain-bubble-layout-linux.png differ diff --git a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-chain-group-layout-linux.png b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-chain-group-layout-linux.png index 2dac381c780..e9fca0d76ba 100644 Binary files a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-chain-group-layout-linux.png and b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-chain-group-layout-linux.png differ diff --git a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-chain-irc-layout-linux.png b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-chain-irc-layout-linux.png index b09c0ceed41..f9fe2e8c943 100644 Binary files a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-chain-irc-layout-linux.png and b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-chain-irc-layout-linux.png differ diff --git a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-group-layout-linux.png b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-group-layout-linux.png index 16f51d0262a..52357bc9e4d 100644 Binary files a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-group-layout-linux.png and b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-group-layout-linux.png differ diff --git a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-irc-layout-linux.png b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-irc-layout-linux.png index 1952c0681d9..11e94992989 100644 Binary files a/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-irc-layout-linux.png and b/playwright/snapshots/audio-player/audio-player.spec.ts/Selected-EventTile-of-audio-player-with-a-reply-irc-layout-linux.png differ diff --git a/playwright/snapshots/composer/CIDER.spec.ts/mention-linux.png b/playwright/snapshots/composer/CIDER.spec.ts/mention-linux.png index d3b948956ea..8098757abae 100644 Binary files a/playwright/snapshots/composer/CIDER.spec.ts/mention-linux.png and b/playwright/snapshots/composer/CIDER.spec.ts/mention-linux.png differ diff --git a/playwright/snapshots/crypto/toasts.spec.ts/key-storage-out-of-sync-toast-linux.png b/playwright/snapshots/crypto/toasts.spec.ts/key-storage-out-of-sync-toast-linux.png index 8cf3cb7d698..9579ed87a55 100644 Binary files a/playwright/snapshots/crypto/toasts.spec.ts/key-storage-out-of-sync-toast-linux.png and b/playwright/snapshots/crypto/toasts.spec.ts/key-storage-out-of-sync-toast-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/basic-message-ltr-ltrdisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/basic-message-ltr-ltrdisplayname-linux.png index 98310517688..9a29c3994c6 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/basic-message-ltr-ltrdisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/basic-message-ltr-ltrdisplayname-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/basic-message-ltr-rtldisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/basic-message-ltr-rtldisplayname-linux.png index c1f4477d665..3fbe91e49a9 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/basic-message-ltr-rtldisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/basic-message-ltr-rtldisplayname-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/basic-message-rtl-ltrdisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/basic-message-rtl-ltrdisplayname-linux.png index 59b9fc41e82..680f5e2f289 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/basic-message-rtl-ltrdisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/basic-message-rtl-ltrdisplayname-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/basic-message-rtl-rtldisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/basic-message-rtl-rtldisplayname-linux.png index 07f007545c4..8d1721a0af9 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/basic-message-rtl-rtldisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/basic-message-rtl-rtldisplayname-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/edited-message-ltr-ltrdisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/edited-message-ltr-ltrdisplayname-linux.png index d8b02a028ba..d93f7250f37 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/edited-message-ltr-ltrdisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/edited-message-ltr-ltrdisplayname-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/edited-message-ltr-rtldisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/edited-message-ltr-rtldisplayname-linux.png index e694dde7c67..cc50f3bdb0e 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/edited-message-ltr-rtldisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/edited-message-ltr-rtldisplayname-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/edited-message-rtl-ltrdisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/edited-message-rtl-ltrdisplayname-linux.png index 8c2e2d153be..7be9d08d550 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/edited-message-rtl-ltrdisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/edited-message-rtl-ltrdisplayname-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/edited-message-rtl-rtldisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/edited-message-rtl-rtldisplayname-linux.png index 4bb04ba2792..22ba802f899 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/edited-message-rtl-rtldisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/edited-message-rtl-rtldisplayname-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/emote-ltr-ltrdisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/emote-ltr-ltrdisplayname-linux.png index 5ab0a7e88f6..12294041afa 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/emote-ltr-ltrdisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/emote-ltr-ltrdisplayname-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/emote-ltr-rtldisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/emote-ltr-rtldisplayname-linux.png index c711b21a582..22ae3e6c99d 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/emote-ltr-rtldisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/emote-ltr-rtldisplayname-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/emote-rich-ltr-ltrdisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/emote-rich-ltr-ltrdisplayname-linux.png index c3501583f89..ea9840bf73e 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/emote-rich-ltr-ltrdisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/emote-rich-ltr-ltrdisplayname-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/emote-rich-ltr-rtldisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/emote-rich-ltr-rtldisplayname-linux.png index b92c4691d3b..9d66f951f26 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/emote-rich-ltr-rtldisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/emote-rich-ltr-rtldisplayname-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/emote-rich-rtl-ltrdisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/emote-rich-rtl-ltrdisplayname-linux.png index c727b98745e..d40c1e2c7af 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/emote-rich-rtl-ltrdisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/emote-rich-rtl-ltrdisplayname-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/emote-rich-rtl-rtldisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/emote-rich-rtl-rtldisplayname-linux.png index bd1baed9aa1..d07506957f0 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/emote-rich-rtl-rtldisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/emote-rich-rtl-rtldisplayname-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/emote-rtl-ltrdisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/emote-rtl-ltrdisplayname-linux.png index b55925218db..88ced478ef8 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/emote-rtl-ltrdisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/emote-rtl-ltrdisplayname-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/emote-rtl-rtldisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/emote-rtl-rtldisplayname-linux.png index cb18ce68c7b..ad9de193f15 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/emote-rtl-rtldisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/emote-rtl-rtldisplayname-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/reply-message-ltr-ltrdisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/reply-message-ltr-ltrdisplayname-linux.png index a4de383fbac..3619ac320d6 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/reply-message-ltr-ltrdisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/reply-message-ltr-ltrdisplayname-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/reply-message-ltr-rtldisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/reply-message-ltr-rtldisplayname-linux.png index e3d3e68c640..decfcb190d3 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/reply-message-ltr-rtldisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/reply-message-ltr-rtldisplayname-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/reply-message-trl-ltrdisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/reply-message-trl-ltrdisplayname-linux.png index d6964445b1d..fe644d923d8 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/reply-message-trl-ltrdisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/reply-message-trl-ltrdisplayname-linux.png differ diff --git a/playwright/snapshots/messages/messages.spec.ts/reply-message-trl-rtldisplayname-linux.png b/playwright/snapshots/messages/messages.spec.ts/reply-message-trl-rtldisplayname-linux.png index 8830c22d92b..e6b787f1473 100644 Binary files a/playwright/snapshots/messages/messages.spec.ts/reply-message-trl-rtldisplayname-linux.png and b/playwright/snapshots/messages/messages.spec.ts/reply-message-trl-rtldisplayname-linux.png differ diff --git a/playwright/snapshots/modules/custom-component.spec.ts/custom-component-crash-handle-filter-linux.png b/playwright/snapshots/modules/custom-component.spec.ts/custom-component-crash-handle-filter-linux.png index b144ca6a5ec..f2819d74792 100644 Binary files a/playwright/snapshots/modules/custom-component.spec.ts/custom-component-crash-handle-filter-linux.png and b/playwright/snapshots/modules/custom-component.spec.ts/custom-component-crash-handle-filter-linux.png differ diff --git a/playwright/snapshots/modules/custom-component.spec.ts/custom-component-crash-handle-renderer-linux.png b/playwright/snapshots/modules/custom-component.spec.ts/custom-component-crash-handle-renderer-linux.png index b3fa5e0f57d..7876849092d 100644 Binary files a/playwright/snapshots/modules/custom-component.spec.ts/custom-component-crash-handle-renderer-linux.png and b/playwright/snapshots/modules/custom-component.spec.ts/custom-component-crash-handle-renderer-linux.png differ diff --git a/playwright/snapshots/modules/custom-component.spec.ts/custom-component-tile-fall-through-linux.png b/playwright/snapshots/modules/custom-component.spec.ts/custom-component-tile-fall-through-linux.png index 0fe98072a04..2d49d287f5f 100644 Binary files a/playwright/snapshots/modules/custom-component.spec.ts/custom-component-tile-fall-through-linux.png and b/playwright/snapshots/modules/custom-component.spec.ts/custom-component-tile-fall-through-linux.png differ diff --git a/playwright/snapshots/modules/custom-component.spec.ts/custom-component-tile-linux.png b/playwright/snapshots/modules/custom-component.spec.ts/custom-component-tile-linux.png index 7c5d6b66e6d..56d2cea1240 100644 Binary files a/playwright/snapshots/modules/custom-component.spec.ts/custom-component-tile-linux.png and b/playwright/snapshots/modules/custom-component.spec.ts/custom-component-tile-linux.png differ diff --git a/playwright/snapshots/modules/custom-component.spec.ts/custom-component-tile-original-linux.png b/playwright/snapshots/modules/custom-component.spec.ts/custom-component-tile-original-linux.png index 9a00a3b04ba..809199feb5e 100644 Binary files a/playwright/snapshots/modules/custom-component.spec.ts/custom-component-tile-original-linux.png and b/playwright/snapshots/modules/custom-component.spec.ts/custom-component-tile-original-linux.png differ diff --git a/playwright/snapshots/permalinks/permalinks.spec.ts/permalink-rendering-linux.png b/playwright/snapshots/permalinks/permalinks.spec.ts/permalink-rendering-linux.png index b386eaa564e..15eb9e0d1ff 100644 Binary files a/playwright/snapshots/permalinks/permalinks.spec.ts/permalink-rendering-linux.png and b/playwright/snapshots/permalinks/permalinks.spec.ts/permalink-rendering-linux.png differ diff --git a/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-Msg1-linux.png b/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-Msg1-linux.png index f39caf654a2..fc82f247789 100644 Binary files a/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-Msg1-linux.png and b/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-Msg1-linux.png differ diff --git a/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-1-Msg1-linux.png b/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-1-Msg1-linux.png index ac13a2152d9..e240565e115 100644 Binary files a/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-1-Msg1-linux.png and b/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-1-Msg1-linux.png differ diff --git a/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-2-Msg1-linux.png b/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-2-Msg1-linux.png index 20917ae16f3..a22ae313ae9 100644 Binary files a/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-2-Msg1-linux.png and b/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-2-Msg1-linux.png differ diff --git a/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-2-Msg2-linux.png b/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-2-Msg2-linux.png index aaf8c720eb5..4f635ff5fd8 100644 Binary files a/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-2-Msg2-linux.png and b/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-2-Msg2-linux.png differ diff --git a/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-4-Msg1-linux.png b/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-4-Msg1-linux.png index 7ef356c589d..0c544e58cb2 100644 Binary files a/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-4-Msg1-linux.png and b/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-4-Msg1-linux.png differ diff --git a/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-4-Msg2-linux.png b/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-4-Msg2-linux.png index a62d8182b1a..f9df40b66db 100644 Binary files a/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-4-Msg2-linux.png and b/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-4-Msg2-linux.png differ diff --git a/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-4-Msg3-linux.png b/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-4-Msg3-linux.png index fa548aaadcc..969df22f360 100644 Binary files a/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-4-Msg3-linux.png and b/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-4-Msg3-linux.png differ diff --git a/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-4-Msg4-linux.png b/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-4-Msg4-linux.png index bc2062f98d7..8af50bb4e5d 100644 Binary files a/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-4-Msg4-linux.png and b/playwright/snapshots/pinned-messages/pinned-messages.spec.ts/pinned-message-banner-4-Msg4-linux.png differ diff --git a/playwright/snapshots/polls/polls.spec.ts/Polls-Timeline-tile-no-votes-linux.png b/playwright/snapshots/polls/polls.spec.ts/Polls-Timeline-tile-no-votes-linux.png index 7b7f296be11..db3ae8eccbb 100644 Binary files a/playwright/snapshots/polls/polls.spec.ts/Polls-Timeline-tile-no-votes-linux.png and b/playwright/snapshots/polls/polls.spec.ts/Polls-Timeline-tile-no-votes-linux.png differ diff --git a/playwright/snapshots/room/invites.spec.ts/Invites-room-view-linux.png b/playwright/snapshots/room/invites.spec.ts/Invites-room-view-linux.png index 86d0e37b938..60487a7768a 100644 Binary files a/playwright/snapshots/room/invites.spec.ts/Invites-room-view-linux.png and b/playwright/snapshots/room/invites.spec.ts/Invites-room-view-linux.png differ diff --git a/playwright/snapshots/settings/appearance-user-settings-tab/appearance-user-settings-tab.spec.ts/window-12px-linux.png b/playwright/snapshots/settings/appearance-user-settings-tab/appearance-user-settings-tab.spec.ts/window-12px-linux.png index 65258303c96..b377cf296f5 100644 Binary files a/playwright/snapshots/settings/appearance-user-settings-tab/appearance-user-settings-tab.spec.ts/window-12px-linux.png and b/playwright/snapshots/settings/appearance-user-settings-tab/appearance-user-settings-tab.spec.ts/window-12px-linux.png differ diff --git a/playwright/snapshots/settings/quick-settings-menu.spec.ts/quick-settings-linux.png b/playwright/snapshots/settings/quick-settings-menu.spec.ts/quick-settings-linux.png index c6605b5b64e..2992e35d60e 100644 Binary files a/playwright/snapshots/settings/quick-settings-menu.spec.ts/quick-settings-linux.png and b/playwright/snapshots/settings/quick-settings-menu.spec.ts/quick-settings-linux.png differ diff --git a/playwright/snapshots/spaces/spaces.spec.ts/invite-teammates-dialog-linux.png b/playwright/snapshots/spaces/spaces.spec.ts/invite-teammates-dialog-linux.png index b69496e5fee..93d8044a3da 100644 Binary files a/playwright/snapshots/spaces/spaces.spec.ts/invite-teammates-dialog-linux.png and b/playwright/snapshots/spaces/spaces.spec.ts/invite-teammates-dialog-linux.png differ diff --git a/playwright/snapshots/spaces/spaces.spec.ts/space-panel-collapsed-linux.png b/playwright/snapshots/spaces/spaces.spec.ts/space-panel-collapsed-linux.png index 312ca2580c6..4ca008798fd 100644 Binary files a/playwright/snapshots/spaces/spaces.spec.ts/space-panel-collapsed-linux.png and b/playwright/snapshots/spaces/spaces.spec.ts/space-panel-collapsed-linux.png differ diff --git a/playwright/snapshots/spaces/spaces.spec.ts/space-panel-expanded-linux.png b/playwright/snapshots/spaces/spaces.spec.ts/space-panel-expanded-linux.png index f0606ce47ab..59d3f87bb25 100644 Binary files a/playwright/snapshots/spaces/spaces.spec.ts/space-panel-expanded-linux.png and b/playwright/snapshots/spaces/spaces.spec.ts/space-panel-expanded-linux.png differ diff --git a/playwright/snapshots/spaces/spaces.spec.ts/space-room-view-linux.png b/playwright/snapshots/spaces/spaces.spec.ts/space-room-view-linux.png index 8e627ec9f24..f313bde9c49 100644 Binary files a/playwright/snapshots/spaces/spaces.spec.ts/space-room-view-linux.png and b/playwright/snapshots/spaces/spaces.spec.ts/space-room-view-linux.png differ diff --git a/playwright/snapshots/spaces/threads-activity-centre/threadsActivityCentre.spec.ts/tac-button-expanded-linux.png b/playwright/snapshots/spaces/threads-activity-centre/threadsActivityCentre.spec.ts/tac-button-expanded-linux.png index 2ad6315d9eb..30c7b662c58 100644 Binary files a/playwright/snapshots/spaces/threads-activity-centre/threadsActivityCentre.spec.ts/tac-button-expanded-linux.png and b/playwright/snapshots/spaces/threads-activity-centre/threadsActivityCentre.spec.ts/tac-button-expanded-linux.png differ diff --git a/playwright/snapshots/spaces/threads-activity-centre/threadsActivityCentre.spec.ts/tac-hovered-expanded-linux.png b/playwright/snapshots/spaces/threads-activity-centre/threadsActivityCentre.spec.ts/tac-hovered-expanded-linux.png index 2ad6315d9eb..30c7b662c58 100644 Binary files a/playwright/snapshots/spaces/threads-activity-centre/threadsActivityCentre.spec.ts/tac-hovered-expanded-linux.png and b/playwright/snapshots/spaces/threads-activity-centre/threadsActivityCentre.spec.ts/tac-hovered-expanded-linux.png differ diff --git a/playwright/snapshots/spaces/threads-activity-centre/threadsActivityCentre.spec.ts/tac-hovered-linux.png b/playwright/snapshots/spaces/threads-activity-centre/threadsActivityCentre.spec.ts/tac-hovered-linux.png index 591d22c3c43..5884f6f56f5 100644 Binary files a/playwright/snapshots/spaces/threads-activity-centre/threadsActivityCentre.spec.ts/tac-hovered-linux.png and b/playwright/snapshots/spaces/threads-activity-centre/threadsActivityCentre.spec.ts/tac-hovered-linux.png differ diff --git a/playwright/snapshots/timeline/media-preview-settings.spec.ts/invite-no-avatar-linux.png b/playwright/snapshots/timeline/media-preview-settings.spec.ts/invite-no-avatar-linux.png index 377282a2c85..68407391354 100644 Binary files a/playwright/snapshots/timeline/media-preview-settings.spec.ts/invite-no-avatar-linux.png and b/playwright/snapshots/timeline/media-preview-settings.spec.ts/invite-no-avatar-linux.png differ diff --git a/playwright/snapshots/timeline/media-preview-settings.spec.ts/invite-room-tree-no-avatar-linux.png b/playwright/snapshots/timeline/media-preview-settings.spec.ts/invite-room-tree-no-avatar-linux.png index 29d129f73f3..f3478d05aa9 100644 Binary files a/playwright/snapshots/timeline/media-preview-settings.spec.ts/invite-room-tree-no-avatar-linux.png and b/playwright/snapshots/timeline/media-preview-settings.spec.ts/invite-room-tree-no-avatar-linux.png differ diff --git a/playwright/snapshots/timeline/media-preview-settings.spec.ts/invite-room-tree-with-avatar-linux.png b/playwright/snapshots/timeline/media-preview-settings.spec.ts/invite-room-tree-with-avatar-linux.png index 452f08d3e28..7555a904400 100644 Binary files a/playwright/snapshots/timeline/media-preview-settings.spec.ts/invite-room-tree-with-avatar-linux.png and b/playwright/snapshots/timeline/media-preview-settings.spec.ts/invite-room-tree-with-avatar-linux.png differ diff --git a/playwright/snapshots/timeline/media-preview-settings.spec.ts/invite-with-avatar-linux.png b/playwright/snapshots/timeline/media-preview-settings.spec.ts/invite-with-avatar-linux.png index 93459507d01..7a7d2025c29 100644 Binary files a/playwright/snapshots/timeline/media-preview-settings.spec.ts/invite-with-avatar-linux.png and b/playwright/snapshots/timeline/media-preview-settings.spec.ts/invite-with-avatar-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/code-block-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/code-block-linux.png index 2f62d0dec61..01cca9c0d30 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/code-block-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/code-block-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/collapsed-gels-and-messages-irc-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/collapsed-gels-and-messages-irc-layout-linux.png index 45c1c5f4d91..2ab0a03e8e7 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/collapsed-gels-and-messages-irc-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/collapsed-gels-and-messages-irc-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/collapsed-gels-bubble-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/collapsed-gels-bubble-layout-linux.png index 945e5d074ba..7540e34ebdd 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/collapsed-gels-bubble-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/collapsed-gels-bubble-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/configured-room-irc-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/configured-room-irc-layout-linux.png index 41c0c6010c6..601985cafd0 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/configured-room-irc-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/configured-room-irc-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/edited-code-block-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/edited-code-block-linux.png index 46f5cf1a7ae..15eaa512333 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/edited-code-block-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/edited-code-block-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/event-line-inline-start-margin-irc-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/event-line-inline-start-margin-irc-layout-linux.png index cd2b8064097..56eb5ff1157 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/event-line-inline-start-margin-irc-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/event-line-inline-start-margin-irc-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/event-tile-reply-chains-bubble-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/event-tile-reply-chains-bubble-layout-linux.png index 167f9b6855a..b3df4da31f0 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/event-tile-reply-chains-bubble-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/event-tile-reply-chains-bubble-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/event-tile-reply-chains-compact-modern-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/event-tile-reply-chains-compact-modern-layout-linux.png index 0682bf760f4..9a3d74e5a89 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/event-tile-reply-chains-compact-modern-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/event-tile-reply-chains-compact-modern-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/event-tile-reply-chains-irc-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/event-tile-reply-chains-irc-layout-linux.png index b9899fb177e..829a6bb47d8 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/event-tile-reply-chains-irc-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/event-tile-reply-chains-irc-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/event-tile-reply-chains-irc-modern-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/event-tile-reply-chains-irc-modern-linux.png index 67a207c6870..3f274802f43 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/event-tile-reply-chains-irc-modern-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/event-tile-reply-chains-irc-modern-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/event-tiles-bubble-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/event-tiles-bubble-layout-linux.png index 7cb6c886e33..67e6c66903f 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/event-tiles-bubble-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/event-tiles-bubble-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/event-tiles-compact-modern-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/event-tiles-compact-modern-layout-linux.png index 548d2b0f927..795e68ec5bc 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/event-tiles-compact-modern-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/event-tiles-compact-modern-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/event-tiles-irc-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/event-tiles-irc-layout-linux.png index 360a316068e..b57939e6b3e 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/event-tiles-irc-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/event-tiles-irc-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/event-tiles-modern-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/event-tiles-modern-layout-linux.png index fd2a51857cb..1bd5ee24d84 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/event-tiles-modern-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/event-tiles-modern-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-and-messages-irc-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-and-messages-irc-layout-linux.png index d5a1b0cbcc2..335173ab0f6 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-and-messages-irc-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-and-messages-irc-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-bubble-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-bubble-layout-linux.png index 5e4e7dadf03..45ba93f3476 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-bubble-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-bubble-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-emote-irc-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-emote-irc-layout-linux.png index c0b5f579f42..bc999486394 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-emote-irc-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-emote-irc-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-irc-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-irc-layout-linux.png index cd2b8064097..728ec48a901 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-irc-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-irc-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-modern-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-modern-layout-linux.png index bf8a5ee3fbf..23c87f96603 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-modern-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-modern-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-redaction-placeholder-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-redaction-placeholder-linux.png index d41a9f6935e..41d3fcca28f 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-redaction-placeholder-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/expanded-gels-redaction-placeholder-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/hidden-event-line-padding-modern-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/hidden-event-line-padding-modern-layout-linux.png index cdeb0a6c0b4..0360a118936 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/hidden-event-line-padding-modern-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/hidden-event-line-padding-modern-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/hidden-event-line-zero-padding-irc-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/hidden-event-line-zero-padding-irc-layout-linux.png index 32a680f0650..c2901d9f2ef 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/hidden-event-line-zero-padding-irc-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/hidden-event-line-zero-padding-irc-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/highlighted-search-results-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/highlighted-search-results-linux.png index a99cfb68cfc..d8e061597f7 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/highlighted-search-results-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/highlighted-search-results-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/hovered-hidden-event-line-irc-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/hovered-hidden-event-line-irc-layout-linux.png index 5fb0c283b5f..2eb3f8725db 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/hovered-hidden-event-line-irc-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/hovered-hidden-event-line-irc-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/image-in-timeline-default-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/image-in-timeline-default-layout-linux.png index b1236c9ea0d..eccba9a912c 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/image-in-timeline-default-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/image-in-timeline-default-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/long-strings-with-reply-bubble-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/long-strings-with-reply-bubble-layout-linux.png index 5d44a1f655a..c63913bbc97 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/long-strings-with-reply-bubble-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/long-strings-with-reply-bubble-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/long-strings-with-reply-irc-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/long-strings-with-reply-irc-layout-linux.png index baa75ffaba0..5a38e0593f2 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/long-strings-with-reply-irc-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/long-strings-with-reply-irc-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/long-strings-with-reply-modern-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/long-strings-with-reply-modern-layout-linux.png index 4b54392a217..479e80d6e66 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/long-strings-with-reply-modern-layout-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/long-strings-with-reply-modern-layout-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/search-aux-panel-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/search-aux-panel-linux.png index d46e898b9c0..6009b554ca6 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/search-aux-panel-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/search-aux-panel-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/search-results-with-TextualEvent-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/search-results-with-TextualEvent-linux.png index 5aa6bcea193..e742edfed9e 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/search-results-with-TextualEvent-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/search-results-with-TextualEvent-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/spoiler-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/spoiler-linux.png index 529d254dc4b..e63e52dc8ef 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/spoiler-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/spoiler-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/spoiler-uncovered-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/spoiler-uncovered-linux.png index 41d5bc8beec..842476a93b1 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/spoiler-uncovered-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/spoiler-uncovered-linux.png differ diff --git a/playwright/snapshots/timeline/timeline.spec.ts/url-preview-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/url-preview-linux.png index 56220d88d1d..5bbaf080d19 100644 Binary files a/playwright/snapshots/timeline/timeline.spec.ts/url-preview-linux.png and b/playwright/snapshots/timeline/timeline.spec.ts/url-preview-linux.png differ diff --git a/playwright/snapshots/voip/pstn.spec.ts/dialpad-trigger-linux.png b/playwright/snapshots/voip/pstn.spec.ts/dialpad-trigger-linux.png index 17bea8979db..d1c0cad1075 100644 Binary files a/playwright/snapshots/voip/pstn.spec.ts/dialpad-trigger-linux.png and b/playwright/snapshots/voip/pstn.spec.ts/dialpad-trigger-linux.png differ diff --git a/playwright/snapshots/widgets/layout.spec.ts/apps-drawer-linux.png b/playwright/snapshots/widgets/layout.spec.ts/apps-drawer-linux.png index 7f621203e34..50c0e1ed2d6 100644 Binary files a/playwright/snapshots/widgets/layout.spec.ts/apps-drawer-linux.png and b/playwright/snapshots/widgets/layout.spec.ts/apps-drawer-linux.png differ diff --git a/src/settings/Settings.tsx b/src/settings/Settings.tsx index 0d272a46c5c..dfb869c31c7 100644 --- a/src/settings/Settings.tsx +++ b/src/settings/Settings.tsx @@ -690,7 +690,7 @@ export const SETTINGS: Settings = { displayName: _td("labs|new_room_list"), description: _td("labs|under_active_development"), isFeature: true, - default: false, + default: true, controller: new ReloadOnChangeController(), }, /** diff --git a/src/stores/room-list-v3/RoomListStoreV3.ts b/src/stores/room-list-v3/RoomListStoreV3.ts index 7933b1fc853..3fd3afae337 100644 --- a/src/stores/room-list-v3/RoomListStoreV3.ts +++ b/src/stores/room-list-v3/RoomListStoreV3.ts @@ -6,7 +6,7 @@ Please see LICENSE files in the repository root for full details. */ import { logger } from "matrix-js-sdk/src/logger"; -import { EventType, KnownMembership } from "matrix-js-sdk/src/matrix"; +import { EventType } from "matrix-js-sdk/src/matrix"; import type { EmptyObject, Room, RoomState } from "matrix-js-sdk/src/matrix"; import type { MatrixDispatcher } from "../../dispatcher/dispatcher"; @@ -235,12 +235,10 @@ export class RoomListStoreV3Class extends AsyncStoreWithClient { this.addRoomAndEmit(payload.room); return; } - // If the user has left this room, remove it from the skiplist. if ( - (payload.oldMembership === KnownMembership.Invite || - payload.oldMembership === KnownMembership.Join) && - payload.membership === KnownMembership.Leave + (oldMembership === EffectiveMembership.Invite || oldMembership === EffectiveMembership.Join) && + newMembership === EffectiveMembership.Leave ) { this.roomSkipList.removeRoom(payload.room); this.emit(LISTS_UPDATE_EVENT); diff --git a/test/unit-tests/accessibility/LandmarkNavigation-test.tsx b/test/unit-tests/accessibility/LandmarkNavigation-test.tsx index ad160e88663..3325747f176 100644 --- a/test/unit-tests/accessibility/LandmarkNavigation-test.tsx +++ b/test/unit-tests/accessibility/LandmarkNavigation-test.tsx @@ -19,10 +19,10 @@ describe("KeyboardLandmarkUtils", () => {
SPACE_BUTTON
-
+
ROOM_SEARCH
-
+
ROOM_TILE
@@ -33,11 +33,11 @@ describe("KeyboardLandmarkUtils", () => { // ACTIVE_SPACE_BUTTON <-> ROOM_SEARCH <-> ROOM_LIST <-> HOME <-> ACTIVE_SPACE_BUTTON // ACTIVE_SPACE_BUTTON -> ROOM_SEARCH LandmarkNavigation.findAndFocusNextLandmark(Landmark.ACTIVE_SPACE_BUTTON); - expect(screen.getByTestId("mx_RoomSearch")).toHaveFocus(); + expect(screen.getByTestId("mx_RoomListSearch_search")).toHaveFocus(); // ROOM_SEARCH -> ROOM_LIST LandmarkNavigation.findAndFocusNextLandmark(Landmark.ROOM_SEARCH); - expect(screen.getByTestId("mx_RoomTile")).toHaveFocus(); + expect(screen.getByTestId("mx_RoomListItemView")).toHaveFocus(); // ROOM_LIST -> HOME_PAGE LandmarkNavigation.findAndFocusNextLandmark(Landmark.ROOM_LIST); @@ -53,11 +53,11 @@ describe("KeyboardLandmarkUtils", () => { // ROOM_LIST <- HOME_PAGE LandmarkNavigation.findAndFocusNextLandmark(Landmark.MESSAGE_COMPOSER_OR_HOME, true); - expect(screen.getByTestId("mx_RoomTile")).toHaveFocus(); + expect(screen.getByTestId("mx_RoomListItemView")).toHaveFocus(); // ROOM_SEARCH <- ROOM_LIST LandmarkNavigation.findAndFocusNextLandmark(Landmark.ROOM_LIST, true); - expect(screen.getByTestId("mx_RoomSearch")).toHaveFocus(); + expect(screen.getByTestId("mx_RoomListSearch_search")).toHaveFocus(); // ACTIVE_SPACE_BUTTON <- ROOM_SEARCH LandmarkNavigation.findAndFocusNextLandmark(Landmark.ROOM_SEARCH, true); @@ -72,10 +72,10 @@ describe("KeyboardLandmarkUtils", () => {
SPACE_BUTTON
-
+
ROOM_SEARCH
-
+
ROOM_TILE
@@ -89,11 +89,11 @@ describe("KeyboardLandmarkUtils", () => { // ACTIVE_SPACE_BUTTON <-> ROOM_SEARCH <-> ROOM_LIST <-> MESSAGE_COMPOSER <-> ACTIVE_SPACE_BUTTON // ACTIVE_SPACE_BUTTON -> ROOM_SEARCH LandmarkNavigation.findAndFocusNextLandmark(Landmark.ACTIVE_SPACE_BUTTON); - expect(screen.getByTestId("mx_RoomSearch")).toHaveFocus(); + expect(screen.getByTestId("mx_RoomListSearch_search")).toHaveFocus(); // ROOM_SEARCH -> ROOM_LIST LandmarkNavigation.findAndFocusNextLandmark(Landmark.ROOM_SEARCH); - expect(screen.getByTestId("mx_RoomTile_selected")).toHaveFocus(); + expect(screen.getByTestId("mx_RoomListItemView_selected")).toHaveFocus(); // ROOM_LIST -> MESSAGE_COMPOSER LandmarkNavigation.findAndFocusNextLandmark(Landmark.ROOM_LIST); @@ -109,11 +109,11 @@ describe("KeyboardLandmarkUtils", () => { // ROOM_LIST <- MESSAGE_COMPOSER LandmarkNavigation.findAndFocusNextLandmark(Landmark.MESSAGE_COMPOSER_OR_HOME, true); - expect(screen.getByTestId("mx_RoomTile_selected")).toHaveFocus(); + expect(screen.getByTestId("mx_RoomListItemView_selected")).toHaveFocus(); // ROOM_SEARCH <- ROOM_LIST LandmarkNavigation.findAndFocusNextLandmark(Landmark.ROOM_LIST, true); - expect(screen.getByTestId("mx_RoomSearch")).toHaveFocus(); + expect(screen.getByTestId("mx_RoomListSearch_search")).toHaveFocus(); // ACTIVE_SPACE_BUTTON <- ROOM_SEARCH LandmarkNavigation.findAndFocusNextLandmark(Landmark.ROOM_SEARCH, true); diff --git a/test/unit-tests/components/views/rooms/RoomListHeader-test.tsx b/test/unit-tests/components/views/rooms/RoomListHeader-test.tsx index a4c4b4795aa..ab1cac83a7a 100644 --- a/test/unit-tests/components/views/rooms/RoomListHeader-test.tsx +++ b/test/unit-tests/components/views/rooms/RoomListHeader-test.tsx @@ -93,7 +93,10 @@ const checkMenuLabels = (items: NodeListOf, labelArray: Array) describe("RoomListHeader", () => { let client: MatrixClient; - beforeEach(() => { + beforeEach(async () => { + // This tests the header from the old room list/left panel, the new one is now enabled by default, + // so needs to be explicitly disabled to test the old list here. + await SettingsStore.setValue("feature_new_room_list", null, SettingLevel.DEVICE, false); jest.resetAllMocks(); const dmRoomMap = { diff --git a/test/unit-tests/components/views/settings/tabs/user/__snapshots__/PreferencesUserSettingsTab-test.tsx.snap b/test/unit-tests/components/views/settings/tabs/user/__snapshots__/PreferencesUserSettingsTab-test.tsx.snap index 7fe1f1d49b4..58a0077e6ed 100644 --- a/test/unit-tests/components/views/settings/tabs/user/__snapshots__/PreferencesUserSettingsTab-test.tsx.snap +++ b/test/unit-tests/components/views/settings/tabs/user/__snapshots__/PreferencesUserSettingsTab-test.tsx.snap @@ -95,6 +95,33 @@ exports[`PreferencesUserSettingsTab should render 1`] = ` />
+
+ +
+
+
+
@@ -269,129 +257,6 @@ exports[` renders sidebar settings with guest spa url - - Group all your people in one place. - -
-
- -
-
-
-
- -
- -
-
-
-
- - - Group all your rooms that aren't part of a space in one place. - -
-
-
-
-
-
-
- -
- -
-
-
-
- Group all private video rooms and conferences. In conferences you can invite people outside of matrix. @@ -476,7 +341,7 @@ exports[` renders sidebar settings without guest spa u class="_container_1hel1_10" > renders sidebar settings without guest spa u Home is useful for getting an overview of everything. @@ -544,7 +409,7 @@ exports[` renders sidebar settings without guest spa u class="_container_1hel1_10" > renders sidebar settings without guest spa u Show all your rooms in Home, even if they're in a space. @@ -599,7 +464,7 @@ exports[` renders sidebar settings without guest spa u class="_container_1hel1_10" > renders sidebar settings without guest spa u - - Group all your favourite rooms and people in one place. - -
-
-
-
-
-
-
- -
- -
-
-
-
- - - Group all your people in one place. - -
-
-
-
-
-
-
- -
- -
-
-
-
- Group all your rooms that aren't part of a space in one place. @@ -788,9 +518,9 @@ exports[` renders sidebar settings without guest spa u class="_container_1hel1_10" >
renders sidebar settings without guest spa u > Group all private video rooms and conferences. diff --git a/test/unit-tests/components/views/spaces/__snapshots__/SpacePanel-test.tsx.snap b/test/unit-tests/components/views/spaces/__snapshots__/SpacePanel-test.tsx.snap index 2ce0a39883b..cd9ce2526c5 100644 --- a/test/unit-tests/components/views/spaces/__snapshots__/SpacePanel-test.tsx.snap +++ b/test/unit-tests/components/views/spaces/__snapshots__/SpacePanel-test.tsx.snap @@ -4,7 +4,7 @@ exports[` should show all activated MetaSpaces in the correct orde