search

KingSora / OverlayScrollbars

A javascript scrollbar plugin that hides the native scrollbars, provides custom styleable overlay scrollbars, and preserves the native functionality and feel.
https://kingsora.github.io/OverlayScrollbars
MIT License
3.91k stars 215 forks source link

Double-tap needed in iOS 13.3.x on any component using OverlayScrollbars #195

Closed Eric24 closed 4 years ago

Eric24 commented 4 years ago

After just upgrading from iOS 12.3.1 to 13.3.1, all components in our React app that are using OverlayScrollbars now require two taps to select the target element.

We did try using https://github.com/ftlabs/fastclick as a suggested solution. It does resolve the issue, but it's a fairly old and relatively unsupported library, so we weren't comfortable with this solution. Also, I suspect that whatever fastclick does to fix this issue might be overkill for the actual root cause.

Our current solution is to remove OverlayScrollbars on iOS (the problem occurs on all browsers: Safari, Chrome, and Firefox).

We have not been able to find the root cause of the issue.

KingSora commented 4 years ago

Good day!

Can you try to set the option scrollbars: { touchSupport: false } (its true by default). I don't think it will solve the issue, but you could give it a try.

Edit: In case you are using a different option for the autoHide option than "never" please try to set it to "never".

apuntovanini commented 4 years ago

Related to #199 I tried with disabling touchSupport - it doesn't work, still requires double tap, and autoHide: "never". The latter works, but of course it's not the expected behaviour. Plus the handle flickers a bit: You can try it at https://5e874ca201cf8fd8e7874288--guidu.netlify.com/

KingSora commented 4 years ago

I'm willing to fix this issue in the next release, but I really don't know how to test it. Is there some demo I can use in order to test my fix? I don't know for what I have to look for.

apuntovanini commented 4 years ago

Do you think it's related to flexbox / css properties?

KingSora commented 4 years ago

@apuntovanini no, I think it is related to touchevents. Basically this happens if the host element has any touch events applied. But I'm not able to test this theory yet because I don't have suitable test environment.

KingSora commented 4 years ago

Please try the new version 1.12.0 where I believe this bug is fixed.

apuntovanini commented 4 years ago

@KingSora sorry for not answering earlier, but glad to tell you that it works! At least, in my use case I don't see the issue anymore. Thanks for such a quick fix Let me know if you need any help in testing!

KingSora commented 4 years ago

@apuntovanini Nice, I'm glad it works for you! I'll wait a bit for @Eric24 response before I'll close this issue.

KingSora commented 4 years ago

@Eric24 is this problem solved with the new update?

KingSora commented 4 years ago

I'll close this issue gue to inactivity. Please feel free to reopen it, if this problem wasn't solved.

jon001 commented 4 years ago

I'm afraid I'm still seeing the double-tap issue in iOS 13.6 (iPad 7th gen) using Safari or Chrome with version 1.13.0 of OverlayScrollbars.

scrollbars: {autohide: 'never'} does resolve that but we do prefer the auto-hide behaviour.