whatwg
A (hidden) popover inside a dialog gets detached
Issue
When a popover, that is hidden by default (display: none), lives inside a <dialog> element, gets shown through showPopover(), it's being detached from its anchor.
If the popover is shown by default (display: block) and modal gets moved around, e.g. via transform, it seems to "reattach".
This behavior seem to differ slightly between browser engines. What's consistent is that the target is never correctly attached when hidden by default.
Chromium 142:
When popover is shown by default, it attaches correctly at start and when modal is moved, but detaches when showPopover() is triggered through hover
Firefox Nightly 146:
When popover is shown by default, the popover is detached by default, reattaches when moving the modal, but detaches when showPopover() is triggered through hover
Safari 26:
When popover is shown by default, the popover is centered by default, reattaches when moving the modal, but detaches when showPopover() is triggered through hover
Reproducible demo
https://codepen.io/huma-erik/pen/raxqVBZ
At least in Chrome, the behavior as of the latest Canary is "correct": you can drag the dialog and the tooltip stays anchored, even with a transformed dialog. In 142 I agree it's "broken". I bisected the change to this:
https://chromium.googlesource.com/chromium/src/+/02c2db183ee66a3f0c61a8a6c2ee48a89d94f98d
Which means the fix you're looking for is already (recently) part of the CSS spec for anchor positioning:
https://github.com/w3c/csswg-drafts/issues/8584
