dimsemenov
Multiple events are being emitted and processed when clicking on next/previous button when on a mobile device
Hello!
There's currently an issue on mobile browsers where both click and pswpTap events are being triggered causing actions to be handled twice. This is evident when navigating via the next/previous buttons in the gallery which causes the gallery to skip a slide.
The project that I'm working on where I initially discovered the bug is using version 4.1.x but I've confirmed that this bug is also present in the latest v5.2.x via the demo in https://photoswipe.com/
Please see attached video:
https://user-images.githubusercontent.com/15166670/175207397-94f3f878-db1f-43b8-af2c-4b0d7a2b4234.mov
If a fix for this is made, how likely would it be for it to be backported to v4? As migrating to v5 would not be an option for my team at the moment.
I'm happy to try and work towards a fix in my spare time, the main blocker I've had is that I've been unable to get v4 of the project building as I only have access to M1 hardware and haven't managed to get some of the project dependencies to work.
Further Information
Here's some information that I've gathered when debugging using v4 of photoswipe
When photoswipe is opened on a tablet or using the trackpad on my mac both click and pswpTap events are emitted and processed:
This has mainly only been observed on safari and firefox (dev tools simulator) and not on chrome (dev tools simulator) because chrome emits a PointerEvent instead of a click event:
The logs above were generated after clicking on either of the left or right arrow buttons only once
That's quite a curious issue. In v5 the click handler for the buttons is very simple, it's just onclick https://github.com/dimsemenov/PhotoSwipe/blob/4391b0d73ab66c9c20b9d17018ebb63a799ef169/src/js/ui/ui-element.js#L151
So I'm not sure why would it trigger twice sometimes. I'll investigate.
In v4 this handler is quite different since it supported old versions of Android, which had funky stuff with ghost clicks. It's unlikely I'll patch the old version since it has an outdated toolkit, so feel free to edit the UI yourself. Or consider migrating to the new version.
I'd assume that this can be fixed via preventDefault or/and stopPropagation. Or touch-action CSS property.
