Note:
This feature is available in Web Workers.Secure context
This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.
The NotificationAction
interface of the Notifications API is used to represent action buttons the user can click to interact with notifications. These buttons' appearance and specific functionality vary across platforms but generally they provide a way to asynchronously show actions to the user in a notification.
Properties
Instance properties
These properties are available only on instances of the Notification
object.
NotificationAction.action
Read only- The name of the action, which can be used to identify the clicked action similar to input names.
NotificationAction.title
Read only- The string describing the action that is displayed to the user.
NotificationAction.icon
Read only- The URL of the image used to represent the notification when there is not enough space to display the notification itself.
Example
Notifications can fire notificationclick
events on the ServiceWorkerGlobalScope
.
Here a service worker shows a notification with a single "Archive" action, allowing users to perform this common task from the notification without having to open the website. The user can also click the main body of the notification to open their inbox instead.
self.registration.showNotification("New mail from Alice", {
actions: [
{
action: 'archive',
title: 'Archive'
}
]
});
self.addEventListener('notificationclick', function(event) {
event.notification.close();
if (event.action === 'archive') {
// Archive action was clicked
archiveEmail();
} else {
// Main body of notification was clicked
clients.openWindow('/inbox');
}
}, false);
Specifications
Specification | Status | Comment |
---|---|---|
Notifications API | Living Standard | Living standard |
Browser compatibility
BCD tables only load in the browser