Diagnostic plugin not installed

Ionic Native
1

I get the following error message on console when testing the app both on iOS and Android using the Ionic DevApp:

[13:59:34]  console.warn: Ionic Native: tried calling Diagnostic.getLocationAuthorizationStatus, but the Diagnostic
            plugin is not installed.
[13:59:34]  console.warn: Install the Diagnostic plugin: 'ionic cordova plugin add cordova.plugins.diagnostic'

Plugin is already installed. When I use “ionic cordova plugin add cordova.plugins.diagnostic”, I get the following message showing that plugin is already installed:

Plugin "cordova.plugins.diagnostic" already installed on android.

Plugin "cordova.plugins.diagnostic" already installed on ios.

Adding cordova.plugins.diagnostic to package.json

Saved plugin info for "cordova.plugins.diagnostic" to config.xml

Here is my package.json:

{
  "name": "Geolocation",
  "version": "0.0.1",
  "author": "Ionic Framework",
  "homepage": "http://ionicframework.com/",
  "private": true,
  "scripts": {
    "start": "ionic-app-scripts serve",
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "lint": "ionic-app-scripts lint"
  },
  "dependencies": {
    "@angular/animations": "5.2.11",
    "@angular/common": "5.2.11",
    "@angular/compiler": "5.2.11",
    "@angular/compiler-cli": "5.2.11",
    "@angular/core": "5.2.11",
    "@angular/forms": "5.2.11",
    "@angular/http": "5.2.11",
    "@angular/platform-browser": "5.2.11",
    "@angular/platform-browser-dynamic": "5.2.11",
    "@ionic-native/core": "~4.11.0",
    "@ionic-native/diagnostic": "^4.11.0",
    "@ionic-native/geolocation": "^4.11.0",
    "@ionic-native/splash-screen": "~4.11.0",
    "@ionic-native/status-bar": "~4.11.0",
    "@ionic/storage": "2.1.3",
    "cordova-plugin-device": "^2.0.2",
    "cordova-plugin-geolocation": "^4.0.1",
    "cordova-plugin-ionic-keyboard": "^2.1.2",
    "cordova-plugin-ionic-webview": "^2.0.2",
    "cordova-plugin-splashscreen": "^5.0.2",
    "cordova-plugin-whitelist": "^1.3.3",
    "cordova.plugins.diagnostic": "^4.0.8",
    "ionic-angular": "3.9.2",
    "ionicons": "3.0.0",
    "rxjs": "5.5.11",
    "sw-toolbox": "3.6.0",
    "zone.js": "0.8.26",
    "cordova-ios": "~4.5.5"
  },
  "devDependencies": {
    "@ionic/app-scripts": "3.1.11",
    "typescript": "~2.6.2"
  },
  "description": "An Ionic project",
  "cordova": {
    "plugins": {
      "cordova-plugin-geolocation": {
        "GEOLOCATION_USAGE_DESCRIPTION": "To locate you"
      },
      "cordova-plugin-whitelist": {},
      "cordova-plugin-device": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-ionic-webview": {},
      "cordova-plugin-ionic-keyboard": {},
      "cordova.plugins.diagnostic": {}
    },
    "platforms": [
      "ios",
      "android"
    ]
  }
}

In my home.ts after importing and referencing diagnostics in constructor, I use the following code:

export class HomePage {

public locState: any;
  constructor(public navCtrl: NavController, 
    private diagnostic: Diagnostic
  ) {

  }

  ionViewDidLoad(){

      this.diagnostic.getLocationAuthorizationStatus().then( state => {
      if (state == this.diagnostic.permissionStatus.GRANTED){
      this.locState = 'GRANTED';
      } else {
      this.locState = 'NOT GRANTED';
      }}).catch(e => console.error(e));
       
      
  }
}

Thus, I use getLocationAuthorizationStatus() that is both for iOS and Android.

In home.html, I want to display locState:

<p>{{ locState }}</p>

Of course this doesn’t show on screen. I also do get this error message saying plugin not installed.

Am I making a mistake somewhere? Why does the system tell me plugin not installed although it actually is.

Thanks!

2

How and where are you testing?
What is your ionic info output?

3

Since Cordova plugins are loaded dynamically at runtime, the Diagnostic plugin is not guaranteed to be loaded until the deviceready event has fired, this in Ionic terms is when the platform is ready.

Therefore, you need to hook into the platform to be sure you are only calling the plugin once it has been loaded and is ready, something like this:

import {Platform} from 'ionic-angular';
import {Diagnostic} from '@ionic-native/diagnostic';

export class HomePage {

public locState: any;
  constructor(public navCtrl: NavController, 
    private diagnostic: Diagnostic,
    private platform: Platform
  ) {
    
  }

  ionViewDidLoad(){
      this.platform.ready().then(() => {
        this.diagnostic.getLocationAuthorizationStatus().then( state => {
          if (state == this.diagnostic.permissionStatus.GRANTED){
            this.locState = 'GRANTED';
          } else {
            this.locState = 'NOT GRANTED';
          }
        }).catch(e => console.error(e));
    });
  }
}
4

I use Ionic Dev App to test this on iPhone 7 and Galaxy S9. This is what ionic info shows:

cli packages: (/usr/local/lib/node_modules)

    @ionic/cli-utils  : 1.19.2
    ionic (Ionic CLI) : 3.20.0

global packages:

    cordova (Cordova CLI) : 8.0.0

local packages:

    @ionic/app-scripts : 3.1.11
    Cordova Platforms  : android 7.0.0 ios 4.5.5
    Ionic Framework    : ionic-angular 3.9.2

System:

    Node  : v8.9.4
    npm   : 4.6.1
    OS    : macOS High Sierra
    Xcode : Xcode 9.3.1 Build version 9E501

Environment Variables:

    ANDROID_HOME : not set

Misc:

    backend : pro
5

Thanks but I tried this code but still got the same error message:

[12:23:19]  console.warn: Ionic Native: tried calling Diagnostic.getLocationAuthorizationStatus, but the Diagnostic
            plugin is not installed.
[12:23:19]  console.warn: Install the Diagnostic plugin: 'ionic cordova plugin add cordova.plugins.diagnostic'
6

I don’t think the diagnostic plugin is supported in the dev app:

1 Like
7

Thank you. This is a very useful list to have. I wasn’t aware of it.

What is the next easiest way to test the diagnostic plugin?

I guess I can build the app using Android Studio and Xcode and then run it on a device. That is more time consuming than DevApp obviously.

8

Works when built using Android studio… I tried the same code by building the app using Android studio and running it on a device… it works perfectly…

As discussed above, DevApp doesn’t support diagnostic plugin testing… so you have to build and run it on a device…

I wish there was an easier way to do it but I will work with this method for the moment…

1 Like
9

It’s technically impossible to include all available plugins in an app like DevApp, which makes building the app yourself the only solution. In the best case ionic cordova run android is enough to get your app on a device.

1 Like