demo · v149
Stack Sandbox
Open the auto menu, then launch hints and a nested auto from inside it. The diagram shows the ancestor chain in real time, so you can see which popovers share a stack parent and which dismiss as unrelated branches.
live stack controls
Use the controls in and around the popovers. Every button calls the Popover API with a source element so the browser can compute the topmost popover ancestor.
open state
tax hint hint
The source button lives inside the auto menu, so the menu is this hint's topmost popover ancestor.
tax mode select authored auto
Because this auto is opened from inside a hint, v149 treats its effective stack behavior as hint instead of throwing or corrupting the stack.
page hint hint
This hint is triggered by hover/focus outside the menu, so it can open without an outside click light-dismissing the auto menu first.
unrelated panel auto
This auto has no shared ancestor. Opening it should dismiss the menu branch and its hints.
behavior contrast
| Scenario | Before v149 | v149 behavior |
|---|---|---|
| Open a hint from inside an auto menu | Corner cases could close unrelated autos or make the stack hard to predict. | The hint keeps the auto ancestor open and records that ancestor in the hint stack. |
Open an authored popover="auto" from inside a hint |
Could throw or break the stack relationship. | The browser downgrades the effective opened mode to hint for that nested branch. |
| Click outside the active chain | Light-dismiss still applied, but mixed auto/hint chains were harder to reason about. | The browser hides the popovers above the clicked node's nearest open ancestor. |
see also
- Popover=hint behavior changes - feature index
- Nested Tooltip Menu - menu plus hint pattern
- ChromeStatus entry
- HTML popover algorithms
implementation reference
Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗