isaacHagoel / svelte-dnd-action

An action based drag and drop container for Svelte
MIT License
1.67k stars 100 forks source link

Click functions on children of items don't fire on touch events #557

Open Draconizations opened 1 month ago

Draconizations commented 1 month ago

0.9.43 introduces a bug where click functions of children of items (i.e. a button inside a dnd item) will not fire on touch devices. Calling e.stopPropagation or e.stopImmediatePropagation in the child click handler does not work here.

There is a workaround. Adding a touchend listener to the child element, with the same handler as the onclick listener, seems to function identically to the old behavior, and it doesn't activate after actually dragging the item.

Figured I'd open an issue, in case there is an actual fix that can be added to the library itself. As well as notify others that there is a workaround here.

isaacHagoel commented 1 month ago

Thanks for reporting. I'll try to make time tomorrow or early next week to look into possible solutions

WhyAsh5114 commented 1 month ago

same issue here, thanks @Draconizations for the workaround

isaacHagoel commented 1 month ago

Damn, it doesn't reproduce for me in the browser using emulation or on my Google Pixel. This is what I tried: https://svelte.dev/repl/68d1c34d92f04c0f9f89d1d3ca47324a?version=4.2.15 Am I doing something wrong, if not what are you using to reproduce the issue?

WhyAsh5114 commented 1 month ago

it seems like using a button for a drag handle causes some issues

https://svelte.dev/repl/02030329daf64b129ffe3adbf3cf1403?version=4.2.15 try replacing the div element with a button, and it no longer works as expected, maybe we are supposed to use a div element only? (btw the tailwindcss doesn't work unless u change a style or so, just modify any inline style a bit and it starts working)

WhyAsh5114 commented 1 month ago

ok, noticed something much weirder and the actual reason why I started experience this bug in the first place

https://svelte.dev/repl/df0a77452e324e10bd205aa6d613125d?version=4.2.15 when I use a svg inside the drag handle, the click stops working, normal text works as expected