Repository navigation
WebView touchstart events are invoked even when the WebView is not hit tested on iOS #30143
Description
Internal: b/126614142
Internal: b/285315999
Sample repro app:
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';
void main() => runApp(MaterialApp(home: WebViewExample()));
class WebViewExample extends StatelessWidget {
final Completer<WebViewController> _controller =
Completer<WebViewController>();
@override
Widget build(BuildContext context) {
return Scaffold(
body: WebView(
initialUrl: 'https://master-docs-flutter-io.firebaseapp.com/',
javascriptMode: JavascriptMode.unrestricted,
onWebViewCreated: (WebViewController webViewController) {
_controller.complete(webViewController);
},
onPageFinished: (String url) {
injectTouchListener();
},
javascriptChannels: <JavascriptChannel> [
JavascriptChannel(name: 'Log', onMessageReceived: (JavascriptMessage msg) { print(msg.message); })
].toSet() ,
),
floatingActionButton: FloatingActionButton(
child: Container(color: Colors.orange,),
onPressed: () {}
),
);
}
Future<void> injectTouchListener() async {
final WebViewController controller = await _controller.future;
controller.evaluateJavascript("document.addEventListener('touchstart', (event) => { Log.postMessage(String(event)); }, true);");
}
}On iOS the message is printing even when tapping the FAB.
Metadata
Metadata
Assignees
Labels
Critical issues such as a build break or regressionEmbedding Android/iOS views in Flutter appsFound to occur in 2.2Found to occur in 2.5The WebView pluginflutter/packages repository. See also p: labels.iOS applications specificallyIssue is closed as already fixed in a newer versionOwned by iOS platform teamTriaged by iOS platform team
Activity
amirh commentedon Mar 28, 2019
cc @cyanglaz
cyanglaz commentedon Apr 2, 2019
Spent some time investigate this issue with @amirh and @chinmaygarde debugging this issue. We tried replacing 'touchstart' with a different event like 'click', it works fine. We think there could be some special case handling for events like 'touchstart' in iOS. We have not found any way to work around it.
Meanwhile, if anyone encounter this issue, I suggest working around it with a different event type on the web application.
asavartsov commentedon Oct 19, 2020
In my case, it even worse. When I tap a block in front of WebView, WebView receives touchstart, but does not receive touchend. And it will receive touchend on the next tap with new touchstart right after it.
This behavior breaks my Leaflet map completely. It behaves like always touched.
controller.reload()does fix this behavior until the next touch of any block in front of WebView.Adding IgnorePointer/AbsorbPointer does not help here. Somehow the page inside WebView still receives touchstart/touchend.
I think other issues about broken map controls could probably have the same source of a problem.
Both of WebView/iOS/touch-related proposed fixes at
macoshita/plugins@65113db
and
https://gist.github.com/Voxar/5dbef0b76cc8cb55d2fe74a492d41c54
does not work for me.
I'm testing on iOS 13.6.
asavartsov commentedon Oct 19, 2020
A little clarification. As for Leaflet, it actually does not use these touch events on iOS by default. Leaflet detects support for pointer events and uses them instead of touchstart/touchend. And glitches occur because of this: if WebView is touched directly it does receive pointerup and pointerdown. But if a block in front of WebView is touched, pointerdown event is leaking to DOM event listener, but somehow pointerup event does not occur leaving pointerdown alone in the Leaflet's internal array of pointer events. For my project I fixed that by overriding pointer detection @ https://github.com/Leaflet/Leaflet/blob/9b0d7c2a7023e6a83222d96febaee74880601ad8/src/core/Browser.js#L96 setting it to false. Leaflet fallbacks to touchstart/touchend and even though it does receive events from other blocks when it shouldn't because of this bug, it maintains internal state correctly.
danagbemava-nc commentedon Aug 9, 2021
The issue is reproducible on the latest
master (2.5.0-6.0.pre.29)andstable (2.2.3)with the latestwebview_flutter: ^2.0.10.flutter doctor -v
ggirotto commentedon Mar 29, 2022
We are facing the exactly same issue as @asavartsov described in iOS 15.4 and flutter 2.10.3 when using
UiKitView.39 remaining items
[pointer_interceptor] Fully publish pointer_interceptor package (#5640)
LouiseHsu commentedon Dec 11, 2023
The new pointer_interceptor package should be available on pub.dev. now! https://pub.dev/packages/pointer_interceptor
github-actions commentedon Dec 26, 2023
This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of
flutter doctor -vand a minimal reproduction of the issue.