Stabilize playwright tests by making the left panel constant width (#33451)

* Move css injection to panel.ts

- Inject css on event

* Upgrade package

* Fix playwright tests

* Remove RR instead of masking it

* Fix wrong import

* Fix playwright tests

* Fix more playwright tests

* Catch error and add comment

apps/web/playwright/e2e/crypto/history-sharing.spec.ts

@@ -61,13 +61,18 @@ test.describe("History sharing", function () {
             // Bob should now be able to decrypt the event
             await expect(bobPage.getByText("A message from Alice")).toBeVisible();
 
-            // Exclude message timestamps and RR avatars from the screenshot. Bob sometimes sees Alice's RR on the
+            // Mask message timestamps and exclude RR avatars from the screenshot. Bob sometimes sees Alice's RR on the
             // previous event, which is surprising but not what we're testing here.
-            const mask = [bobPage.locator(".mx_MessageTimestamp"), bobPage.locator(".mx_ReadReceiptGroup_container")];
+            const mask = [bobPage.locator(".mx_MessageTimestamp")];
             await expect(bobPage.locator(".mx_RoomView_timeline")).toMatchScreenshot(
                 "shared-history-invite-accepted.png",
                 {
                     mask,
+                    css: `
+                    .mx_ReadReceiptGroup_container {
+                        display: none !important;
+                    }
+                `,
                 },
             );
         },