🗓 October 25, 2022
There are these handy status indicators on pinned tabs that tell you when something has happened. A good example is Gmail, which lights the indicator when you get a new unread message in your inbox.
I'm a big fan of these notifications because the are non-invasive. I can quickly scan and see that I have a new email, but I'm not getting an obnoxious notification that distracts me from what I'm currently working on. They are clear information signals, easy to digest, but easy to ignore.
There are a few ways to get Firefox to display the indicator. You can integrate them to your app/site using a few techniques.
One way to show the alert is to call
while the tab is pinned.
alert('yo')// orprompt('heeey')// or confirm('blinkkk')
This works, but it's a heavy handed approach as these functions trigger blocking UI that should be used sparingly.
This technique is much more subtle, and comes with the added bonus of being able to slap some helpful info in your title. Let's look at an example.
Say the current document title is
Inbox. You might want to change the title to
Inbox (1). Like so:
document.title = 'Inbox (1)'
If this happens while the tab is closed and the user has a different tab selected, the blinky light will flash!
alert approach, this technique is less invasive, doesn't block the UI
and gives you the opportunity to add some info to the title.