This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The parameter passed into the onnotificationclick handler, the NotificationEvent interface represents a notification click event that is dispatched on the ServiceWorkerGlobalScope of a ServiceWorker.
This interface inherits from the ExtendableEvent interface.
Constructor
NotificationEvent.NotificationEvent()- Creates a new
NotificationEventobject.
Properties
Inherits properties from its ancestor, Event.
NotificationEvent.notificationRead only- Returns a
Notificationobject representing the notification that was clicked to fire the event. NotificationEvent.actionRead only- Returns the string ID of the notification button the user clicked. This value returns
undefinedif the user clicked the notification somewhere other than an action button, or the notification does not have a button.
Methods
Inherits methods from its parent, ExtendableEvent.
ExtendableEvent.waitUntil()-
Extends the lifetime of the event. It is intended to be called in the
installEventHandlerfor theinstallingworker and on theactiveEventHandlerfor theactiveworker.
Example
self.addEventListener('notificationclick', function(event) {
console.log('On notification click: ', event.notification.tag);
event.notification.close();
// This looks to see if the current is already open and
// focuses if it is
event.waitUntil(clients.matchAll({
type: "window"
}).then(function(clientList) {
for (var i = 0; i < clientList.length; i++) {
var client = clientList[i];
if (client.url == '/' && 'focus' in client)
return client.focus();
}
if (clients.openWindow)
return clients.openWindow('/');
}));
});
Specifications
| Specification | Status | Comment |
|---|---|---|
| Notifications API The definition of 'NotificationEvent' in that specification. |
Living Standard | Living standard. |
Note: This interface is specified in the Notifications API, but accessed through ServiceWorkerGlobalScope.
Browser Compatibility
| Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|
| Basic support | 42 | 44.0 (44.0)[1] | ? | ? | ? |
| action | 48 | ? | ? | ? | ? |
| Secure contexts only | 62 | ? | ? | ? | ? |
| Feature | Android Webview | Chrome for Android | Firefox Mobile (Gecko) | Firefox OS | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|---|
| Basic support | No support | 42 | 44.0 (44.0) | (Yes) | ? | ? | ? |
| action | No support | 48 | ? | ? | ? | ? | ? |
| Secure contexts only | No support | 62 | ? | ? | ? | ? | ? |
[1] Service workers (and Push) have been disabled in the Firefox 45 and 52 Extended Support Releases (ESR.)