Skip to content

Commit

Permalink
[DevTools] Enable pointEvents while scrolling (#30560)
Browse files Browse the repository at this point in the history
[`react-window` disables `pointerEvents` while scrolling meaning you
can't click anything while
scrolling.](bvaughn/react-window#128).

This means that the first click when you stop the scroll with inertial
scrolling doesn't get registered. This is suuuper annoying. This might
make sense when you click to stop on a more intentional UI but it
doesn't makes sense in a list like this because we eagerly click things
even on mousedown.

This PR just override that to re-enable pointer events.

Supposedly this is done for performance but that might be outdated
knowledge. I haven't observed any difference so far.

If we discover that it's a perf problem, there's another technique we
can use where we call `ownerDocument.elementFromPoint(e.pageX, e.pageY)`
and then dispatch the event against that element. But let's try the
simplest approach first?
  • Loading branch information
sebmarkbage authored Aug 1, 2024
1 parent 4ea12a1 commit 06d0b89
Showing 1 changed file with 4 additions and 1 deletion.
Original file line number Diff line number Diff line change
Expand Up @@ -586,7 +586,10 @@ function InnerElementType({children, style}) {
// A lot of options were considered; this seemed the one that requires the least code.
// See https://github.com/bvaughn/react-devtools-experimental/issues/9
return (
<div className={styles.InnerElementType} ref={divRef} style={style}>
<div
className={styles.InnerElementType}
ref={divRef}
style={{...style, pointerEvents: null}}>
<SelectedTreeHighlight />
{children}
</div>
Expand Down

0 comments on commit 06d0b89

Please sign in to comment.