Position Observer

[arenevier]

I am currently trying to observe the bounding box of a specific node from an extension. It's easy to observe the size changes with the ResizeObserver. But there is no easy way to observe changes in the node position.

There are imperfect solutions that use IntersectionObserver with rootMargin. See https://samthor.au/2021/observing-dom/ and https://github.com/samthor/viz-observer But there are edge cases where this solution won't work, especially when the element overflows the viewport.

Instead of misusing IntersectionObserver, or resorting to polling, it would be convenient to have an api that reports changes to the position of an element.

[arenevier]

pinging @samthor who wrote the library I mentioned above.

[Loirooriol]

Position with respect to what? The screen, the containing block, the scrolling container, ...?

[arenevier]

I was thinking relative to the viewport. This seems the most useful to me. If the user want to know the position relative to an ancestor or any other specific node, they could still use the api, monitor both elements for position changes, and check whether both elements have moved relative to each other.

Another option would be to pass on optional relativeTo parameter, that would default to the viewport if not set.

[ydaniv]

I would love to have some sort of PositionObserver to track element's layout-only position changes. So not so much depend on transforms and not really care of relative to viewport, but rather relative to any ancestor containing block.
I've had to write custom logic for this purpose numerous times.