Need explanation on how the v9 changed onDrag

[aldibatyr]

Greetings,

We are currently upgrading react-use-gesture to v9 and noticed that useGesture({onDrag}) seems to be working differently now. The drag gesture drops when the mouse leaves the element that has binding to useGesture. Previously, dragging gesture worked even if you drag for the whole screen width.

I have read the changelog about Drag now uses setPointerCapture and releasePointerCapture. Would you be able to explain what needs to be done to achieve the same functionality as v8 and v7?

Thanks a lot!

[dbismut]

@aldibatyr sidenote but v10 is around the corner, you should probably wait for it instead of using v9. v9 has been around for a long time now.

But to answer your question: prior to v9, the lib used to attached events to the window when mousing down on the dragged element (so that when your mouse leaves the dragged element it still keeps track of the mouse). setPointerCapture removes the need for using the window as when the pointer id is captured, then all subsequent events are passed to the capturing element (ie the dragged element).

In your situation I'm not sure what happens to be honest: it shouldn't change anything in the behavior of the drag. Can you maybe send a codesandbox example reproducing the issue on v9?

[aldibatyr]

Thanks for the prompt answer, I've tried reproducing it, it is a scrubber for video players, tried reproducing it, but there might be something in the underlying logic for our player.

I will look into it, in more detail, thanks a lot.