search

kadiryazici / bottom-sheet-vue3

Bottom sheet component for Vue3.
https://kadiryazici.github.io/bottom-sheet-vue3/
MIT License
31 stars 6 forks source link

Bug: Can't click on buttons in sheet components using touch devices #10

Closed hasanparasteh closed 1 year ago

hasanparasteh commented 1 year ago

There's something weird going on with Sheet component. I can freely click on anything that's inside of a Sheet component but only and only on Desktop Operating Systems like MacOs or Linux or Windows and etc.

I can't trigger onclick or any other thing inside sheet with mobile devices (touch devices)!

How to reproduce

Just cloned the project from main branch and run npm run dev -- --host

More Information

Bug appears on: v2.0.2 Browser: bug exists in any browser (I tested last 3 versions of Chrome and Safari) OS: Android/IOS

kadiryazici commented 1 year ago

This is because of library prevents touchstart on swipe start, to do that I should prevent touchmove instead of touchstart I guess.

I will take a look after work.

kadiryazici commented 1 year ago

Currently you can use onlyHeaderSwipe: true, this won't prevent event on body cilck.

hasanparasteh commented 1 year ago

It fixed the bug.. but bottom-sheet has a lot of compatibility issues with touch devices.. for example click-outside won't work on mobile devices properly

kadiryazici commented 1 year ago

Yes it is because of preventint touch start. I will make touchmove non passive listener and prevent it instead :)

kadiryazici commented 1 year ago

@hasanparasteh https://github.com/kadiryazici/bottom-sheet-vue3/pull/11 I hope this fixed it