In a PWA coded for Safari in iPadOS 14 I'm using a simple listener for showing a popup when clicking on a button. While this was working well including iPadOS 14.6, the same code isn't in iPadOS 15.0.
The listener "touchend" caused the popup showing only for a microsecond and closing it again. The same action works just fine when using the listener "click" only. But the action "touchend" is much more intuitive.
$('.popup').on('touchend click', function(e) {
e.preventDefault();
$('#popup-content').toggleClass('d-flex d-none');
});
Also when touching any button for >0.5s, an empty small window (the callout) is shown. In iPadOS 14 this behavior could be prevented by simple CSS:
-webkit-user-select: none;
user-select: none;
-webkit-touch-callout: none;
How to prevent both behavior in the latest iPadOS 15?
The simple solution I found is to add a "touchstart" listener with a preventDefault() to the same button:
$('.popup').on('touchstart', function(e) {
e.preventDefault();
});
Both actions behave the same as in iPadOS 14 again.