bcherny / bcherny/draggable

Content clicks don't register on mobile devices

Open
#36 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
203
Forks
53
PR merge metrics
No merged PRs in 30d

Description

Hi!

Great working library, works really well. However, I noticed one thing on mobile browsers:
- if there are buttons inside the dragged content, and you've not specified a drag handle (i.e. making the element itself the handle), those buttons don't work at all - tapping them does nothing

Seen on Samsung Tab S6 Lite and Apple iPad Mini 5 (2019):
- Android 11 Samsung Internet Browser
- Android 11 Chrome
- Android 11 Firefox
- iPadOS 14.6 Safari
- iPadOS 14-6 Firefox

In summary, looks like touch events are handled a little differently from mouse events.

The obvious workaround is to use a drag handle whenever there is clickable content inside - I was just wondering if there is something else that can be done.

Contributor guide

No contributing guide indexed for this repository

Research direction

Reproduce the issue with buttons inside draggable content and no drag handle on the listed Android and iPad browsers, then compare the touch behavior with mouse behavior. Done means the nested buttons respond to taps while dragging still works, without requiring a drag handle.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.