I have configured Firebase Push Notifications to enable notifications in the web browser.

The implementation functions correctly in the Edge Browser; however, it is unexpectedly non-functional in Chrome.

The messaging.onBackgroundMessage function is intended to activate whenever a new message is pushed from Firebase, but it does not trigger in Chrome, despite working in other browsers like Edge.

I have attempted to utilize the latest version of the Firebase JavaScript library, but the issue persists.

Below is my code for the firebase-messaging-sw.js file.

importScripts('https://www.gstatic.com/firebasejs/10.13.1/firebase-app-compat.js');
importScripts('https://www.gstatic.com/firebasejs/10.13.1/firebase-messaging-compat.js');

const firebaseConfig = {
};
firebase.initializeApp(firebaseConfig);
const messaging = firebase.messaging();
messaging.onBackgroundMessage((payload) => {
  const notificationTitle = payload.notification.title;
  const notificationOptions = {
    body: payload.notification.body,
    icon: './logo192.png',
    data: {
      url: payload.fcmOptions.link, // Customize the link to open when the notification is clicked
    }
  };
  self.registration.showNotification(notificationTitle, notificationOptions);
});

The Service Worker has been successfully registered and is functioning properly, with no errors present in the console.