PinchZoom.js not working on iOS devices after 13.4 update by Apple

Question

So I have run into a problem again with this plugin- PinchZoom.js which started happening after the 13.4 update by Apple for iOS devices.

The problem is that the double tap feature has suddenly stopped working completely on iOS devices now.

For a concrete test, you can refer to the plugin demo page: http://manuelstofer.github.io/pinchzoom/demo/pinchzoom.html

On iOS devices, you won't be able to double tap to zoom in the image whereas this was working fine in previous versions of iOS.

I have even dived down in the source code of the plugin but I am not sure what is causing the double tap TO NOT work in iOS devices after the update.

If anyone has any idea/workaround for this, it would be very helpful.

Thanks

Answer 1

On all browsers there used to be a delay of 300-350ms on touchstart events. Apparently, on iOS there still is. You can test this by logging tap events and time in the touchstart event listener.

And for your issue, you could either solve it by modifying pinchzoom.js to use touchend which has no delay instead of touchstart, or by preventing default behaviour on the touchstart.

I chose the latter and added event.preventDefault() to the touchstart event listener. You can do that too, until the developer provides an official solution.

el.addEventListener('touchstart', function (event) {
    event.preventDefault(); //add this

    if (target.enabled) {
        firstMove = true;
        fingers = event.touches.length;
        detectDoubleTap(event);
    }
});