In Flutter I have a simple stateful widget that displays a website in fullscreen. For that I'm using the webview_flutter plugin. Here's a simplified version of the widget where I removed irrelevant variables and functions. As an example the widget shows the Google website in fullscreen:
import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';
class WebViewScreen extends StatefulWidget {
const WebViewScreen({
Key? key,
}) : super(key: key);
@override
State<WebViewScreen> createState() => _WebViewScreenState();
}
class _WebViewScreenState extends State<WebViewScreen> {
@override
void initState() {
super.initState();
}
late WebViewController webViewController = WebViewController()
..setJavaScriptMode(JavaScriptMode.unrestricted)
..setBackgroundColor(const Color(0x00000000))
..setNavigationDelegate(
NavigationDelegate(
onProgress: (int progress) {},
onPageStarted: (String url) {},
onPageFinished: (String url) {},
onWebResourceError: (WebResourceError error) {},
onNavigationRequest: (NavigationRequest request) {
return NavigationDecision.navigate;
},
),
)
..loadRequest(Uri.parse('https://www.google.com/'));
@override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
mainAxisSize: MainAxisSize.min,
children: [
Expanded(
child: WebViewWidget(
controller: webViewController,
),
),
],
),
);
}
}
What I now want to do is to call a JavaScript function (for testing purposes let's just make it alert('Hello World');
) right when the webview loaded (onPageFinished).
How can I achieve this?
I asked ChatGPT-4 this exact question. Its answer was to add
webViewController.evaluateJavascript("alert('Hello World');");
within the onPageFinished method. So:
//...
//onPageFinished: (String url) {
webViewController.evaluateJavascript("alert('Hello World');");
//},
//...
But this results in a problem:
The method 'evaluateJavascript' isn't defined for the type 'WebViewController'. Try correcting the name to the name of an existing method, or defining a method named 'evaluateJavascript'.
When I ask ChatGPT-4 about this problem it only provides answers which make no sense. I assume that has to do with the fact that ChatGPT has less knowledge about more recent developments.
I also found a similar question here but it doesn't seem right because here a "WebView" widget is used instead of the "WebViewWidget" widget that I'm using.
For this library, in order to call javascript functions, you may use
webViewController.runJavaScriptReturningResult(String)