Blank (Black) Screen after add firebase-x plugin

cordova
1

After add firebase-x plugin, (with other problems in middle). When I could build it, mi app just open splash screen and then stay Blank (Black) Screen.
Using Ionic 5, Cordova 10

Thanks in Advance.

2

First step: Check the console, any errors thrown?

3

Configure project :app
strippedNativeLibsDir is deprecated and no longer used. Please remove it from your build configuration.

Configure project :CordovaLib
[Cordova] cdvMinSdkVersion is overridden, try it at your own risk.

Task :app:stripDebugDebugSymbols UP-TO-DATE
WARNING: Compatible side by side NDK version was not found. Default is 21.0.6113669.
Compatible side by side NDK version was not found. Default is 21.0.6113669.

Deprecated Gradle features were used in this build, making it incompatible with Gradle 7.0.
Use ‘–warning-mode all’ to show the individual deprecation warnings.
See Command-Line Interface

BUILD SUCCESSFUL in 47s

4

I updated to Cordova 11, and issue persist.

5

i mean the javascript console of the running app

6

I’m testing in real device. The development PC is far away of me.

7

You can also debug the app on a real device to see the console. You should read this guide:

8

I ever tested with real device connected to pc via wi-fi, because, browser don’t admit some plugins that i am actually using. But, now, I’m in other location that PC. For this “minor” change, I build the apk, upload to site by ftp, and download from phone to test.

9

image
image1625×861 152 KB

Running in Browser, the White Screen persist. No Errors displayed in Console. Just Stay here…

10

Only Adding this Line to Constructor, application keep Halted in Black Screen:

public firebaseX: FirebaseX,

Any Idea???

11

Can you past your code here?

12

The Only Code for Issue is…

import { FirebaseX } from ‘@awesome-cordova-plugins/firebase-x/ngx’;
.
.
.
constructor(
public router: Router,
public nativeStorage: NativeStorage,
public firebaseX: FirebaseX,
.

13

For firebase I used capacitor plugin (tuto link: The Push Notifications Guide for Ionic & Capacitor | Devdactic - Ionic Tutorials or The Push Notifications Guide for Ionic & Capacitor | Devdactic - Ionic Tutorials ), I prefer not to use cordova plugin inside a capacitor project (even if it is possible), it generaly leads me to face some problems.

Good luck !

14

Run the app in android emulator
Open chrome and enter URL chrome://inspect
Chose the device on which app is running and look for log under console.

FirebaseX module/provider might be missing inside app.module.ts

15

In Browser console, says: Resource Not Found: /Screen

16

I’m not using Capacitor. Just Cordova.

17

Run this command
ionic cordova emulate android —list

It will give you list of emulators

Note down the name of any emulator

Run command
ionic cordova emulate android --livereload --target=“Pixel_XL_API_30”
Where Pixel_XL_API_30 is your emulator device name

Open URL chrome://inspect in chrome browser and tap inspect under device name which is running the project

When you tap inspect it will show the log and console.
Paste that log here.

Now as you said it is saying in browser

Resource not found it might be the that when you added firebaseX in app.module.ts you have removed any other required ionic module. Please check if all modules of ionic are loaded.

If app is running without firebaseX then install firebaseX cli version for example

Ionic cordova plugin add firebaseX@13.0.0-cli

18

I’ve tested it with a an actual device connected to a computer via wifi, as the browsers won’t allow certain plugins that I’m actually using. But, at present I’m at a different location this computer. Best Software Developers