Exciting news with the latest WebKit version 16.4 - now you can enable Web Push notifications on Apple devices with ease. However, there seems to be a glitch I encountered while trying to navigate to a specific page within my Progressive Web App (PWA) when clicking on the notification in Safari.
Here is a snippet of the code I used in the ServiceWorker:
self.addEventListener('notificationclick', function (event) {
console.log('On notification click: ', event);
event.waitUntil(
clients.matchAll({
type: 'window',
})
.then((clientList) => {
for (const client of clientList) {
if (client.url === url && 'focus' in client) {
return client.focus();
}
}
return clients.openWindow('/calendar'); // having trouble opening '/' instead of '/calendar'
})
);
event.notification.close();
})
Additionally, my attempts to include multiple actions in the iOS notification were not successful, even though it worked perfectly in Chrome. https://i.sstatic.net/3QurY.jpg
https://i.sstatic.net/pcZ9x.jpg
I tried troubleshooting this issue on an iPhone running iOS 16 Public Beta and Safari Technology Preview with the updated WebKit 16.4 features.
I was hoping to see the notification actions displayed and have the ability to open a specific link within the PWA upon notification click or action selection.
Could it be that these functionalities are not fully supported yet in iOS 16.4? Any insights on when we might expect support for these features or if there's something wrong with my implementation?