Sending Notifications on Chrome Extension
The goal is to...
- Send notifications on Installation and Updates of a given Chrome Extension (with different content, of course)
- Open specific links when notifications are clicked.
Sending Notifications
var extensionPage = "https://chosunghyun.com/youtube-comment-language-filter";
var updateLogPage = "https://chosunghyun.com/youtube-comment-language-filter/updates";
chrome.runtime.onInstalled.addListener(function (object) {
if (object.reason === 'install') {
chrome.notifications.create(extensionPage, {
title: 'YCLF is now installed π',
message: 'Click here to learn more about the extension!',
iconUrl: './images/min-icon128.png',
type: 'basic'
});
} else if (object.reason === 'update') {
chrome.notifications.create(updateLogPage, {
title: 'YCLF updated to v' + chrome.runtime.getManifest().version + ' π',
message: 'Click here to check out what\'s new!',
iconUrl: './images/min-icon128.png',
type: 'basic'
});
}
});
Also available on GitHub
- Note that
iconUrl
should be the path frommanifest.json
to the image file, not from the background script. - You can use
chrome.runtime.getManifest().version
to get the version of the extension. - If you want to send notifications from anywhere else than the background script, you must have a communication module between the notification sender and the background script to pass the notification details. Create a notification at
background.js
with that given detail. Sending notification directly fromcontent.js
seems restricted. Check this post for more information.
Opening Links when notifications are clicked
Generally, you would need an event listener for each notification. However, there is a neat way to reduce duplicate codes.
chrome.notifications.onClicked.addListener(function (notificationId) {
chrome.tabs.create({ url: notificationId });
});
The trick is to store the link at notificationId
field and to attach an event listener to the notifications. This way, you can only use one event listener to open multiple types of links.
Additional Readings
chrome.notifications
section on Google Chrome Developer Docs- Open URLs in Chrome Notifications on Stack Overflow
Note: Added June 19 2020
It doesn't seem that this is the ultimate answer. While the notification opens up the intended page when the user clicks the notification right after it popped up, the notification does not open up the page on click if the notification is sent to the notification center. This post will be updated if I find a better solution.