Merge pull request #318 from oddbird/fallback-viewport

Alternate overflow options

Author: jgerigmeyer

src/polyfill.ts

@@ -441,12 +441,13 @@ async function checkOverflow(target: HTMLElement, offsetParent: HTMLElement) {
       y: target.offsetTop,
       platform: platformWithCache,
       rects,
-      elements: { floating: target },
+      elements: {
+        floating: target,
+        reference: offsetParent,
+      },
       strategy: 'absolute',
     } as unknown as MiddlewareState,
     {
-      boundary: offsetParent,
-      rootBoundary: 'document',
       padding: getMargins(target),
     },
   );

tests/e2e/polyfill.test.ts

@@ -110,6 +110,7 @@ test('updates when sizes change', async ({ page }) => {
 test('applies polyfill for `@position-fallback`', async ({ page }) => {
   const targetSel = '#my-target-fallback';
   const target = page.locator(targetSel);
+  await target.scrollIntoViewIfNeeded();
 
   await expect(target).toHaveCSS('left', '0px');
 
@@ -124,6 +125,7 @@ test('applies polyfill for `@position-fallback`', async ({ page }) => {
   });
 
   await expect(target).toHaveCSS('width', '100px');
+  await expect(target).toHaveCSS('height', '100px');
 });
 
 test('applies manual polyfill', async ({ page }) => {