Ionic cordovaPushV5 initialize error: Can't find variable: PushNotification

Question

I'm getting mad about it. Trying to implement the last cordova push notification repository (cordovaPushV5) but when it look into the console it said ReferenceError: Can't find variable: PushNotification. But the wierd thing here is that if I call the PushNotification from console, it exist.

Here goes some code

$(document).ready(function() {


    // notification

    var options = {
      android: {
        senderID: "THE_NUMBER"
      },
      ios: {
        alert: "true",
        badge: "true",
        sound: "true"
      },
      windows: {}
    };

    // initialize
    $cordovaPushV5.initialize(options).then(function() {
      // start listening for new notifications
      $cordovaPushV5.onNotification();
      // start listening for errors
      $cordovaPushV5.onError();

      // register to get registrationId
      $cordovaPushV5.register().then(function(registrationId) {
        console.log('registrationId: ',registrationId);
      })
    });

    // triggered every time notification received
    $rootScope.$on('$cordovaPushV5:notificationReceived', function(event, data){
      console.log(data);
    });

    // triggered every time error occurs
    $rootScope.$on('$cordovaPushV5:errorOcurred', function(event, e){
      console.log('event: ', event);
      console.log('error: ', e);
    });


  });

And here goes some system info

$ ionic info

Your system information:

Cordova CLI: 6.4.0 
Ionic CLI Version: 2.1.14
Ionic App Lib Version: 2.1.7
ios-deploy version: 1.9.0 
ios-sim version: 5.0.8 
OS: macOS Sierra
Node Version: v5.9.1
Xcode version: Xcode 8.1 Build version 8B62



$ ionic platform ls
WARN: ionic.project has been renamed to ionic.config.json, please rename it.
Installed platforms:
  android 6.0.0
  ios 4.3.1
  wp8 (deprecated)
Available platforms: 
  amazon-fireos ~3.6.3 (deprecated)
  blackberry10 ~3.8.0
  browser ~4.1.0
  firefoxos ~3.6.3
  osx ~4.0.1
  webos ~3.7.0


$ ionic plugin ls
WARN: ionic.project has been renamed to ionic.config.json, please rename it.
cordova-plugin-console 1.0.4 "Console"
cordova-plugin-device 1.1.3 "Device"
cordova-plugin-nativeaudio 3.0.6 "Cordova Native Audio"
cordova-plugin-splashscreen 2.1.0 "Splashscreen"
cordova-plugin-statusbar 1.0.1 "StatusBar"
cordova-plugin-whitelist 1.2.0 "Whitelist"
cordova-plugin-x-socialsharing 5.1.3 "SocialSharing"
ionic-plugin-keyboard 2.2.1 "Keyboard"
phonegap-plugin-push 1.9.1 "PushPlugin"

Thanks in advance

---

EDIT

I have set a timeout of 10 seconds before the plugin init and it works, but shouldn't work this way, any thoughts?

Answer 1

This answer could be useful for similar other issues.

---

I had the exact same issue. Fixed it.

My issue was: I was using older Angular version ie. 1.4.5 so it was generating a wrong older version of dependencies. It essentially happended while I was upgrading GCM to FCM and I upgraded the plugin to 'phonegap-plugin-push:^2.2.0'.

The solution is: In order to fix that, once I ran 'ionic cordova build android' command then I explicitely changed other dependencies manaually (as below) and re-build it and everything was working fine.

ie. (my-app)-build.gradle

    buildscript {
    repositories {
        jcenter()
        mavenCentral()
    }

    dependencies {
        classpath 'com.android.tools.build:gradle:2.2.1'
        classpath 'com.google.gms:google-services:4.1.0'
    }
}

// apply plugin: 'com.google.gms.google-services'
// class must be used instead of id(string) to be able to apply plugin from non-root gradle file
ext.postBuildExtras = {
    apply plugin: com.google.gms.googleservices.GoogleServicesPlugin
}

and "project.properties" file

target=android-27
android.library.reference.1=CordovaLib
android.library.reference.2=app
cordova.system.library.1=com.google.android.gms:play-services-analytics:16.0.8
cordova.gradle.include.1=cordova-support-google-services/myApp-build.gradle
cordova.gradle.include.2=phonegap-plugin-multidex/myApp-multidex.gradle
cordova.system.library.2=com.android.support:support-v13:27.+
cordova.system.library.3=me.leolin:ShortcutBadger:1.1.17@aar
cordova.system.library.4=com.google.firebase:firebase-messaging:17.0.0

Answer 2

Have you tried wrapping your initialize call inside an ionic.Platform.ready function? You're doing a jQuery document ready, but you need to make sure that the mobile device plugins are ready too.

Example:

ionic.Platform.ready(function()
{
    // do stuff
});