refactor(core): use scrollbar-gutter instead of padding-right for scroll lock

thomkrupa · claude · thomkrupa · commit 5f394f2b4e95 · 2026-02-05T16:46:49.000+01:00
Replace scrollbar width calculation and padding-right compensation with
scrollbar-gutter: stable on &lt;html&gt;, eliminating layout shift without
manual measurement. Styles now target documentElement instead of body.

Co-Authored-By: Claude Opus 4.5 &lt;noreply@anthropic.com&gt;
diff --git a/packages/dropdown-menu/src/index.test.ts b/packages/dropdown-menu/src/index.test.ts
@@ -845,7 +845,7 @@ describe("DropdownMenu", () => {
       const { controller } = setup();
 
       controller.open();
-      expect(document.body.style.overflow).toBe("hidden");
+      expect(document.documentElement.style.overflow).toBe("hidden");
 
       controller.destroy();
     });
@@ -854,10 +854,10 @@ describe("DropdownMenu", () => {
       const { controller } = setup();
 
       controller.open();
-      expect(document.body.style.overflow).toBe("hidden");
+      expect(document.documentElement.style.overflow).toBe("hidden");
 
       controller.close();
-      expect(document.body.style.overflow).toBe("");
+      expect(document.documentElement.style.overflow).toBe("");
 
       controller.destroy();
     });
@@ -866,17 +866,17 @@ describe("DropdownMenu", () => {
       const { controller } = setup();
 
       controller.open();
-      expect(document.body.style.overflow).toBe("hidden");
+      expect(document.documentElement.style.overflow).toBe("hidden");
 
       controller.destroy();
-      expect(document.body.style.overflow).toBe("");
+      expect(document.documentElement.style.overflow).toBe("");
     });
 
     it("respects lockScroll: false option", () => {
       const { controller } = setup({ lockScroll: false });
 
       controller.open();
-      expect(document.body.style.overflow).toBe("");
+      expect(document.documentElement.style.overflow).toBe("");
 
       controller.destroy();
     });
@@ -894,7 +894,7 @@ describe("DropdownMenu", () => {
       const controller = createDropdownMenu(root);
 
       controller.open();
-      expect(document.body.style.overflow).toBe("");
+      expect(document.documentElement.style.overflow).toBe("");
 
       controller.destroy();
     });
