I'm developing a website for a project and decided to implement simple push notifications using Firebase Cloud Messaging. I have a script that requests permission for notifications, generates a token and then sends it to the server to store, and a service worker that listens for notifications. I also have a page with a button that signals the server to send a notification to every registered token for testing purposes. Everything is working perfectly on Edge, as long as the browser is open I get the notification no matter what tab is open, but for some reason on Firefox the notification is received only if I don't have any tabs open inside the website domain. In other words, I believe the service worker is not working correctly while my website is open.
Here is the service worker script
importScripts("https://www.gstatic.com/firebasejs/8.2.4/firebase-app.js");
importScripts("https://www.gstatic.com/firebasejs/8.2.4/firebase-messaging.js");
firebase.initializeApp(firebaseConfig);
const messaging = firebase.messaging();
messaging.setBackgroundMessageHandler(function(payload) {
console.log(payload);
const notification = JSON.parse(payload);
const notificationOption = {
body: notification.body,
icon: notification.icon
}
return self.registration.showNotification(payload.notification.title, notificationOption);
})
Edit: After further testing I discovered that the notifications are not received only if the tab where the website is open is not the one focused. Notifications arrive if the website is open but another tab has focus. This applies when the browser is in the background as well.