Ionic push notification : Uncaught ReferenceError: PushNotification is not defined - ionic-framework

Question

Hello I am new to Ionic.
I want to use ionic push notification for android phone.
I followed all the instruction from ionic website
For the debugging, I typed ionic serve
And I saw
"Uncaught ReferenceError: PushNotification is not defined"
in Chrome console.
Of course, notification is not working.
What am I missing ?
Any comment would be very helpful.Thank you.
Below is What I have done
I have put below code in terminal
ionic add ionic-platform-web-client
ionic plugin add phonegap-plugin-push
ionic io init
My ionic config info
dev_push is false,
There is 'app_id'
There is 'api_key'
There is 'gcm_key'
NodeJS
v5.2.0 (I tried also v4.2.2)
Ionic cli
v1.7.12
Below code is in $ionicPlatform.ready
var io = Ionic.io();
var user = Ionic.User.current();
if (!user.id) {
user.id = Ionic.User.anonymousId();
};
// Just add some dummy data..
user.set('name', 'moka');
user.set('bio', 'This is my little bio');
user.save();
var push = new Ionic.Push({
"onNotification": function(notification) {
alert('Received push notification!');
},
"pluginConfig": {
"android": {
"iconColor": "#0000FF"
}
}
});
var callback = function(data) {
push.addTokenToUser(user);
user.save();
};
push.register(callback);
// Edit
I changed form
ionic config set dev_push false
to
ionic config set dev_push true
It does not show no longer
"Uncaught ReferenceError: PushNotification is not defined"
However I am not sure if it's correct way.
Because it was written on this tutorial
to turn off your development mode
ionic push --google-api-key your-google-api-key
ionic config set gcm_key your-gcm-project-number
ionic config set dev_push false
So it does not matter "Uncaught ReferenceError: PushNotification is not defined", if I want to test on real android device ?

Answer 1

No it does not matter.
In fact as you have mentioned dev_push must be false while testing it out in real devices.
You can either set it false manually ionic config set dev_push false or not mention it anywhere(by default it is false) :)

Answer 2

Cordova & Phonegap plugins only work on emulators and devices. They will not work on any broswers.
Although with Ionic you can mute those errors a good practice could be to wrap your code like this:
if (typeof PushNotification === "defined") {
// your code here
}
This way it wont throw any errors when you write BDD or E2E tests.
You can also add your code inside the:
document.addEventListener("deviceready", function () {
}

Answer 3

I was able to fix this error following:
ionic remove ionic-platform-web-client
cordova plugin remove phonegap-plugin-push
ionic add ionic-platform-web-client
ionic plugin add phonegap-plugin-push
ionic io init