diff --git a/apps/web/playwright/e2e/composer/CIDER.spec.ts b/apps/web/playwright/e2e/composer/CIDER.spec.ts
index 89f4cad276..4640692fd5 100644
--- a/apps/web/playwright/e2e/composer/CIDER.spec.ts
+++ b/apps/web/playwright/e2e/composer/CIDER.spec.ts
@@ -77,6 +77,12 @@ test.describe("Composer", () => {
             await expect(page.locator(".mx_EventTile_body", { hasText: "😇" })).toBeVisible();
         });
 
+        test("renders in narrow viewports", { tag: "@screenshot" }, async ({ page, bot, app }) => {
+            // Shrink the viewport
+            await page.setViewportSize({ width: 500, height: 1080 });
+            await expect(app.getComposer()).toMatchScreenshot("narrow.png");
+        });
+
         test.describe("render emoji picker with larger viewport height", async () => {
             test.use({ viewport: { width: 1280, height: 720 } });
             test("render emoji picker", { tag: "@screenshot" }, async ({ page, app }) => {
@@ -186,7 +192,7 @@ test.describe("Composer", () => {
             await expect(page.locator(".mx_EventTile_body", { hasText: "Bob" })).toBeVisible();
         });
 
-        test("renders emoji autocomplete", { tag: "@screenshot" }, async ({ page }) => {
+        test("renders emoji autocomplete", async ({ page }) => {
             const composer = page.getByRole("textbox", { name: "Send an unencrypted message…" });
 
             // Type ":+1" to trigger emoji autocomplete
diff --git a/apps/web/playwright/e2e/composer/RTE.spec.ts b/apps/web/playwright/e2e/composer/RTE.spec.ts
index 2c5f8071ec..170a900ec0 100644
--- a/apps/web/playwright/e2e/composer/RTE.spec.ts
+++ b/apps/web/playwright/e2e/composer/RTE.spec.ts
@@ -216,6 +216,12 @@ test.describe("Composer", () => {
             await expect(page.locator(".mx_MImageBody")).toBeVisible();
         });
 
+        test("renders in narrow viewports", { tag: "@screenshot" }, async ({ page, bot, app }) => {
+            // Shrink the viewport
+            await page.setViewportSize({ width: 750, height: 1080 });
+            await expect(page.locator(".mx_MessageComposer_wrapper")).toMatchScreenshot("narrow.png");
+        });
+
         test.describe("when Control+Enter is required to send", () => {
             test.beforeEach(async ({ app }) => {
                 await app.settings.setValue("MessageComposerInput.ctrlEnterToSend", null, SettingLevel.ACCOUNT, true);
diff --git a/apps/web/playwright/snapshots/composer/CIDER.spec.ts/narrow-linux.png b/apps/web/playwright/snapshots/composer/CIDER.spec.ts/narrow-linux.png
new file mode 100644
index 0000000000..366271b095
Binary files /dev/null and b/apps/web/playwright/snapshots/composer/CIDER.spec.ts/narrow-linux.png differ
diff --git a/apps/web/playwright/snapshots/composer/RTE.spec.ts/narrow-linux.png b/apps/web/playwright/snapshots/composer/RTE.spec.ts/narrow-linux.png
new file mode 100644
index 0000000000..c0f8d16a16
Binary files /dev/null and b/apps/web/playwright/snapshots/composer/RTE.spec.ts/narrow-linux.png differ