-
Notifications
You must be signed in to change notification settings - Fork 326
Description
Describe the bug
When using useDrag() with filterTaps and preventScroll on the from value isn't recalculated after a tap occurs when viewed on iOS. On a desktop it seems fine.
I've made a reproduction case to demonstrate this: https://stackblitz.com/edit/vitejs-vite-qgtx5cqq?file=src%2FApp.tsx (if that doesn't load on iOS you might need to hit the download project icon on a desktop, open up the downloaded directory and run npm install && npm run dev then load it on an iPhone)
On a desktop if you click "Move" the box should move 200px to the right, then attempt to drag the coloured box left or right it should follow the cursor. If you do that on iOS (and possibly other mobile platforms) it quickly reverts back to its starting position first then follows the cursor but offset by 200px.
I've had a bit of a play round and and as far as I can tell it seems that something like this is happening when tapping: The about pointerdown event fires which sets startPointerDrag to run in a timeout (https://github.com/callumgare/use-gesture/blob/319b8506e417bdf3e09607036a3973a7a60e92b5/packages/core/src/engines/DragEngine.ts#L319) then pointerup fires very shortly after with no pointermove event. After that startPointerDrag runs. In startPointerDrag _active is set to true. _active then remains true when doing the drag gesture. Because of this lastOffset isn't set (https://github.com/callumgare/use-gesture/blob/319b8506e417bdf3e09607036a3973a7a60e92b5/packages/core/src/engines/Engine.ts#L186).
One possible fix seems to be to remove the startPoitnerDrag timeout when pointerup runs. I've played around with that and that seems to fix the issue: callumgare@319b850
However I have only the most cursory understanding of the code base so it could quite likely break other things. Just thought I'd include that in case it helps.
Thanks for your consideration and time maintaining a super helpful library!
Information:
- Use Gesture version: 10.3.1
- Device: iPhone 15 Pro running iOS 26
- OS: iOS 26
- Browser: Safari
Checklist:
- I've read the documentation.
- If this is an issue with drag, I've tried setting
touch-action: noneto the draggable element.