CODEWITHSUNDEEP
firebasepush-notificationfirebase-cloud-messagingservice-workerprogressive-web-apps
user2335065
user2335065

Reputation: 2567

My notification badge icon is not showing after the PWA is installed to homescreen

I have a mobile website which has the ability to receive push notifications. Some codes on the firebase-messaging-sw.js are as below, 

 messaging.setBackgroundMessageHandler(function(payload) {
  console.log('[firebase-messaging-sw.js] Received background message ', payload);
  // Customize notification here
  var notificationTitle = payload.data.title;
  var notificationOptions = {
    body: payload.data.body,
    icon: payload.data.icon,
    data: payload.data.click_action,
    badge: "{icon url}",
    image: payload.data.image,
    tag: payload.data.unique_id
  };


  return self.registration.showNotification(notificationTitle,
    notificationOptions);
});

When I allow notifications on the mobile Chrome, the notifications are showing perfectly, which my custom made badge logo showing on the notification bar. But after I click on "Add to Homescreen", the notification badge icon becomes the default bell-shaped icon. Why is it like that and is there any ways to change it?

Thank you.

Upvotes: 5

Views: 2640

Answers (1)

Mark Szabo
Mark Szabo

Reputation: 10578

This is a known bug in Chrome. They have already fixed it in this commit.

The bugfix is rolling out with Chrome 69 on the 4th of September (tomorrow). You can check the rollout state here: https://www.chromestatus.com/features/schedule

Upvotes: 3

Related Questions