apache / cordova-plugin-inappbrowser

Apache Cordova InAppBrowser Plugin
https://cordova.apache.org/
Apache License 2.0
1.11k stars 2.14k forks source link

Angular 15 webpage not loading correctly in inappbrowser (Android < 11) #1052

Closed L-VE closed 2 months ago

L-VE commented 2 months ago

Bug Report

Problem

I'm working on upgrading an older app that uses the InAppBrowser to load a webpage. The older version used Cordova version 6.1.1 and android platform version 6.4.0.

The new version uses Cordova 12 and android platform version 12.0.1. In the new app, the webpage is not loading correctly with some warnings in Android versions below 11. From version 11 upwards everything works fine.

What is expected to happen?

The webpage should load in all android version.

What does actually happen?

In this app I just load an Angular 15 webapp. The problem is that in the updated version of the cordova app, the webpage doesn't load correctly in the inAppbrowser for older Android version (below Android 11). On android device from version 11 upward it works as expected. The thing is the old app loads the exact same webpage but in an older version of the inappbrowser and there it loads without a problem.

The app starts the webpage is trying to load, but in logcat I see following messages: [INFO:CONSOLE(1)] "Uncaught SyntaxError: Unexpected token .", source: \<websitename>/polyfills.e81216d294bff2dd.js (1) [INFO:CONSOLE(1)] "Uncaught SyntaxError: Unexpected token ?", source: \<websitename>/scripts.7b15838925e19699.js (1) [INFO:CONSOLE(1)] "Uncaught SyntaxError: Unexpected token ?", source: \<websitename>/vendor.f6d89b5f00177040.js (1) [INFO:CONSOLE(1)] "Uncaught SyntaxError: Unexpected token .", source: \<websitename>/main.b5be01f3bcce8100.js (1)

Information

Old app: cordova 6.1.1 android platform 6.4.0 inappbrowser 3.0.1

New app: cordova 12 android platform 12.0.1. inappbrowser 6.0.1

Command or Code

/

Environment, Platform, Device

New cordova app, loading the webapp in android versions below 11.

Version information

Old app: cordova 6.1.1 android platform 6.4.0 inappbrowser 3.0.1

New app: cordova 12 android platform 12.0.1. inappbrowser 6.0.1

Checklist

breautek commented 2 months ago

If you're using a physical device, make sure you're logged into Google Play to receive webview updates.

If you're using a simulator, make sure you're using a Google Play enabled simulator + simulator image, so that the simulator has the Google Play Store application, which you can log into to receive webview updates.

[INFO:CONSOLE(1)] "Uncaught SyntaxError: Unexpected token .", source: <websitename>/polyfills.e81216d294bff2dd.js (1)
[INFO:CONSOLE(1)] "Uncaught SyntaxError: Unexpected token ?", source: <websitename>/scripts.7b15838925e19699.js (1)
[INFO:CONSOLE(1)] "Uncaught SyntaxError: Unexpected token ?", source: <websitename>/vendor.f6d89b5f00177040.js (1)
[INFO:CONSOLE(1)] "Uncaught SyntaxError: Unexpected token .", source: <websitename>/main.b5be01f3bcce8100.js (1)

This suggest that your angular app is using newer features such as Nullish Coalescing or Optional Chaining

Both features are only available on Android Chrome Webview 80+.

Note that AOSP simulators ships with very old webview versions which may be helpful but in the real world retail phones will likely be running with updates installed. In the case of Angular's Browser Support Policy, they only support the last 2 versions of a browser, so I'd highly recommend using a Google Play enabled simulator and logging in using your google account.

The webpage should load in all android version.

Do note that the android webview has min SDK 26 set. I'm not sure when exactly this was updated but it is possible on Android 7 will not access to the latest available version of the webview and thus not have access to a webview that is supported by Angular.

Closing this because there is no actionable path for Cordova.