demo · v149

Nested Tooltip Menu

A canonical corner case the v149 rationalisation fixes. The menu is a popover="auto". Each menu item carries a help icon that opens a popover="hint" tooltip. Pre-149, hovering a tooltip would dismiss the menu it lives in — because opening a hint forced the auto stack to close. From 149, the menu stays open while you read the tip.

Anyone with the link can view. Expires in 7 days.
Emails the workspace. Granular per-collaborator permissions.
Includes embedded fonts. ~120ms server render.

the corner case

<div id="menu" popover="auto">
  <button popovertarget="tip">help</button>
  <div id="tip" popover="hint">…</div>
</div>

// Pre-149: opening #tip caused #menu to close.
// v149+: opening #tip does NOT touch the auto stack.
//        #tip closes only when its own ancestor chain closes.

Move the pointer between the help icons. The "menu open?" row stays green throughout. On pre-149 builds, it would flip to off the moment you hovered any help icon.

see also

implementation reference

Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗