Touch events works in Safari and Chrome but not on WKWebView with Capacitor

I’m using my own event listeners to pinch/zoom a div element inside <ion-content>. It works well when I open the app with Safari in my localhost, but when it is builded with Capacitor with XCode, it doesn’t.

I’ve looking in the Safari Dev Tools what is happening with Safari and with the deployed Capacitor IPA with WKWebView. It seems that IPA version the touch event is never triggered.

So, the effect desired is: log the touch/gesture event and move the div, as the doMovement function is called.

In Safari Browser and the Web Inspector, everything is ok and happens as it should be. But when is already in the iOS App version, doesn’t. What should I do to solve this inconsistency?

My code is like that:

<template>
    <ion-page>
        <ion-header></ion-header>
        <ion-content>
            <div ref="container">
                <h1>Digite o título</h1>
                <h2>Digite seu conteúdo aqui</h2>
            </div>
        </ion-content>
    </ion-page>
</template>


<script lang="ts" setup>
onMounted(() => {
    const container = (getCurrentInstance() as any).ctx.$refs['container'];

    container.addEventListener('touchstart', function(e:any){
        console.log('touchstart', e)
        doMovement(e)
    })
    container.addEventListener('touchmove', function (e:any) {
        console.log('touchmove', e)
        doMovement(e)
    })
    container.addEventListener('touchend', function (e:any){
        console.log('touchend', e)
        doMovement(e)
    })

    window.addEventListener("gesturestart", function (e:any) {
        console.log('gesturestart', e);
        doMovement(e)
    });
    window.addEventListener("gesturechange", function (e:any) {
        console.log('gesturechange', e)
        doMovement(e)
    })
    window.addEventListener("gestureend", function (e:any) {
        console.log('gestureend', e)
        doMovement(e)
    });
})
</script>

What occurs on Safari:
Safari

What happen when it’s already built in Capacitor WKWebView:
WKWebView

you should be using ionic’s gesture component for this. Gestures | Ionic App Utility for Custom Gestures and Interactions

@Hills90210, the Gestures API is also with the same issue: on the Safari the onMove, onStart and onStop callbacks are fired, but when it is builded on Capacitor, they don’t get fired.