diff --git a/packages/app/e2e/helpers/sidebar.ts b/packages/app/e2e/helpers/sidebar.ts
index de839e770..eaea7c09b 100644
--- a/packages/app/e2e/helpers/sidebar.ts
+++ b/packages/app/e2e/helpers/sidebar.ts
@@ -19,3 +19,21 @@ export async function expectWorkspaceListed(page: Page, name: string): Promise<v
     page.locator('[data-testid^="sidebar-workspace-row-"]').filter({ hasText: name }).first(),
   ).toBeVisible({ timeout: 30_000 });
 }
+
+export async function openMobileAgentSidebar(page: Page): Promise<void> {
+  await page.getByTestId("menu-button").click();
+}
+
+// force=true: the overlay covers the button when the mobile sidebar is open.
+export async function closeMobileAgentSidebar(page: Page): Promise<void> {
+  await page.getByTestId("menu-button").click({ force: true });
+}
+
+// The mobile sidebar panel animates via translateX; toBeInViewport reflects the rendered position.
+export async function expectMobileAgentSidebarVisible(page: Page): Promise<void> {
+  await expect(page.getByTestId("sidebar-sessions")).toBeInViewport({ timeout: 5_000 });
+}
+
+export async function expectMobileAgentSidebarHidden(page: Page): Promise<void> {
+  await expect(page.getByTestId("sidebar-sessions")).not.toBeInViewport({ timeout: 5_000 });
+}
diff --git a/packages/app/e2e/sidebar-workspace.spec.ts b/packages/app/e2e/sidebar-workspace.spec.ts
index a4e2a2509..5abc44775 100644
--- a/packages/app/e2e/sidebar-workspace.spec.ts
+++ b/packages/app/e2e/sidebar-workspace.spec.ts
@@ -4,6 +4,12 @@ import { tmpdir } from "node:os";
 import path from "node:path";
 import { test, expect } from "./fixtures";
 import { gotoAppShell } from "./helpers/app";
+import {
+  closeMobileAgentSidebar,
+  expectMobileAgentSidebarHidden,
+  expectMobileAgentSidebarVisible,
+  openMobileAgentSidebar,
+} from "./helpers/sidebar";
 import { createTempGitRepo } from "./helpers/workspace";
 import { expectWorkspaceHeader } from "./helpers/workspace-ui";
 import { connectWorkspaceSetupClient } from "./helpers/workspace-setup";
@@ -180,3 +186,16 @@ test.describe("Sidebar workspace list", () => {
     }
   });
 });
+
+test.describe("Mobile sidebar panelState transition", () => {
+  test.use({ viewport: { width: 390, height: 844 } });
+
+  test("showMobileAgent open and close transition", async ({ page }) => {
+    await gotoAppShell(page);
+    await expectMobileAgentSidebarHidden(page);
+    await openMobileAgentSidebar(page);
+    await expectMobileAgentSidebarVisible(page);
+    await closeMobileAgentSidebar(page);
+    await expectMobileAgentSidebarHidden(page);
+  });
+});