From 5b5b6e30ba07031766d7378002954bc0bad0839c Mon Sep 17 00:00:00 2001 From: Frank Koenders Date: Mon, 3 Apr 2023 12:10:04 +0200 Subject: [PATCH 1/6] feat: add support for JavaScript channels --- .../lib/src/web_webview_controller.dart | 30 +++++++++++++++++++ 1 file changed, 30 insertions(+) diff --git a/packages/webview_flutter/webview_flutter_web/lib/src/web_webview_controller.dart b/packages/webview_flutter/webview_flutter_web/lib/src/web_webview_controller.dart index 52f93f911e40..45bdd74ccc34 100644 --- a/packages/webview_flutter/webview_flutter_web/lib/src/web_webview_controller.dart +++ b/packages/webview_flutter/webview_flutter_web/lib/src/web_webview_controller.dart @@ -2,6 +2,7 @@ // Use of this source code is governed by a BSD-style license that can be // found in the LICENSE file. +import 'dart:collection'; import 'dart:convert'; import 'dart:html' as html; @@ -57,6 +58,10 @@ class WebWebViewController extends PlatformWebViewController { WebWebViewControllerCreationParams get _webWebViewParams => params as WebWebViewControllerCreationParams; + /// Mapping between channel names and message event handlers. + HashMap javascriptChannels = + HashMap(); + @override Future loadHtmlString(String html, {String? baseUrl}) async { // ignore: unsafe_html @@ -106,6 +111,31 @@ class WebWebViewController extends PlatformWebViewController { encoding: encoding, ).toString(); } + + @override + Future addJavaScriptChannel( + JavaScriptChannelParams javaScriptChannelParams, + ) async { + final Null Function(html.Event) handler = (html.Event event) { + if (event is html.MessageEvent) { + javaScriptChannelParams.onMessageReceived( + JavaScriptMessage(message: event.data.toString())); + } + }; + + javascriptChannels[javaScriptChannelParams.name] = handler; + html.window.addEventListener('message', handler); + } + + @override + Future removeJavaScriptChannel(String javaScriptChannelName) async { + final Null Function(html.Event)? handler = + javascriptChannels[javaScriptChannelName]; + + if (handler != null) { + html.window.removeEventListener('message', handler); + } + } } /// An implementation of [PlatformWebViewWidget] using Flutter the for Web API. From adf825ae4e7c0b22e1053d66d4657440716f85f8 Mon Sep 17 00:00:00 2001 From: Oscar Date: Mon, 10 Apr 2023 10:04:58 +0200 Subject: [PATCH 2/6] chore: add void --- .../lib/src/web_webview_controller.dart | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/webview_flutter/webview_flutter_web/lib/src/web_webview_controller.dart b/packages/webview_flutter/webview_flutter_web/lib/src/web_webview_controller.dart index 45bdd74ccc34..79296d54a641 100644 --- a/packages/webview_flutter/webview_flutter_web/lib/src/web_webview_controller.dart +++ b/packages/webview_flutter/webview_flutter_web/lib/src/web_webview_controller.dart @@ -59,8 +59,8 @@ class WebWebViewController extends PlatformWebViewController { params as WebWebViewControllerCreationParams; /// Mapping between channel names and message event handlers. - HashMap javascriptChannels = - HashMap(); + HashMap javascriptChannels = + HashMap(); @override Future loadHtmlString(String html, {String? baseUrl}) async { @@ -116,7 +116,7 @@ class WebWebViewController extends PlatformWebViewController { Future addJavaScriptChannel( JavaScriptChannelParams javaScriptChannelParams, ) async { - final Null Function(html.Event) handler = (html.Event event) { + final void Function(html.Event) handler = (html.Event event) { if (event is html.MessageEvent) { javaScriptChannelParams.onMessageReceived( JavaScriptMessage(message: event.data.toString())); @@ -129,7 +129,7 @@ class WebWebViewController extends PlatformWebViewController { @override Future removeJavaScriptChannel(String javaScriptChannelName) async { - final Null Function(html.Event)? handler = + final void Function(html.Event)? handler = javascriptChannels[javaScriptChannelName]; if (handler != null) { From 1be348ebc5a7a4140de6e0be3f3438be08809856 Mon Sep 17 00:00:00 2001 From: Oscar Date: Mon, 10 Apr 2023 10:35:08 +0200 Subject: [PATCH 3/6] refactor: private handler to avoid analyzer error --- .../lib/src/web_webview_controller.dart | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/webview_flutter/webview_flutter_web/lib/src/web_webview_controller.dart b/packages/webview_flutter/webview_flutter_web/lib/src/web_webview_controller.dart index 79296d54a641..d5b00325b140 100644 --- a/packages/webview_flutter/webview_flutter_web/lib/src/web_webview_controller.dart +++ b/packages/webview_flutter/webview_flutter_web/lib/src/web_webview_controller.dart @@ -116,15 +116,15 @@ class WebWebViewController extends PlatformWebViewController { Future addJavaScriptChannel( JavaScriptChannelParams javaScriptChannelParams, ) async { - final void Function(html.Event) handler = (html.Event event) { + void _handler(html.Event event) { if (event is html.MessageEvent) { javaScriptChannelParams.onMessageReceived( JavaScriptMessage(message: event.data.toString())); } - }; + } - javascriptChannels[javaScriptChannelParams.name] = handler; - html.window.addEventListener('message', handler); + javascriptChannels[javaScriptChannelParams.name] = _handler; + html.window.addEventListener('message', _handler); } @override From 01c905f393bf590fa4a93005fda107e29f56ca21 Mon Sep 17 00:00:00 2001 From: Frank Koenders Date: Mon, 17 Apr 2023 16:53:25 +0200 Subject: [PATCH 4/6] chore: fix no_leading_underscores_for_local_identifiers linter warning --- .../webview_flutter_web/lib/src/web_webview_controller.dart | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/webview_flutter/webview_flutter_web/lib/src/web_webview_controller.dart b/packages/webview_flutter/webview_flutter_web/lib/src/web_webview_controller.dart index d5b00325b140..eaff98930bb9 100644 --- a/packages/webview_flutter/webview_flutter_web/lib/src/web_webview_controller.dart +++ b/packages/webview_flutter/webview_flutter_web/lib/src/web_webview_controller.dart @@ -116,15 +116,15 @@ class WebWebViewController extends PlatformWebViewController { Future addJavaScriptChannel( JavaScriptChannelParams javaScriptChannelParams, ) async { - void _handler(html.Event event) { + void handler(html.Event event) { if (event is html.MessageEvent) { javaScriptChannelParams.onMessageReceived( JavaScriptMessage(message: event.data.toString())); } } - javascriptChannels[javaScriptChannelParams.name] = _handler; - html.window.addEventListener('message', _handler); + javascriptChannels[javaScriptChannelParams.name] = handler; + html.window.addEventListener('message', handler); } @override From b313f906ac2b39b79a044ddb161d79ef2ada8a59 Mon Sep 17 00:00:00 2001 From: Frank Koenders Date: Tue, 18 Apr 2023 08:51:52 +0200 Subject: [PATCH 5/6] docs: update README --- .../webview_flutter_web/README.md | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) diff --git a/packages/webview_flutter/webview_flutter_web/README.md b/packages/webview_flutter/webview_flutter_web/README.md index 03bb6a89052e..50e142d3d256 100644 --- a/packages/webview_flutter/webview_flutter_web/README.md +++ b/packages/webview_flutter/webview_flutter_web/README.md @@ -7,6 +7,8 @@ The following functionality is currently available: - `loadRequest` - `loadHtmlString` (Without `baseUrl`) +- `addJavaScriptChannel` +- `removeJavaScriptChannel` Nothing else is currently supported. @@ -22,6 +24,21 @@ yet, so it currently requires extra setup to use: Once the step above is complete, the APIs from `webview_flutter` listed above can be used as normal on web. +### JavaScript channels + +Contrary to the Android and iOS implementations, the `addJavaScriptChannel` +method does not create a named channel; the channel can only be accessed using +`window.parent`. In order to send a cross-platform message over a channel named +`flutterApp`, the following construction can be used in the web application: + +```ts +if (window.flutterApp) { + window.flutterApp.postMessage(message); +} else if (window.parent) { + window.parent.postMessage(message, targetOrigin); +} +``` + ## Tests Tests are contained in the `test` directory. You can run all tests from the root From bd2f600920df4af57890aed2a184b824d7213ba2 Mon Sep 17 00:00:00 2001 From: Frank Koenders Date: Tue, 18 Apr 2023 08:53:00 +0200 Subject: [PATCH 6/6] chore: bump version number --- packages/webview_flutter/webview_flutter_web/CHANGELOG.md | 4 ++++ packages/webview_flutter/webview_flutter_web/pubspec.yaml | 2 +- 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/packages/webview_flutter/webview_flutter_web/CHANGELOG.md b/packages/webview_flutter/webview_flutter_web/CHANGELOG.md index 38f28aaf222e..95d3e2ca4a92 100644 --- a/packages/webview_flutter/webview_flutter_web/CHANGELOG.md +++ b/packages/webview_flutter/webview_flutter_web/CHANGELOG.md @@ -3,6 +3,10 @@ * Updates minimum Flutter version to 3.3. * Aligns Dart and Flutter SDK constraints. +## 0.2.3 + +* Adds implementation for `WebWebViewController.addJavaScriptChannel` and `WebWebViewController.removeJavaScriptChannel`. + ## 0.2.2+1 * Updates links for the merge of flutter/plugins into flutter/packages. diff --git a/packages/webview_flutter/webview_flutter_web/pubspec.yaml b/packages/webview_flutter/webview_flutter_web/pubspec.yaml index 845d5785232e..cff5d7f08641 100644 --- a/packages/webview_flutter/webview_flutter_web/pubspec.yaml +++ b/packages/webview_flutter/webview_flutter_web/pubspec.yaml @@ -2,7 +2,7 @@ name: webview_flutter_web description: A Flutter plugin that provides a WebView widget on web. repository: https://github.com/flutter/packages/tree/main/packages/webview_flutter/webview_flutter_web issue_tracker: https://github.com/flutter/flutter/issues?q=is%3Aissue+is%3Aopen+label%3A%22p%3A+webview%22 -version: 0.2.2+1 +version: 0.2.3 environment: sdk: ">=2.18.0 <4.0.0"