From e2ea65b08719b5af05b49548009d29a9f90a9e85 Mon Sep 17 00:00:00 2001
From: "google-labs-jules[bot]"
 <161369871+google-labs-jules[bot]@users.noreply.github.com>
Date: Wed, 28 Jan 2026 16:25:28 +0000
Subject: [PATCH] fix(test): stabilize mobile sidebar visual regression test

Co-authored-by: PR0M3TH3AN <53631862+PR0M3TH3AN@users.noreply.github.com>
---
 tests/visual/overlay-layers.spec.ts | 20 ++++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/tests/visual/overlay-layers.spec.ts b/tests/visual/overlay-layers.spec.ts
index 3d98a3e1..5382c050 100644
--- a/tests/visual/overlay-layers.spec.ts
+++ b/tests/visual/overlay-layers.spec.ts
@@ -130,12 +130,24 @@ test.describe("overlay layering tokens", () => {
     await expect(collapseToggle).toHaveAttribute("data-state", /.*/);
     await collapseToggle.click({ force: true });
 
-    await page.waitForFunction(() =>
-      document.getElementById("sidebar")?.classList.contains("sidebar-expanded")
-    );
+    await page.waitForFunction(() => {
+      const sidebar = document.getElementById("sidebar");
+      return (
+        sidebar?.classList.contains("sidebar-expanded") &&
+        !sidebar?.classList.contains("sidebar-collapsed")
+      );
+    });
 
     // Wait for sidebar transition to complete
-    await page.waitForTimeout(500);
+    await page.waitForTimeout(1000);
+
+    // Ensure the footer button is scrolled into view (especially for mobile viewports)
+    await page.evaluate(() => {
+      const sidebar = document.getElementById("sidebar");
+      if (sidebar) {
+        sidebar.scrollTop = sidebar.scrollHeight;
+      }
+    });
 
     const expandedLayout = await page.evaluate(() => {
       const sidebar = document.getElementById("sidebar");