ios15 Safari- disable opening tab bar on double tap

Question

How I can prevent opening of tab bar every time user double clicks on my web page on new ios 15 safari in portrait mode.

Answer 1

One way to prevent the floating address bar from popping up on tap or swipe is to use preventDefault() on touch / mouse events. I have found this is working for me on iOS 15 Beta 4 when dealing with a canvas taking up the full screen:

const preventDefault = (evt) => {
    evt.preventDefault()
}

// Make sure to remove these event listeners later.
canvas.addEventListener('touchmove', preventDefault)
canvas.addEventListener('touchend', preventDefault)
canvas.addEventListener('touchstart', preventDefault)
canvas.addEventListener('mousedown', preventDefault)

If you don't have a canvas you'll instead want to attach it to a different full screen DOM element. In my testing I found some issues with using document or body, so you may need to do some work & testing to determine what works and is safe to use (i.e. doesn't prevent button's from working).