Forum Discussion
William Devereux
Microsoft
Nov 10, 2020Improving notifications and badging in Microsoft Edge
Notifications are an important part of the web, helping users stay up to date about what’s going on. Earlier this summer we announced a set of changes to make notification requests less distracting for users. This was just the first step, and we are working to reenable the full notification prompt for sites with desired notifications while maintaining quiet requests for others. Stay tuned for more updates on this soon.
Today, we’re excited to share more about the work we’re doing to ensure users never miss out on the notifications they care about.
Notifications when you need them, not just when the browser is open
Most desktop browsers only receive notifications while they’re running, causing users to miss out on important updates if the browser is closed. And when users do finally open their browser, they’re treated to a flood of incoming notifications that may no longer be relevant. The legacy version of Microsoft Edge addressed this issue with support for background notifications while the browser was closed, and we’re excited to share that the new version of Microsoft Edge now does as well.
Taking advantage of background notifications is easy, and any site which supports web push notifications using the web standard Push API, Notifications API, and web push protocol is already supported. Web developers don’t need to make any special changes to their website for users to receive notifications while Microsoft Edge is closed—it all just works. This feature is available now for anyone using Edge 85 on Windows 10 version 20H1 and above.
Notification badges on the taskbar/dock
While notification toasts—the little messages that appear with important alerts—are incredibly helpful when used properly, some types of notifications are better suited to a more lightweight update. For years, desktop and mobile operating systems have supported showing a badge with a notification count on surfaces like the Windows taskbar, macOS dock, and Android or iOS home screen, but this feature has always been limited to native apps. With the latest version of Microsoft Edge, PWAs and pinned sites can now display badges as well.
Basic support for badging PWAs has been available on Windows and Mac since Edge 81, as well as in other Chromium browsers. Developers can set and update badges using the Badging API from documents or service workers. Service workers allow users to receive notifications or badge updates when the site or PWA is not open. However, for privacy reasons, updating a badge via the service worker push event also requires that the site show a toast notification. Users must also opt into receiving notifications from the site. Learn more about how to enable badging on your site.
Unfortunately, one of the drawbacks of badging in most browsers is that badges can only be shown on the taskbar while the PWA is open. But with the recent changes we’ve made to Microsoft Edge, badges can now be shown on the taskbar at any time. This, combined with the background notification capability, removes the key limitations of badging and ensures that users can rely on taskbar badges regardless of whether the PWA or Microsoft Edge is running. We’ve also added support for badging pinned sites, bringing the feature to any web-powered experience on the taskbar. To take advantage of these improvements, users must be on Edge 85 (for PWAs) or Edge 87 (for pinned sites) with Windows 10 version 20H1 or higher.
Between background notifications when the browser is closed, more reliable badging, and support for badges on pinned sites, users can rest assured they’ll always receive important updates for their favorite sites in Microsoft Edge. And best of all, developers who are already using service workers for notifications and badging don’t have to do a thing.
If you haven’t enabled badging for your site, this article will help you get started. Users often find badging very useful, and our research shows that sites with badges see increased engagement overall. We’re so excited to see how developers will use these improvements to enhance the experience on the web.
— William Devereux, Senior Program Manager, Microsoft Edge
— Jungkee Song, Senior Program Manager, Microsoft Edge
- ChaythonCopper Contributor
I tried installing outlook.com but it was much faster to open a tab than to open the pop-up style window of the pinned to start installation... [loaded significantly faster]
- Deleted
William Devereux I hope all others like google, fb and twitter add this feature to their websites too.
Deleted
last night I noticed Twitter enabled this feature
Edge Version 88.0.692.0 (Official build) dev (64-bit)
- Mike GlennSteel Contributor
I use Messages for Web as a PWA and keep it pinned to my desktop along with Skype and Telegram. (BTW, I keep them together in a tab group using TidyTabs.) The badging feature is something I've been patiently waiting for. Currently, I have to keep checking Messages for Web to see if anything new has arrived. The badge will make a huge difference. I just hope Google will implement it.
- Reza_Ameri-ArchivedBronze Contributor
Very excited and happy to see these features.
It would be nice to support notification when side PIN to start menu in Windows 10 too. I also interested in case PIN website to start menu would also support live title (I believe there is need to write some API for it).
While this is good feature, there are risk of abuse this feature by malicious websites. For example, you might notice websites like they are asking users where you WIN LOTTERY or ask them to download malicious programs and when user want to navigate away they show message like do you want to close this page? I believe there should be some sort of control over notification like limit them and user have ability to set limitation for them and also reporting and blocking this feature in case websites abuse it like sending multiple unwanted notifications.
- Spoiler
Reza_Ameri-Archived wrote:Very excited and happy to see these features.
It would be nice to support notification when side PIN to start menu in Windows 10 too. I also interested in case PIN website to start menu would also support live title (I believe there is need to write some API for it).
While this is good feature, there are risk of abuse this feature by malicious websites. For example, you might notice websites like they are asking users where you WIN LOTTERY or ask them to download malicious programs and when user want to navigate away they show message like do you want to close this page? I believe there should be some sort of control over notification like limit them and user have ability to set limitation for them and also reporting and blocking this feature in case websites abuse it like sending multiple unwanted notifications.
Notifications and badges are separate things.
Edge handles notifications very good, using quiet notifications feature. there is no more spam of notification requests.
and as the article says about badging:
"because they don't interrupt the user, they don't need the user's permission."
so no interruption, no malicious activity. if a website is malicious, Edge already knows how to handle them. this badging feature comes after the Edge's already-in-place defense against malicious websites.
- if websites spam user by showing messages when user tries to close the page, there is a checkbox to select to stop website from showing any more of those messages.
- if website is malicious, Edge uses built in security tools to mitigate them. take a look at them in: edge://settings/privacy
- websites can't automatically show badges on the taskbar, user must intentionally go to the settings and Pin that website on the taskbar. so, prior to that decision, some sort of trust must have happened between user and the website.
- even after user deliberately Pins a website to the taskbar and then that website decides to be malicious, all they can do is to show a small tiny number in the taskbar. if user, at any time, feels it's an unwanted behavior, they can go ahead and unpin that website's icon from the taskbar via a simple right-click.
when I review the JavaScript code for Bading API, I don't see how malicious payloads can be sent through it. if you do, mention the exact part of the code here.
- Reza_Ameri-ArchivedBronze Contributor
I am aware of all these features, my point is with social engineering spammers and bad guys would be able to convince user to take actions like add to pin and so on.
When I see any malicious website, I will report them in SmartScreen filter but many users might not do that and they fall into trap.
I am sure Microsoft Edge teams take some steps to mitigate it, but this is just reminder to make sure they are aware of every aspect of it.
- DevLance91Copper Contributor
Jungkee_Song Any chance we can get an update on this one https://techcommunity.microsoft.com/t5/discussions/potential-bug-retrieving-service-worker-notifications-on-macos/m-p/1813448? We just ran into it today, and figure it's a pretty bad bug as it can affect notifications. Essentially, calling "getNotifications()" (https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration/getNotifications) in the service worker in Edge on macOS just hangs on the promise, and never resolves. For us, this results in our service worker notifications never being sent as they're created in the code following that call. It works fine in Edge on Windows.
- Jungkee_Song
Microsoft
Thank you so much for reporting it to us. Sorry for your inconvenience with this issue, DevLance91, @elidupuis.
We confirmed this bug and are currently working on a fix. We'll keep you posted once we're ready with the fix.
Thank you,
Jungkee Song
PM, Microsoft Edge
Has anyone succeeded in getting notification badges on Windows taskbar yet?
if so please share your Windows version, Edge version and website. thanks
- Chris LoveBrass Contributoryes, works like a champ, once you add the code to your application.
Yes of course, no doubt it works. what I was asking was for a production and public website on the Internet right now, like any social media.
Just to get an idea of how many popular and well-known websites on the Internet are using this feature.
- Chris LoveBrass ContributorMicrosoft will have to add code to Outlook to trigger badging in the icon
- KamSilver ContributorWilliam Devereux Seems complicated to implement this on my website, hopefully, there's an easier way.
Kam wrote:
William DevereuxSeems complicated to implement this on my website, hopefully, there's an easier way.just need to know JavaScript.
- Bart WillemanIron Contributor
William Devereux Very nice and excellent news!
I am assuming all Microsoft services like Outlook.com will support this from next week when Edge 87 will launch in the Stable Channel!?
- R7anubisBrass Contributor
William Devereux Now suppose I've installed the discord site as an app.
How do I enable this badge thing to show up on it?- Chris LoveBrass Contributor
R7anubis Discord will have to implement this in their site. It is not something the consumer configures.
- Alexei_DrekkerIron ContributorDo you have any data about system resource usage with and without background notifications?