[css-anchor] Interaction between `anchor-scroll` and `position: sticky` is not well defined

[xiaochengh]

The current spec takes a snapshotted scroll offset of the anchor element.

When the anchor has position:sticky and is stuck, this offset no longer matches the actual offset of the anchor element. Then both position-fallback and anchor-scroll fail.

Test case (by @jh3y): https://codepen.io/web-dot-dev/pen/dyqbqjE/8b6fc20f812f33ba4920620bb9af3604

---

Edit: there's another case when we have an anchor-scrolled container with sticky positioned content

Test case: https://jsfiddle.net/p7nfqyzw/

The tooltip should be stuck when hitting the top of the viewport, but currently it doesn't.

[kizu]

Moving a (reworded) part of my comment regarding sticky positioning from #8584 here:

Right now, the positions for the anchors do not take into account position: sticky when something is in a stuck position.

In practice, there were cases in my experiments where I wanted to use it: the adjusted position of an element with the position: sticky for things that should be shown for the stuck element.

Use cases:

• A stuck toolbar/header with items having tooltips/dropdowns attached to buttons inside of it
• Sticky sidebars that could also have things inside that cause anchored popovers to appear.

[tabatkins]

This should be considered an impl bug, I think. We track the position of relpos things, and stickypos is just a magical relpos, so it should work the same.

[wangxianzhu]

Chrome CL to support anchor position adjustment with position:sticky has landed: https://chromium-review.googlesource.com/c/chromium/src/+/5297007.

There may also be issues with position:sticky under anchor position, but I haven't created a test case broken on Chrome.

[tabatkins]

(Closing as a dupe of #9071, which is more general.)