Open LeoLeoni opened 1 month ago
Does the same issue happen when only using the ResizeObserver global? I have a suspicion that this is not specific to the hook, but the way RO works.
The same issue happens when using the ResizeObserver global which defaults to window.ResizeObserver
which is the observer on the main window, not the child window. I've dealt issues with functions of window in the past and the solution is to get the window in which the ref element is rendered in rather than the window global. If there were any way to integrate something like this it would likely solve the issue:
const refToObserve = useRef<Element>(); // Passed to use-resize-observer
const currentDocument: Document = ref.current.ownerDocument;
const currentWIndow: Window = currentDocument.defaultView;
const ro = currentWindow.ResizeObserver(...)
When the component I am trying to observe is rendered in a separate window, it seems like it's size is not observed until hovering over the main window with the mouse.
I've made a minimally reproducible example here: https://github.com/LeoLeoni/floating-resize-observer
Steps to reproduce:
npm install
, andnpm run dev