question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

How to handle Notification click events (cannot find docs)

See original GitHub issue

I’m submitting a…

[X] Documentation issue or request

Current behavior

Currently, its not clear how to handle notification clicks with angular service worker.

Expected behavior

Finding a source how to handle notification clicks in web push in PWA would be great! 😃 thanks

Minimal reproduction of the problem with instructions

Just send a push notification with actions like

let notificationData = {}
  notificationData.notification = {
    title: notification.title,
    actions: [{
      action: 'openapp',
      title: 'Open App'
    }],
    body: notification.body,

and clicking on Open App in the push notification wont work.

What is the motivation / use case for changing the behavior?

It’s a widely requested feature .

Environment


Angular version: 5.2.5

Browser:
- [x] Chrome (desktop) version 64

For Tooling issues:
- Node version: 9.3 
- Platform:  
Mac

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Reactions:22
  • Comments:10 (4 by maintainers)

github_iconTop GitHub Comments

16reactions
sreevani-ship-itcommented, Jun 8, 2018

Right now we only support displaying the notifications, not interacting with them.

Thanks, Sreevani

On Fri, Jun 8, 2018 at 1:54 PM, sinasava notifications@github.com wrote:

Any update in Angular 6?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/angular/angular/issues/22311#issuecomment-395687761, or mute the thread https://github.com/notifications/unsubscribe-auth/AfgQd4h7tWC7EuRPzcoR3pfDB0EV-yL6ks5t6jS8gaJpZM4SKkua .

5reactions
jek-bao-choocommented, Jun 13, 2018

@u-ryo thanks for the workaround in https://github.com/angular/angular/issues/20956 and this repo https://github.com/u-ryo/angular-swpush to reference for the workaround. It was also worth mentioning that in https://github.com/angular/mobile-toolkit/issues/178 that @webmaxru noted that extending the capability is the way.

A point to note, the swPush without built-in notification click_action is like a bird without wings. Using a workaround is like giving the bird an artificial wings, but why? What is the impetus/motivation behind this design of swPush?

@chembu would appreciate if you could extend the swPush with built-in notification click_action. Many thanks.

Read more comments on GitHub >

github_iconTop Results From Across the Web

ServiceWorkerGlobalScope: notificationclick event - Web APIs
The notificationclick event is fired to indicate that a system notification spawned by ServiceWorkerRegistration.
Read more >
Detect click on notification in web starter kit - Stack Overflow
You need to put the notificationclick event handler inside the service worker file, and use self.addEventListener (or just addEventListener ):
Read more >
Troubleshoot missing Google Calendar notifications
Find missing event notifications on a calendar · Open Google Calendar. · Click Settings . · Select Settings. · On the left sidebar,...
Read more >
Custom Events - Airship Docs
To browse the available templates, see Custom Event Templates. ... attribution: If a push notification is sent to the device and the user...
Read more >
Notification behavior - web.dev
Notification Click Event # ... When a user clicks on a notification, the default behavior is for nothing to happen. It doesn't even...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found