fix: Fix autoFocusOnShow behavior on Popover

ariakit · Jan 25, 2022 · 72944c1 · 72944c1 · vercel · Jan 25, 2022
1 parent 228eaec
commit 72944c1
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 4 deletions.
diff --git a/packages/ariakit/src/popover/popover-state.ts b/packages/ariakit/src/popover/popover-state.ts
@@ -139,7 +139,7 @@ export function usePopoverState({
           {
             // https://popper.js.org/docs/v2/modifiers/flip/
             name: "flip",
-            enabled: flip,
+            enabled: flip && dialog.mounted,
             options: { padding },
           },
           {

diff --git a/packages/ariakit/src/popover/popover.tsx b/packages/ariakit/src/popover/popover.tsx
@@ -58,16 +58,15 @@ export const usePopover = createHook<PopoverOptions>(
       wrapper.style.zIndex = getComputedStyle(popover).zIndex;
     }, [popoverRef, state.contentElement]);
 
-    const domReady = !portal || portalNode;
     const [canAutoFocusOnShow, setCanAutoFocusOnShow] = useState(state.fixed);
 
     // When the popover is absolutely positioned, we can't move focus right
     // after it gets open. Otherwise we may see some scroll jumps. So we wait a
     // bit so Popper can finish positioning the popover before we move focus.
     useEffect(() => {
       if (state.fixed) return;
-      setCanAutoFocusOnShow(!!domReady && state.mounted);
-    }, [state.fixed, domReady, state.mounted]);
+      setCanAutoFocusOnShow(state.mounted && !!state.contentElement);
+    }, [state.fixed, state.mounted, state.contentElement]);
 
     // Wrap our element in a div that will be used to position the popover.
     // This way the user doesn't need to override the popper's position to