How can you find out if the current browser supports the Push API and Web Push Notifications?
Vanilla JavaScript
Here's a simple code to implement feature detection for the Push API:
if ('PushManager' in window) {
// the current browser supports the Push API and Web Push Notifications
} else {
// fallback for browsers that don't support this feature
}
Pushpad JavaScript SDK
If you use the Pushpad JavaScript SDK we recommend to use this command provided directly by Pushpad (which has better integration with Pushpad and also detects support for the proprietary APNs protocol of Safari):
pushpad('unsupported', function () {
console.log('Browser unsupported.');
});
The command is run only for browsers that don't support the Push API: you can use it, for example, to hide any UI element related to notifications (since notifications are not supported by the browser) or display a custom message to the user (e.g. suggest to use a different browser).
Please note that all the other commands provided by the Pushpad JavaScript SDK, including the widget, are not executed if the browser is unsupported: they are simply ignored, like a no-op, and they don't throw any error.
Support tables for the Push API
If you don't want to detect the browser support yourself, but you are just looking for support tables for different browser versions you can see the Push API on caniuse.com.
See also the browser support on Pushpad.
Finally note that some browsers have better support for the Push API, because they allow to receive the notifications even when the browser is closed.