#3667·react-dnd

TouchBackend not working properly on mobile devices

Author: lokthrowCreated Jun 30, 2025Updated Jul 25, 2025

I am developing a platform that needs to drag, drop, resize and rotate elements. All works fine with the HTML5Backend, the problem starts using the TouchBackend (either as is or through react-dnd-multi-backend).

In my case, I drag an element from a Drawer and drop it in a Box, that works fine. Once the element is created in the Box:

  • It can be dragged just touching and moving, but its "preview" appears with a big offset, if I touch first, then touch + move, the "preview" appears where it should.
  • Once the element is dropped, it cannot be moved again unless I touch the background and touch the element again.
  • If I touch the element I show resize/rotate controls, if I try to use them (even using stopPropagation()), the element seems to be moving, but it is moving AND doing the action (i.e. moving and resizing, when I release the touch it moved and changed its size) but it only should be doing the action.

Expected behavior

  • It can be dragged just touching and moving, and the "preview" appears where it should.
  • Once the element is dropped, it can be dragged again without touching the background.
  • If I touch components inside my draggable element with stopPropagation() the drag should not start.

Desktop (please complete the following information): It is not working in a desktop browser with dev options simulating a touch device nor an Android Simulator with Chrome.