Capacitor doesn't have Platform API

[Sampath-Lokuge]

Hi,

I develop an Angular and Capacitor app. i.e. No Ionic here

How can I check this on Native platform await this.platform.ready();. Because I need to use the Cordova plugin on App startup like so.

app.component.ts

 constructor(
    private screenOrientation: ScreenOrientation) {

    this.initializeApp();
  }

private async initializeApp(): Promise<void> {

    //await this.platform.ready(); //cannot use here no Ionic
  

    if (Capacitor.isPluginAvailable('StatusBar')) { StatusBar.show(); }

    if (Capacitor.isNative) { this.screenOrientation.lock(this.screenOrientation.ORIENTATIONS.PORTRAIT); }
  }

So what is the alternative here?

I know Ionic/Angular has this https://ionicframework.com/docs/angular/platform. But I do not use Ionic. Any clue?

ionic info
[WARN] Error loading @ionic/angular package.json: Error: Cannot find module '@ionic/angular/package'

   Require stack:
   - C:\Users\Sampath\AppData\Roaming\npm\node_modules\@ionic\cli\lib\project\index.js
   - C:\Users\Sampath\AppData\Roaming\npm\node_modules\@ionic\cli\lib\index.js
   - C:\Users\Sampath\AppData\Roaming\npm\node_modules\@ionic\cli\index.js
   - C:\Users\Sampath\AppData\Roaming\npm\node_modules\@ionic\cli\bin\ionic

[WARN] Error loading @ionic/angular-toolkit package.json: Error: Cannot find module '@ionic/angular-toolkit/package'

   Require stack:
   - C:\Users\Sampath\AppData\Roaming\npm\node_modules\@ionic\cli\lib\project\index.js
   - C:\Users\Sampath\AppData\Roaming\npm\node_modules\@ionic\cli\lib\index.js
   - C:\Users\Sampath\AppData\Roaming\npm\node_modules\@ionic\cli\index.js
   - C:\Users\Sampath\AppData\Roaming\npm\node_modules\@ionic\cli\bin\ionic

Ionic:

Ionic CLI : 6.11.11 (C:\Users\Sampath\AppData\Roaming\npm\node_modules@ionic\cli)
Ionic Framework : not installed
@angular-devkit/build-angular : 0.1001.6
@angular-devkit/schematics : 10.1.6
@angular/cli : 10.1.6
@ionic/angular-toolkit : not installed

Capacitor:

Capacitor CLI : 2.4.2
@capacitor/core : 2.4.2

Utility:

cordova-res : 0.14.0
native-run : 1.2.1

System:

NodeJS : v12.13.1 (C:\Program Files\nodejs\node.exe)
npm : 6.12.1
OS : Windows 10

[jcesarmobile]

If you don't want to use Ionic, then you can't use platform because it's an Ionic feature.

If you just want to wait for deviceready event, then you can listen to it directly with

document.addEventListener("deviceready", onDeviceReady, false);

function onDeviceReady() {
    // Now safe to use device APIs
}

Anyway, in Capacitor you don't need to wait for deviceready.

[Sampath-Lokuge]

The problem here is I need to use Firebase Username/pw feature. But it gives the below error on iOS device on Native build.

[error] - {"code":"auth/operation-not-supported-in-this-environment","message":"This operation is not supported in the environment this application is running on. "location.protocol" must be http, https or chrome-extension and web storage must be enabled."}

I saw something from google here. i.e. he says Firebase listen to the device ready event.

firebase/firebaseui-web#178 (comment)

i.e. > Also the SDK will listen to 'deviceready' event. If it doesn't get that signal in like a second, it times out and assumes you are not running in Cordova environment. Also make sure you did not disable web storage as the app relies on that.

So how can I do that?

[jcesarmobile]

Do you have any Cordova plugin installed?
Capacitor only fires deviceready if there are Cordova plugins installed

[Sampath-Lokuge]

Yes like so:

  private initializeApp(): void {

     if (Capacitor.isPluginAvailable('StatusBar')) { StatusBar.show(); }

    if (Capacitor.isNative) { this.screenOrientation.lock(this.screenOrientation.ORIENTATIONS.PORTRAIT); }

    this.authService.setFirebaseAuth(); // Problem is here on iOS native build
  }

[Sampath-Lokuge]

@jcesarmobile

npx cap ls

Found 0 Capacitor plugins for android:
 Found 5 Cordova plugins for android
   cordova-plugin-ionic (5.4.7)
   cordova-plugin-screen-orientation (3.0.2)
   cordova-plugin-whitelist (1.3.4)
   es6-promise-plugin (4.2.2)
   phonegap-plugin-barcodescanner (8.1.0)
 Found 0 Capacitor plugins for ios:
 Found 4 Cordova plugins for ios
   cordova-plugin-ionic (5.4.7)
   cordova-plugin-screen-orientation (3.0.2)
   es6-promise-plugin (4.2.2)
   phonegap-plugin-barcodescanner (8.1.0)
 Found 1 incompatible Cordova plugin for ios, skipped install
   cordova-plugin-whitelist (1.3.4)
[info] Listing plugins for web is not possible