NotificationOptions.requireInteraction Sample

Available in Chrome 47+ | View on GitHub | Browse Samples

On Chrome desktop, prior to Chrome 47, a notification toast would stay on screen until the user interacted with it. As of Chrome 47 notifications will minimize to the notification center after approximately 8 seconds unless the 'requireInteraction' property of the notification options is set to true.

Chrome for Android is not affected as all notifications are minimized to the notification tray.

JavaScript Snippet

navigator.serviceWorker.register('sw.js');

function showNotifications() {
  Notification.requestPermission(function(result) {
    if (result === 'granted') {
      navigator.serviceWorker.ready.then(function(registration) {
        registration.showNotification('requireInteraction: true', {
          body: 'Requires interaction',
          icon: '../images/touch/chrome-touch-icon-192x192.png',
          requireInteraction: true,
          tag: 'require-interaction'
        });

        registration.showNotification('requireInteraction: false', {
          body: 'Does not require interaction',
          icon: '../images/touch/chrome-touch-icon-192x192.png',
          requireInteraction: false,
          tag: 'no-require-interaction'
        });
      });
    }
  });
}