useDrag() on touch devices... Dragging only starts after a delay (long press)

[SachaMPS]

HI everybody,

Topic: useDrag on Touch Devices Requires a Long Press on the "Draggable" Element to Initiate Dragging

Question: Is this behavior by design, or is there a way to bypass this delay and immediately start dragging on press start?

Example: First "useDrag" demo/example in the documentation: https://react-spectrum.adobe.com/react-aria/useDrag.html

This can be best tested on a real device or a Simulator. Using Chrome Dev tools and simulate touch doesnt work to perfectly showcase the topic because Chrome opens the Right-Click Menu even before dragging starts.

Full Description/Question:

Let's take the first example from the "useDrag" demo here:
https://react-spectrum.adobe.com/react-aria/useDrag.html

If you open this page on a mobile/touch device and try to initiate dragging on the element labeled "Drag me," you'll notice that the dragging starts after a slight delay of a few milliseconds. However, when using a regular browser and a mouse, the dragging starts immediately.

Is there a way to circumvent this delay? What is causing this delay? I tried looking at the react-aria source code and running the storybook locally, but I wasn't able to identify the root cause.

Any help or answers would be highly appreciated.

Thank you!

[reidbarber]

This behavior isn't added by React Aria, but is instead how native HTML drag and drop works on touch devices currently (try it here). I assume this behavior exists due to the fact that if dragging started immediately upon touch, it would get unintentionally triggered simply by swiping the page to scroll.

[SachaMPS]

Thank you!