Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Button onClick is not triggered after holding press down for few seconds before release on mobile #11527

Closed
1 of 2 tasks
victor77dev opened this issue May 21, 2018 · 3 comments
Labels
out of scope The problem looks valid but we won't fix it (maybe we will revisit it in the future)

Comments

@victor77dev
Copy link

victor77dev commented May 21, 2018

  • This is a v1.x issue (v0.x is no longer maintained).
  • I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior

Button onClick expected to be triggered whenever the button was clicked, even it is hold down for few seconds. Expected the onClick event will be triggered after release.

Current Behavior

However, the expected onClick event only works in pc (tested in pc's chrome v66.0.3359.181) and iPhone 8 (tested with default browser), but not in mobile (tested on Redmi 3s 's chrome browser and iPhone 6 with default browser). If I choose the devices (iPhone5/6/7 or Pixel2) in chrome developer tools, it also doesn't work.

Steps to Reproduce (for bugs)

Related issue: victor77dev/touch25/#1
With mobile or choosing mobile devices in chrome developer tool
Click number buttons on https://victor77dev.github.io/touch25/
Or "OPEN MENU" button in "Simple Menu" session on mateter-ui Demo page (https://material-ui.com/demos/menus/)

  1. To see the normal behavior, Click the button and Menu will be shown for Demo page(Click the number and red/green color will be shown for touch25)
  2. To reproduce the issue, Press the button and hold for few seconds
  3. Release the button and the normal behavior will not happen (No menu shows / No red or green color show)

Context

Your Environment

Tech Version
Material-UI v1.0.0-beta.47
React 16.3.2
browser chrome
Mobile RedMi 3s, iPhone6
@oliviertassinari oliviertassinari added the out of scope The problem looks valid but we won't fix it (maybe we will revisit it in the future) label May 21, 2018
@oliviertassinari
Copy link
Member

oliviertassinari commented May 21, 2018

@victor77dev Here is the difference between web and native.
On all the major mobile website I could find, I can reproduce the current Material-UI behavior. On the other hand, I could reproduce your expected behavior on all the native apps I have tried.
Material-UI relies on the native onClick event the browser is emitting. I don't think that we should be opinionated about it.

However, if you want to change the behavior, you definitely can. Build your custom event handler. Maybe even use https://github.com/JedWatson/react-tappable.

@oliviertassinari
Copy link
Member

Nice game by the way!

@victor77dev
Copy link
Author

Thanks for your help. I will check the native apps and react-tappable implementations for that.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
out of scope The problem looks valid but we won't fix it (maybe we will revisit it in the future)
Projects
None yet
Development

No branches or pull requests

2 participants