Web/API/ServiceWorkerGlobalScope/notificationclick event

From Get docs


The notificationclick event is fired to indicate that a system notification spawned by ServiceWorkerRegistration.showNotification() has been clicked.

Bubbles No
Cancelable No
Interface NotificationEvent
Event handler onnotificationclick

Examples

You can use the notificationclick event in an addEventListener method:

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('/');
  }));
});

Or use the onnotificationclick event handler property:

self.onnotificationclick = 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
Notifications APIThe definition of 'onnotificationclick' in that specification. Living Standard

Browser compatibility

Update compatibility data on GitHub

Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet
notificationclick event Chrome

Full support 40

Edge

Full support ≤79

Firefox Full support 44

Notes'

Full support 44

Notes'

Notes' Extended Support Releases (ESR) before Firefox 78 ESR do not support service workers and the Push API.

IE

No support No

Opera

Full support 24

Safari

Full support 11.1

WebView Android

No support No

Chrome Android

Full support 40

Firefox Android

Full support 44

Opera Android

Full support 27

Safari iOS

Full support 11.3

Samsung Internet Android

Full support 4.0

Legend

Full support  
Full support
No support  
No support
See implementation notes.'
See implementation notes.


See also