react
react copied to clipboard
feat(devtools): improve "hover to inspect" and shadow root compat
fix #25519
Summary
I made two changes in this PR.
- I use
event.composedto detect if an event is originated in a ShadowRoot (which the real target is not reflected onevent.target, butevent.composedPath()[0]). - I use
pointermoveinstead ofpointeroverto detect the latest hovering element. This change also related to the ShadowRoot, in this case,pointeroverwon't fire correctly (for the devtools use case) in order to select the latest hovering element.
div.root
shadow-root
div.a
div.b
When you hover on div.a, pointerover will fire on div.root because div.a is inside a ShadowRoot, then,
when the hover target changed to div.b, no new pointerover event will be fired because the hover target is still inside the same ShadowRoot.