Default the room header to on (#12803)

* Default the room header to on

* Refactor code into helper method

Add a method to open/close the room info panel and use it everywhere.

* Fix broken tests, update snapshots and screenshots

* Update room header tests to make sense with the new header

Author: MidhunSureshR

playwright/e2e/app-loading/stored-credentials.spec.ts

@@ -48,7 +48,7 @@ test("Shows the last known page on reload", async ({ pageWithCredentials: page }
 
     // Check that the room reloaded
     await expect(page).toHaveURL(/\/#\/room\//);
-    await expect(page.locator(".mx_LegacyRoomHeader")).toContainText("Test Room");
+    await expect(page.locator(".mx_RoomHeader")).toContainText("Test Room");
 });
 
 test("Room link correctly loads a room view", async ({ pageWithCredentials: page }) => {

playwright/e2e/chat-export/html-export.spec.ts

@@ -108,7 +108,7 @@ test.describe("HTML Export", () => {
             page.locator(".mx_EventTile_last .mx_MTextBody .mx_EventTile_body").getByText("Testing 9"),
         ).toBeVisible();
 
-        await page.getByRole("button", { name: "Room info" }).click();
+        await app.toggleRoomInfoPanel();
         await page.getByRole("menuitem", { name: "Export Chat" }).click();
 
         const downloadPromise = page.waitForEvent("download");

playwright/e2e/create-room/create-room.spec.ts

@@ -36,7 +36,7 @@ test.describe("Create Room", () => {
         await dialog.getByRole("button", { name: "Create room" }).click();
 
         await expect(page).toHaveURL(/\/#\/room\/#test-room-1:localhost/);
-        const header = page.locator(".mx_LegacyRoomHeader");
+        const header = page.locator(".mx_RoomHeader");
         await expect(header).toContainText(name);
         await expect(header).toContainText(topic);
     });

playwright/e2e/crypto/crypto.spec.ts

@@ -224,7 +224,7 @@ test.describe("Cryptography", function () {
         await checkDMRoom(page);
         const bobRoomId = await bobJoin(page, bob);
         await testMessages(page, bob, bobRoomId);
-        await verify(page, bob);
+        await verify(app, bob);
 
         // Assert that verified icon is rendered
         await page.getByTestId("base-card-back-button").click();
@@ -246,6 +246,6 @@ test.describe("Cryptography", function () {
 
         // we need to have a room with the other user present, so we can open the verification panel
         await createSharedRoomWithUser(app, bob.credentials.userId);
-        await verify(page, bob);
+        await verify(app, bob);
     });
 });

playwright/e2e/crypto/event-shields.spec.ts

@@ -104,7 +104,7 @@ test.describe("Cryptography", function () {
             await expect(lastTileE2eIcon).not.toBeVisible();
 
             /* Now verify Bob */
-            await verify(page, bob);
+            await verify(app, bob);
 
             /* Existing message should be updated when user is verified. */
             await expect(last).toContainText("test encrypted 1");
@@ -222,7 +222,7 @@ test.describe("Cryptography", function () {
             await bobSecondDevice.prepareClient();
 
             // verify Bob
-            await verify(page, bob);
+            await verify(app, bob);
 
             // bob sends a valid event
             const testEvent = await bob.sendMessage(testRoomId, "Hoo!");

playwright/e2e/crypto/utils.ts

@@ -329,15 +329,6 @@ export async function createRoom(page: Page, roomName: string, isEncrypted: bool
     }
 }
 
-/**
- * Open the room info panel and return the panel element
- * @param page - the page to use
- */
-export const openRoomInfo = async (page: Page) => {
-    await page.getByRole("button", { name: "Room info" }).click();
-    return page.locator(".mx_RightPanel");
-};
-
 /**
  * Configure the given MatrixClient to auto-accept any invites
  * @param client - the client to configure
@@ -357,10 +348,11 @@ export async function autoJoin(client: Client) {
  * @param page - the page to use
  * @param bob - the user to verify
  */
-export const verify = async (page: Page, bob: Bot) => {
+export const verify = async (app: ElementAppPage, bob: Bot) => {
+    const page = app.page;
     const bobsVerificationRequestPromise = waitForVerificationRequest(bob);
 
-    const roomInfo = await openRoomInfo(page);
+    const roomInfo = await app.toggleRoomInfoPanel();
     await page.locator(".mx_RightPanelTabs").getByText("People").click();
     await roomInfo.getByText("Bob").click();
     await roomInfo.getByRole("button", { name: "Verify" }).click();

playwright/e2e/file-upload/image-upload.spec.ts

@@ -38,8 +38,8 @@ test.describe("Image Upload", () => {
             .locator(".mx_MessageComposer_actions input[type='file']")
             .setInputFiles("playwright/sample-files/riot.png");
 
-        expect(page.getByRole("button", { name: "Upload" })).toBeEnabled();
-        expect(page.getByRole("button", { name: "Close dialog" })).toBeEnabled();
-        expect(page).toMatchScreenshot("image-upload-preview.png");
+        await expect(page.getByRole("button", { name: "Upload" })).toBeEnabled();
+        await expect(page.getByRole("button", { name: "Close dialog" })).toBeEnabled();
+        await expect(page).toMatchScreenshot("image-upload-preview.png");
     });
 });

playwright/e2e/integration-manager/get-openid-token.spec.ts

@@ -118,8 +118,8 @@ test.describe("Integration Manager: Get OpenID Token", () => {
         await app.viewRoomByName(ROOM_NAME);
     });
 
-    test("should successfully obtain an openID token", async ({ page }) => {
-        await openIntegrationManager(page);
+    test("should successfully obtain an openID token", async ({ page, app }) => {
+        await openIntegrationManager(app);
         await sendActionFromIntegrationManager(page, integrationManagerUrl);
 
         const iframe = page.frameLocator(`iframe[src*="${integrationManagerUrl}"]`);

playwright/e2e/integration-manager/kick.spec.ts

@@ -167,7 +167,7 @@ test.describe("Integration Manager: Kick", () => {
         await app.client.inviteUser(room.roomId, targetUser.credentials.userId);
         await expect(page.getByText(`${BOT_DISPLAY_NAME} joined the room`)).toBeVisible();
 
-        await openIntegrationManager(page);
+        await openIntegrationManager(app);
         await sendActionFromIntegrationManager(page, integrationManagerUrl, room.roomId, targetUser.credentials.userId);
         await closeIntegrationManager(page, integrationManagerUrl);
         await expectKickedMessage(page, true);
@@ -185,7 +185,7 @@ test.describe("Integration Manager: Kick", () => {
             },
         });
 
-        await openIntegrationManager(page);
+        await openIntegrationManager(app);
         await sendActionFromIntegrationManager(page, integrationManagerUrl, room.roomId, targetUser.credentials.userId);
         await closeIntegrationManager(page, integrationManagerUrl);
         await expectKickedMessage(page, false);
@@ -197,7 +197,7 @@ test.describe("Integration Manager: Kick", () => {
         await expect(page.getByText(`${BOT_DISPLAY_NAME} joined the room`)).toBeVisible();
         await targetUser.leave(room.roomId);
 
-        await openIntegrationManager(page);
+        await openIntegrationManager(app);
         await sendActionFromIntegrationManager(page, integrationManagerUrl, room.roomId, targetUser.credentials.userId);
         await closeIntegrationManager(page, integrationManagerUrl);
         await expectKickedMessage(page, false);
@@ -209,7 +209,7 @@ test.describe("Integration Manager: Kick", () => {
         await expect(page.getByText(`${BOT_DISPLAY_NAME} joined the room`)).toBeVisible();
         await app.client.ban(room.roomId, targetUser.credentials.userId);
 
-        await openIntegrationManager(page);
+        await openIntegrationManager(app);
         await sendActionFromIntegrationManager(page, integrationManagerUrl, room.roomId, targetUser.credentials.userId);
         await closeIntegrationManager(page, integrationManagerUrl);
         await expectKickedMessage(page, false);
@@ -218,7 +218,7 @@ test.describe("Integration Manager: Kick", () => {
     test("should no-op if the target was never a room member", async ({ page, app, bot: targetUser, room }) => {
         await app.viewRoomByName(ROOM_NAME);
 
-        await openIntegrationManager(page);
+        await openIntegrationManager(app);
         await sendActionFromIntegrationManager(page, integrationManagerUrl, room.roomId, targetUser.credentials.userId);
         await closeIntegrationManager(page, integrationManagerUrl);
         await expectKickedMessage(page, false);

playwright/e2e/integration-manager/read_events.spec.ts

@@ -142,7 +142,7 @@ test.describe("Integration Manager: Read Events", () => {
 
         // Send a state event
         const sendEventResponse = await app.client.sendStateEvent(room.roomId, eventType, eventContent, stateKey);
-        await openIntegrationManager(page);
+        await openIntegrationManager(app);
 
         // Read state events
         await sendActionFromIntegrationManager(page, integrationManagerUrl, room.roomId, eventType, stateKey);
@@ -162,7 +162,7 @@ test.describe("Integration Manager: Read Events", () => {
 
         // Send a state event
         const sendEventResponse = await app.client.sendStateEvent(room.roomId, eventType, eventContent, stateKey);
-        await openIntegrationManager(page);
+        await openIntegrationManager(app);
 
         // Read state events
         await sendActionFromIntegrationManager(page, integrationManagerUrl, room.roomId, eventType, stateKey);
@@ -196,7 +196,7 @@ test.describe("Integration Manager: Read Events", () => {
             app.client.sendStateEvent(room.roomId, eventType, eventContent3, stateKey3),
         ]);
 
-        await openIntegrationManager(page);
+        await openIntegrationManager(app);
 
         // Read state events
         await sendActionFromIntegrationManager(
@@ -217,11 +217,11 @@ test.describe("Integration Manager: Read Events", () => {
         await expect(iframe.locator("#message-response")).toContainText(`"content":${JSON.stringify(eventContent3)}`);
     });
 
-    test("should fail to read an event type which is not allowed", async ({ page, room }) => {
+    test("should fail to read an event type which is not allowed", async ({ page, app, room }) => {
         const eventType = "com.example.event";
         const stateKey = "";
 
-        await openIntegrationManager(page);
+        await openIntegrationManager(app);
 
         // Read state events
         await sendActionFromIntegrationManager(page, integrationManagerUrl, room.roomId, eventType, stateKey);