Repository navigation
Description
Provide a general summary of the issue here
I'm encountering issues with the menu popover not flipping when the trigger is nearing the bottom edge of the screen. Instead it will shrink the popover and make it scrollable, but the area is too small. At first I thought this was only happening when the maxHeight prop is set on Popover, but I managed to reproduce it immediately with the Tailwind menu example, which doesn't set this prop.
CleanShot.2026-06-09.at.15.45.55.mp4
Another reproduction (https://stackblitz.com/edit/z6fnt1to-rgblfgnn?file=package.json):
CleanShot.2026-06-09.at.14.35.06.mp4
I'm not always able to reproduce it, sometimes it's fixed for awhile and I need to restart Chrome for it to happen again. I've not seen it happen with ComboBox or Select which also uses Popover internally.
Could it be related to: #7960?
🤔 Expected Behavior?
The menu popover should flip to the top when it's nearing the bottom edge of the screen and there's enough space on top.
😯 Current Behavior
The menu popover shrinks and renders below, making it too small to be usable.
💁 Possible Solution
No response
🔦 Context
No response
🖥️ Steps to Reproduce
- Download the
MenuTailwind example (https://react-aria.adobe.com/Menu) - Open
Example.tsxand surround theMenuTriggerelement with<div style={{ marginBlock: "90vh" }}>...</div>, this makes the page scrollable. - Run
npm startand open the project in a browser - Open the popover. If the issue does not occur, restart the browser.
- If the issue still does not occur, add
maxHeight={350}toPopoverrendered inside theMenuTriggerfunction inMenuTrigger.tsx - Restart the browser and open the popover
I've also implemented a reproduction in Stackblitz: https://stackblitz.com/edit/z6fnt1to-rgblfgnn?file=package.json. But the bug is really flaky, sometimes I'm able to reproduce it here, and other times I'm not. There is definitely an issue here though, because my colleague was also able to reproduce it in Firefox.
Version
React Aria Components 1.18.0
What browsers are you seeing the problem on?
Chrome
If other, please specify.
No response
What operating system are you using?
macOS 26
🧢 Your Company/Team
No response
🕷 Tracking Issue
No response
Activity
reidbarber commentedon Jun 9, 2026
Potentially the same issue or related to this? #10151
Ingole712521 commentedon Jun 12, 2026
Can I work on this issue
chore: clean up menu popover flip regression tests
fix: Menu popover doesn't flip when a user-set maxHeight can't fit be…
chore: clean up menu popover flip regression tests
fix: Menu popover doesn't flip when a user-set maxHeight can't fit be…
chore: clean up menu popover flip regression tests
fix: Menu popover doesn't flip when a user-set maxHeight can't fit be…
chore: clean up menu popover flip regression tests
fix: Menu popover doesn't flip when a user-set maxHeight can't fit be…
chore: clean up menu popover flip regression tests
fix: Menu popover doesn't flip when a user-set maxHeight can't fit be…
chore: clean up menu popover flip regression tests
fix: Menu popover doesn't flip when a user-set maxHeight can't fit be…
chore: clean up menu popover flip regression tests
fix: Menu popover doesn't flip when a user-set maxHeight can't fit be…
chore: clean up menu popover flip regression tests
chore: add Menu story demonstrating popover flip with a user-set maxH…
fix: Menu popover doesn't flip when a user-set maxHeight can't fit be…
chore: clean up menu popover flip regression tests
chore: add Menu story demonstrating popover flip with a user-set maxH…
fix: Menu popover doesn't flip when a user-set maxHeight can't fit be…
chore: clean up menu popover flip regression tests
chore: add Menu story demonstrating popover flip with a user-set maxH…
fix: Menu popover doesn't flip when a user-set maxHeight can't fit be…
chore: clean up menu popover flip regression tests
chore: add Menu story demonstrating popover flip with a user-set maxH…