Ionic 6 app dont work on android v8.1 but works on android v6 devices

Ionic 6 app dont work(show only white-screen) on android v8.1 but works on lesser version android v.6 devices

Ionic 6, Angular 10, Node 12

i just test on a new android v9 its working but not on android v8,
but still works on android early version 6 too.

can some1 help me with this plz

What is the version of the webview on your phone? You can find this by following these steps:

  1. Inspect the app running on your phone in Chrome Dev Tools (chrome://inspect)
  2. Log window.navigator.userAgent to the console and paste the result here.
1 Like

chrome://inspect/#devices refused to work but its chrome chrome 70.0.3538.110
i found this info developer options of my device > webview implementation

Can you try updating the WebView on the Google Play Store? Without knowing if there are any errors logged to the console in your app, it is hard to say what the issue could be.

1 Like

let me try that get back u
thx

i updated webview but cant seem to make chrome://inspect/#devices connect to my device.

am really hardworker if u showed me any area u suspect that this issue my come from i may trackit down and find a way to solve it

image

i updated webview but cant seem to make chrome://inspect/#devices connect to my device.

am really hardworker if u showed me any area u suspect that this issue my come from i may trackit down and find a way to solve it

image

If you have Android Studio installed, you likely also have adb installed. You can use that tool to see the list of devices connected to your computer.

The following command can be run in a shell/terminal and will tell you which devices are connected to your computer:

adb devices -l

If you do not see your device listed, then you will need to do some debugging to figure out why it is not showing up. Here are the steps I usually go through when my device is not being detected:

  1. Ensure “USB Debugging” is enabled on your device. You can follow these steps to enable it:

    • Go to Settings -> About Phone. Tap the build number 7 times. You should get a prompt saying that developer mode has been enabled.
    • Go to Settings -> Developer options. Turn on the “USB Debugging” toggle option if it is not on already.
  2. Try connecting your phone with another cable. The cable you are using now may be defective.

  3. Try restarting ADB: adb kill-server and then adb start-server.

Here is more information on how to use ADB: https://developer.android.com/studio/command-line/adb

1 Like

done everything here but my device(android v8.1) wont show in `adb devices but others show

like my app works on others but not this android v8.1 device
and its what my client uses

It sounds like you will need to do some investigation as to why the device is not showing up. Without being able to debug the device myself, I am not sure what the issue would be. This StackOverflow post is probably a good place to start: https://stackoverflow.com/questions/21170392/android-device-does-not-show-up-in-adb-list

1 Like

all the options they suggest as working solution they are indeed but not on these device

You likely will need to do some more debugging on your end. Without being able to debug the device myself or see any errors, I am not sure what other advice I can give that would be helpful.

1 Like

Here’s what I do when this happens. It’s dirty, but it works every time:

  1. I put alerts in after every line of my app startup in app.component.ts.

E.g. alert(1) … alert(2)

  1. I run my app on the device that doesn’t work and watch the alerts until they stop.

  2. That then tells me which part is breaking the initial rendering of the app.

Often it’s a plugin missing or a race condition, perhaps from a previous install before you changed some code and introduced a bug or whatever.

Good luck and let us know.

1 Like

hey i finally found the device which allows me to remote debug and this the console out error

ReferenceError: globalThis is not defined
at Module. (vendor-es5.js:158248)
at Module.spgP (vendor-es5.js:158400)
at webpack_require (runtime-es5.js:85)
at Module.ZAI4 (main-es5.js:295)
at webpack_require (runtime-es5.js:85)
at Module.zUnb (main-es5.js:647)
at webpack_require (runtime-es5.js:85)
at Object._ (main-es5.js:19)
at webpack_require (runtime-es5.js:85)
at checkDeferredModules (runtime-es5.js:46)
capacitor.handleError @ capacitor-runtime.js:358

The error is being thrown from Angular Fire, not Ionic Framework. The webview version installed on your device likely does not have support for globalThis. See https://github.com/angular/angularfire#polyfills for a polyfill you can use.

I spent two days researching, and this was the solution for me, put this script in the index.html of your application

code

1 Like