pichillilorenzo / flutter_inappwebview

A Flutter plugin that allows you to add an inline webview, to use a headless webview, and to open an in-app browser window.
https://inappwebview.dev
Apache License 2.0
3.01k stars 1.33k forks source link

Flutter web: Uncaught (in promise) TypeError: Cannot set properties of undefined (setting 'nativeCommunication') #2076

Closed Anderzzon closed 1 month ago

Anderzzon commented 1 month ago

Environment

Technology Version
Flutter version >=3.2.0 <3.19.3
Plugin version 6.0.0
Android version
iOS version
macOS version
Xcode version
Google Chrome version 123.0.6312.59

Device information:

Description

I updated from 5.8.0 to 6.0.0 but now I can't get the project to run on web. No problems in apps.

Expected behavior: Flutter web should not crash

Current behavior: Crashes on startup

Steps to reproduce

I tried to remove the imports and references in the code but still didn't work. When I uninstalled flutter_inappwebview, the project could then run in web again again.

Stacktrace/Logcat

Uncaught (in promise) TypeError: Cannot set properties of undefined (setting 'nativeCommunication') at InAppWebViewFlutterPlugin.registerWith (web_platform.dart:36:5) at Object.registerPlugins (web_plugin_registrant.dart:49:29) at web_entrypoint.dart:27:24 at initialization.dart:37:9 at Generator.next (<anonymous>) at runBody (async_patch.dart:84:54) at Object._async [as async] (async_patch.dart:127:5) at _engine.AppBootstrap.new.<anonymous> (initialization.dart:35:16) at Object._checkAndCall (operations.dart:550:37) at Object.callMethod (operations.dart:620:10) at Object.dsend (operations.dart:624:5) at _engine.AppBootstrap.new.autoStart (app_bootstrap.dart:31:18) at autoStart.next (<anonymous>) at async_patch.dart:45:50 at _RootZone.runUnary (zone.dart:1661:54) at _FutureListener.thenAwait.handleValue (future_impl.dart:162:18) at handleValueCallback (future_impl.dart:838:44) at _Future._propagateToListeners (future_impl.dart:867:13) at [_completeWithValue] (future_impl.dart:643:5) at future.dart:524:22 at _RootZone.runUnary (zone.dart:1661:54) at _FutureListener.then.handleValue (future_impl.dart:162:18) at handleValueCallback (future_impl.dart:838:44) at _Future._propagateToListeners (future_impl.dart:867:13) at async._AsyncCallbackEntry.new.callback (future_impl.dart:464:9) at Object._microtaskLoop (schedule_microtask.dart:40:11) at _startMicrotaskLoop (schedule_microtask.dart:49:5) at async_patch.dart:181:7 registerWith @ web_platform.dart:36 registerPlugins @ web_plugin_registrant.dart:49 (anonymous) @ web_entrypoint.dart:27 (anonymous) @ initialization.dart:37 runBody @ async_patch.dart:84 _async @ async_patch.dart:127 (anonymous) @ initialization.dart:35 _checkAndCall @ operations.dart:550 callMethod @ operations.dart:620 dsend @ operations.dart:624 autoStart @ app_bootstrap.dart:31 (anonymous) @ async_patch.dart:45 runUnary @ zone.dart:1661 handleValue @ future_impl.dart:162 handleValueCallback @ future_impl.dart:838 _propagateToListeners @ future_impl.dart:867 [_completeWithValue] @ future_impl.dart:643 (anonymous) @ future.dart:524 runUnary @ zone.dart:1661 handleValue @ future_impl.dart:162 handleValueCallback @ future_impl.dart:838 _propagateToListeners @ future_impl.dart:867 (anonymous) @ future_impl.dart:464 _microtaskLoop @ schedule_microtask.dart:40 _startMicrotaskLoop @ schedule_microtask.dart:49 (anonymous) @ async_patch.dart:181 Promise.then (async) _scheduleImmediateWithPromise @ async_patch.dart:179 _scheduleImmediate @ async_patch.dart:151 _scheduleAsyncCallback @ schedule_microtask.dart:69 _rootScheduleMicrotask @ zone.dart:1466 scheduleMicrotask @ zone.dart:1681 [_asyncCompleteWithValue] @ future_impl.dart:712 [_asyncComplete] @ future_impl.dart:672 complete @ future_impl.dart:44 (anonymous) @ js_util_patch.dart:483 Promise.then (async) promiseToFuture @ js_util_patch.dart:495 DomResponseExtension$124arrayBuffer @ dom.dart:1892 asByteBuffer @ dom.dart:1777 runBody @ async_patch.dart:84 _async @ async_patch.dart:127 asByteBuffer @ dom.dart:1776 HttpFetchResponseExtension$124asByteBuffer @ dom.dart:1651 _downloadFont @ fonts.dart:199 (anonymous) @ async_patch.dart:45 runUnary @ zone.dart:1661 handleValue @ future_impl.dart:162 handleValueCallback @ future_impl.dart:838 _propagateToListeners @ future_impl.dart:867 [_completeWithValue] @ future_impl.dart:643 (anonymous) @ future_impl.dart:713 _microtaskLoop @ schedule_microtask.dart:40 _startMicrotaskLoop @ schedule_microtask.dart:49 (anonymous) @ async_patch.dart:181 Promise.then (async) _scheduleImmediateWithPromise @ async_patch.dart:179 _scheduleImmediate @ async_patch.dart:151 _scheduleAsyncCallback @ schedule_microtask.dart:69 _rootScheduleMicrotask @ zone.dart:1466 scheduleMicrotask @ zone.dart:1681 [_asyncCompleteWithValue] @ future_impl.dart:712 [_asyncComplete] @ future_impl.dart:672 complete @ future_impl.dart:44 (anonymous) @ js_util_patch.dart:483 Promise.then (async) promiseToFuture @ js_util_patch.dart:495 rawHttpGet @ dom.dart:1528 httpFetch @ dom.dart:1557 runBody @ async_patch.dart:84 _async @ async_patch.dart:127 httpFetch @ dom.dart:1548 _downloadFont @ fonts.dart:193 runBody @ async_patch.dart:84 _async @ async_patch.dart:127 [_downloadFont] @ fonts.dart:183 loadAssetFonts @ fonts.dart:111 runBody @ async_patch.dart:84 _async @ async_patch.dart:127 loadAssetFonts @ fonts.dart:102 _downloadAssetFonts @ initialization.dart:258 (anonymous) @ async_patch.dart:45 runUnary @ zone.dart:1661 handleValue @ future_impl.dart:162 handleValueCallback @ future_impl.dart:838 _propagateToListeners @ future_impl.dart:867 [_completeWithValue] @ future_impl.dart:643 (anonymous) @ future_impl.dart:713 _microtaskLoop @ schedule_microtask.dart:40 _startMicrotaskLoop @ schedule_microtask.dart:49 (anonymous) @ async_patch.dart:181 Promise.then (async) _scheduleImmediateWithPromise @ async_patch.dart:179 _scheduleImmediate @ async_patch.dart:151 _scheduleAsyncCallback @ schedule_microtask.dart:69 _rootScheduleMicrotask @ zone.dart:1466 scheduleMicrotask @ zone.dart:1681 [_asyncCompleteWithValue] @ future_impl.dart:712 [_asyncComplete] @ future_impl.dart:672 complete @ future_impl.dart:44 (anonymous) @ js_util_patch.dart:483 Promise.then (async) promiseToFuture @ js_util_patch.dart:495 _DomStreamReaderExtension$124read @ dom.dart:1929 read @ dom.dart:1766 (anonymous) @ async_patch.dart:45 runUnary @ zone.dart:1661 handleValue @ future_impl.dart:162 handleValueCallback @ future_impl.dart:838 _propagateToListeners @ future_impl.dart:867 [_completeWithValue] @ future_impl.dart:643 (anonymous) @ future_impl.dart:713 _microtaskLoop @ schedule_microtask.dart:40 _startMicrotaskLoop @ schedule_microtask.dart:49 (anonymous) @ async_patch.dart:181 Promise.then (async) _scheduleImmediateWithPromise @ async_patch.dart:179 _scheduleImmediate @ async_patch.dart:151 _scheduleAsyncCallback @ schedule_microtask.dart:69 _rootScheduleMicrotask @ zone.dart:1466 scheduleMicrotask @ zone.dart:1681 [_asyncCompleteWithValue] @ future_impl.dart:712 [_asyncComplete] @ future_impl.dart:672 complete @ future_impl.dart:44 (anonymous) @ js_util_patch.dart:483 Promise.then (async) promiseToFuture @ js_util_patch.dart:495 _DomStreamReaderExtension$124read @ dom.dart:1929 read @ dom.dart:1766 runBody @ async_patch.dart:84 _async @ async_patch.dart:127 read @ dom.dart:1761 HttpFetchResponseExtension$124read @ dom.dart:1646 fetchFontManifest @ fonts.dart:46 (anonymous) @ async_patch.dart:45 runUnary @ zone.dart:1661 handleValue @ future_impl.dart:162 handleValueCallback @ future_impl.dart:838 _propagateToListeners @ future_impl.dart:867 [_completeWithValue] @ future_impl.dart:643 (anonymous) @ future_impl.dart:713 _microtaskLoop @ schedule_microtask.dart:40 _startMicrotaskLoop @ schedule_microtask.dart:49 (anonymous) @ async_patch.dart:181 Promise.then (async) _scheduleImmediateWithPromise @ async_patch.dart:179 _scheduleImmediate @ async_patch.dart:151 _scheduleAsyncCallback @ schedule_microtask.dart:69 _rootScheduleMicrotask @ zone.dart:1466 scheduleMicrotask @ zone.dart:1681 [_asyncCompleteWithValue] @ future_impl.dart:712 [_asyncComplete] @ future_impl.dart:672 complete @ future_impl.dart:44 (anonymous) @ js_util_patch.dart:483 Promise.then (async) promiseToFuture @ js_util_patch.dart:495 rawHttpGet @ dom.dart:1528 httpFetch @ dom.dart:1557 runBody @ async_patch.dart:84 _async @ async_patch.dart:127 httpFetch @ dom.dart:1548 loadAsset @ asset_manager.dart:83 fetchFontManifest @ fonts.dart:29 runBody @ async_patch.dart:84 _async @ async_patch.dart:127 fetchFontManifest @ fonts.dart:28 _downloadAssetFonts @ initialization.dart:258 runBody @ async_patch.dart:84 _async @ async_patch.dart:127 _downloadAssetFonts @ initialization.dart:245 initializeEngineServices @ initialization.dart:195 runBody @ async_patch.dart:84 _async @ async_patch.dart:127 initializeEngineServices @ initialization.dart:110 (anonymous) @ initialization.dart:34 runBody @ async_patch.dart:84 _async @ async_patch.dart:127 (anonymous) @ initialization.dart:33 autoStart @ app_bootstrap.dart:30 runBody @ async_patch.dart:84 _async @ async_patch.dart:127 autoStart @ app_bootstrap.dart:29 bootstrapEngine @ initialization.dart:50 runBody @ async_patch.dart:84 _async @ async_patch.dart:127 bootstrapEngine @ initialization.dart:27 main @ web_entrypoint.dart:19 runBody @ async_patch.dart:84 _async @ async_patch.dart:127 main$ @ web_entrypoint.dart:18 (anonymous) @ main_module.bootstrap.js:23 window.$dartRunMain @ main_module.bootstrap.js:22 (anonymous) @ unknown runMain @ client.js:9905 (anonymous) @ client.js:26084 (anonymous) @ client.js:4049 call$2 @ client.js:12422 _asyncStartSync @ client.js:4013 $call$body$main__closure @ client.js:26100 call$1 @ client.js:26013 _rootRunUnary @ client.js:4431 runUnary$2$2 @ client.js:13817 runUnaryGuarded$1$2 @ client.js:13764 _sendData$1 @ client.js:13357 _add$1 @ client.js:13303 _add$1 @ client.js:13638 _handleData$2 @ client.js:13701 _handleData$1 @ client.js:13664 (anonymous) @ client.js:1741 _rootRunUnary @ client.js:4431 runUnary$2$2 @ client.js:13817 runUnaryGuarded$1$2 @ client.js:13764 _sendData$1 @ client.js:13357 _add$1 @ client.js:13303 _sendData$1 @ client.js:13149 add$1 @ client.js:13028 (anonymous) @ client.js:1799 _rootRunUnary @ client.js:4431 runUnary$2$2 @ client.js:13817 runUnaryGuarded$1$2 @ client.js:13764 _sendData$1 @ client.js:13357 _add$1 @ client.js:13303 _sendData$1 @ client.js:13149 add$1 @ client.js:13028 add$1 @ client.js:25366 _innerListen$1 @ client.js:25698 (anonymous) @ client.js:1741 call$1 @ client.js:25644 _rootRunUnary @ client.js:4435 runUnary$2$2 @ client.js:13817 runUnaryGuarded$1$2 @ client.js:13764 call$1 @ client.js:13954 Primitives_applyFunction @ client.js:1304 Function_apply @ client.js:5963 _callDartFunctionFast @ client.js:8360 (anonymous) @ client.js:8351

When I tried to add the <script type="application/javascript" src="/assets/packages/flutter_inappwebview_web/assets/web/web_support.js" defer></script> I also get:

Failed to load resource: the server responded with a status of 404 (Not Found) u:1 Refused to execute script from 'http://localhost:64112/assets/packages/flutter_inappwebview_web/assets/web/web_support.js' because its MIME type ('text/plain') is not executable, and strict MIME type checking is enabled.

github-actions[bot] commented 1 month ago

👋 @Anderzzon

NOTE: This comment is auto-generated.

Are you sure you have already searched for the same problem?

Some people open new issues but they didn't search for something similar or for the same issue. Please, search for it using the GitHub issue search box or on the official inappwebview.dev website, or, also, using Google, StackOverflow, etc. before posting a new one. You may already find an answer to your problem!

If this is really a new issue, then thank you for raising it. I will investigate it and get back to you as soon as possible. Please, make sure you have given me as much context as possible! Also, if you didn't already, post a code example that can replicate this issue.

In the meantime, you can already search for some possible solutions online! Because this plugin uses native WebView, you can search online for the same issue adding android WebView [MY ERROR HERE] or ios WKWebView [MY ERROR HERE] keywords.

Following these steps can save you, me, and other people a lot of time, thanks!

nilotpalkapri commented 1 month ago

`<script type="application/javascript" src="/assets/packages/flutter_inappwebview_web/assets/web/web_support.js" defer

`

add this in your head of index.html

Anderzzon commented 1 month ago

`<script type="application/javascript" src="/assets/packages/flutter_inappwebview_web/assets/web/web_support.js" defer

`

add this in your head of index.html

I have tried that as you can see in my report. When I do, I get this console error as well: Failed to load resource: the server responded with a status of 404 (Not Found) u:1 Refused to execute script from 'http://localhost:64112/assets/packages/flutter_inappwebview_web/assets/web/web_support.js' because its MIME type ('text/plain') is not executable, and strict MIME type checking is enabled.

Anderzzon commented 1 month ago

I finally figured it out; we have <base href="/u/"> set so I had to update the path to be /u/assets/packages/flutter_inappwebview_web/assets/web/web_support.js. I was pretty sure I already tried this but must have done something wrong then, perhaps I missed adding the "/" in the beginning. Please update this in the installation guide so stupid people like me who isn't used working with javascript don't miss this detail.