Issues with Pan, Zoom, and Selection in iOS WebView using flutter_inappwebview

[Sunsiha]

Is there an existing issue for this?

• I have searched the existing issues

Current Behavior

I'm facing several issues with WebView behavior on iOS while using flutter_inappwebview. My WebView is designed to display a tutorial flow that involves rotating, panning, zooming, and selecting portions of the content. The issues are detailed below:

Issues:
Pan and Zoom:

On Android, everything works perfectly.
On iOS, rotation works fine, but enabling supportZoom: true causes either zoom or pan to work, but not both simultaneously. I need both to function together as they do on Android.
Selection Issue:

When I select a portion of the content, it works the first time. However, selecting another portion afterward doesn't work. There seems to be a delay or touch event issue that isn't as smooth as on Android.
I have tried setting preventGestureDelay: true, but it didn't resolve the problem as expected.

Rare Console Error:
Occasionally, I get the following error:

Could not signal service com.apple.WebKit.WebContent: 113: Could not find specified service

I'm not sure if this is related to the issue, but thought it might be worth mentioning.

First, after clicking the button, I can perform rotation, then panning, followed by zooming, and finally selecting. After that, I should be able to make multiple selections on the screen. However, once I click on one point, I am unable to select anything else.

Expected Behavior

1. Both pan and zoom should work simultaneously, as they do on Android.
2. Smooth selection between different portions of the WebView.

Steps with code example to reproduce

InAppWebView(
  keepAlive: keepAlive,
  key: webViewKey,
  initialUrlRequest: URLRequest(
    url: WebUri(webViewModelUrl!),
  ),
  initialSettings: InAppWebViewSettings(
    clearCache: true,
    cacheEnabled: false,
    javaScriptEnabled: true,
    isFraudulentWebsiteWarningEnabled: false,
    allowsLinkPreview: true,
    allowsBackForwardNavigationGestures: true,
    supportZoom: false,
  ),
  preventGestureDelay: true,
  onPermissionRequest: (controller, request) async {
    print('request$request');
    return PermissionResponse(
      resources: request.resources,
      action: PermissionResponseAction.GRANT,
    );
  },
  onReceivedHttpAuthRequest: (controller, challenge) async {
    return HttpAuthResponse(
      username: userName,
      password: password,
      action: HttpAuthResponseAction.PROCEED,
      permanentPersistence: true,
    );
  },
  onConsoleMessage: (controller, consoleMessage) {
    print('consoleMessage$consoleMessage');
  },
  onLoadStart: (controller, url) {},
  onLoadStop: (controller, url) async {
    await webViewController!.evaluateJavascript(source: '''
      (function() {
        var viewport = document.querySelector('meta[name="viewport"]');
        if (viewport) {
          viewport.parentNode.removeChild(viewport); // Remove mobile viewport meta tag
        }
        var newViewport = document.createElement('meta');
        newViewport.name = "viewport";
        newViewport.content = "width=1024"; // Force desktop width
        document.head.appendChild(newViewport);
      })();
    ''');
  },
  onWebViewCreated: (controller) {
    webViewController = controller;
    isLoading();
    webViewController?.addJavaScriptHandler(
      handlerName: 'FlutterChannel',
      callback: (args) {
        print("args==$args");
        return "Message received by Flutter!";
      },
    );
  },
)

Flutter version

Flutter version: Flutter 3.24.3 • channel stable Dart version: 3.5.3

Operating System, Device-specific and/or Tool

all iOS devices

Plugin version

v6.1.5

Additional information

Possible Related Error:

Could not signal service com.apple.WebKit.WebContent: 113: Could not find specified service

[SystemGestureGate] <0x11fd0fff0> Gesture: System gesture gate timed out.

Tried using touch-action: manipulation; as well.

https://webkit.org/blog/5610/more-responsive-tapping-on-ios/
#1268

Self grab

• I'm ready to work on this issue!