FirebaseExtended / polymerfire

Polymer Web Components for Firebase
https://www.webcomponents.org/element/firebase/polymerfire
MIT License
459 stars 142 forks source link

Firebase/Polymerfire 2.0 - Messaging issue- Error: Polymer 2.0 - Firebase Messaging Error - Uncaught (in promise) DOMException: Registration failed - push service #345

Open vinayakvanarse opened 6 years ago

vinayakvanarse commented 6 years ago

Git Source code to replicate the issue

https://github.com/vinvantest/git_issue_firebase_login

I have a PWA app using Polymer 2.0 and firebase. Firebase messaging is throwing error - Uncaught (in promise) DOMException: Registration failed - push service error.

https://github.com/firebase/firebase-js-sdk/issues/771 Firebase team has suggested to open a new issue in polymerfire group as they believe it is related to Polymerfire.

Environment Operating System version: Mac High Sierra 10.13.4 Firebase SDK - firebase@4.13.0 Firebase Tools version: 3.18.4 Firebase Product: messaging bower polymerfire#^2.2.1 cached https://github.com/firebase/polymerfire.git#2.2.1 bower polymerfire#^2.2.1 validate 2.2.1 against https://github.com/firebase/polymerfire.git#^2.2.1 bower firebase# cached https://github.com/firebase/firebase-bower.git#4.6.1 bower firebase# validate 4.6.1 against https://github.com/firebase/firebase-bower.git# bower firebase# new version for https://github.com/firebase/firebase-bower.git# bower firebase# resolve https://github.com/firebase/firebase-bower.git# bower firebase# download https://github.com/firebase/firebase-bower/archive/v4.13.0.tar.gz bower firebase# extract archive.tar.gz bower firebase# resolved https://github.com/firebase/firebase-bower.git#4.13.0 bower firebase#^4.13.0 install firebase#4.13.0 bower polymerfire#^2.2.1 install polymerfire#2.2.1

The messaging doesn't work in Chrome - [Google Chrome is up to date Version 66.0.3359.139 (Official Build) (64-bit)] as well as in Chrome Android - [Application version Chrome 66.0.3359.126

Error trace in Chrome console Desktop version - Uncaught (in promise) DOMException: Registration failed - push service error Promise.then (async) refreshToken @ firebase-messaging.html:87 activateMessaging @ firebase-messaging.html:125 activate @ firebase-messaging.html:243 _bootstrapApp @ firebase-messaging.html:259 runMethodEffect @ property-effects.html:813 runEffectsForProperty @ property-effects.html:159 runEffects @ property-effects.html:125 _propertiesChanged @ property-effects.html:1703 _flushProperties @ properties-changed.html:338 _flushProperties @ property-effects.html:1551 _invalidateProperties @ property-effects.html:1523 _setProperty @ property-effects.html:1508 Object.defineProperty.set @ properties-changed.html:150 __appNameChanged @ firebase-common-behavior.html:47 runObserverEffect @ property-effects.html:214 runEffectsForProperty @ property-effects.html:159 runEffects @ property-effects.html:125 _propertiesChanged @ property-effects.html:1703 _flushProperties @ properties-changed.html:338 _flushProperties @ property-effects.html:1551 ready @ property-effects.html:1656 ready @ element-mixin.html:546 ready @ dir-mixin.html:140 ready @ legacy-element-mixin.html:198 ready @ class.html:232 ready @ class.html:232 ready @ class.html:232 _enableProperties @ properties-changed.html:321 connectedCallback @ properties-mixin.html:208 connectedCallback @ element-mixin.html:532 connectedCallback @ dir-mixin.html:150 connectedCallback @ legacy-element-mixin.html:105 _attachDom @ element-mixin.html:588 _readyClients @ element-mixin.html:561 _flushClients @ property-effects.html:1565 _propertiesChanged @ property-effects.html:1699 _flushProperties @ properties-changed.html:338 _flushProperties @ property-effects.html:1551 ready @ property-effects.html:1656 ready @ element-mixin.html:546 ready @ my-app.html:540 _enableProperties @ properties-changed.html:321 connectedCallback @ properties-mixin.html:208 connectedCallback @ element-mixin.html:532 (anonymous) @ my-app.html:849

I have attached screenshots of the behaviour. Sequence of events is stored as filename in chronological order just to simplify things. I have also attached 3 files from the PWA namely .. index.html, my-app.html (main element), login.html and firebase-sw.js. Hope it will provide all the context to the issue.

Reproduce: Source code - https://github.com/vinvantest/git_issue_firebase_login

Code used (if someone doesn't have GitHub access) ` my-app.html (PolymerElement)

<firebase-app auth-domain="[[configFirebase.authDomain]]" database-url="[[configFirebase.databaseURL]]" api-key="[[configFirebase.apiKey]]" storage-bucket="[[configFirebase.storageBucket]]" messaging-sender-id="[[configFirebase.messagingSenderId]]">

<firebase-auth id="auth" user="{{user}}" signed-in="{{signedIn}}" status-known="{{statusKnown}}" on-error="_handleError">

<firebase-messaging id="messaging" token="{{token}}" on-message="handleMessage" active="{{fcmActive}}" status-known="{{fcmStatusKnown}}">

class MyApp extends Polymer.Element { static get is() { return 'my-app'; }

ready() {
  this.addEventListener('request-fcm-permission',        
     this._requestFcmPermission);
  super.ready();
}

_requestFcmPermission() { var fcm = this.$.messaging; var self = this; if (this.user && !fcm.active) { fcm.requestPermission() .then(function(){ console.log('FCM permission granted'); console.log('[[token]] ->' + self.token); self.tokenDocVal = self.token; }) .catch(function(e){ console.warn('FCM permission blocked', e); }) } }

... other html code ....

And the firebase-messaging-sw.js

importScripts('/bower_components/firebase/firebase-app.js');
importScripts('/bower_components/firebase/firebase-
   messaging.js');

firebase.initializeApp({ 'messagingSenderId': '' });

var messaging = firebase.messaging();

messaging.setBackgroundMessageHandler(function(payload) { console.log('[firebase-messaging-sw.js] Received background message ', payload);

var notificationTitle = payload.notification.title; var notificationOptions = { body: payload.notification.body, icon: '../images/fresh/android/android-launchericon-24-24.png' }; return self.registration.showNotification(notificationTitle, notificationOptions); });`

Manifest.json includes "gcm_sender_id": "103953800507", Request help to resolve the issue. I have been on this issue for long and don't know why its happening and how to fix it.

vinayakvanarse commented 6 years ago

Hi, any progress or help... No one has picked it up

vinayakvanarse commented 6 years ago

Git source code to replicate the issue

https://github.com/vinvantest/git_issue_firebase_login