Skip to content

add ability to override service worker onPush #24387

Description

@ribbon-otter

EDIT(@gkalpak): Related to issue #26413.

I'm submitting a...


[x] Feature request

Current behavior

The current service worker displays notifications but not offer interaction options, the ability to send messages back to the app to update the app state, or consume web push messages arbitrarily shaped or empty data.

Expected behavior

To override the onPush response of the service worker with my own code. This code would be integrated into the service worker completely replacing the current onPush response when the project is compiled to JavaScript. The code could pass messages to angular services in my project, to allow me to update my app state in response to push messages. The code would responsible for displaying the notification, so that I would have full control over the appearance and behavior (up to what the Web Standard allows).

My suggestion would be to allow an angular service implementing an interface (which containing an onPush function) to be passed to the service worker module on registration. The service worker would then call that service instead of its own method on push events. A disadvantage of this solution would that custom service would run in a different context from normal service workers (since it would run in the service worker context, not the window context). This would be surprising to new developers.

A simpler though perhaps less elegant solution would be to pass a callback function to the service worker module instead of a service. Or the service worker could expose an observable which could be subscribed to for overriding the default push notification system. I believe that these solutions would also have the context weirdness problem. I am not deeply familiar with the angular code base so I am unsure of how easy to implement or angular in style these particular solutions would be.

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

The angular service worker support caching really well, likewise for updating the service worker. It handling of push notifications is lacking; however, even in world where the service worker configuration covers most common things, like navigating to a URL on click or even simple user interaction, there would be a need to integrate code from the app into the behavior of the service worker.

For example, to display the new message in the app even if the user is no longer connected to the internet at the time of clicking the notification. (In this hypothetical, the user was connected to the internet when they received the notification, of course) This would avoid the awkward experience of being told there is a new message and seeing the message in the notification and then clicking the notification and being brought to a page which doesn't show the message because the page cannot load it from the server anymore.

If we could override the onPush event in the service worker, then the app could add the message to the page at the same time as it displays the notification, thus preventing the user from losing their ability to view it when clicking the notification.

An alternative reason for overriding the onPush even is if one needs to consume push events which one doesn't have tight control over the shape of the data inside. For example, if one is using third-party server app to generate the push notifications, or changing the data inside would require making a request to another development team. Additionally the developer could make their app respond to empty notifications which are easier to test and emit from a server.

Additionally, the web app notification interface is fairly new and it would be nice if angular let web developers use as poorly supported (or as widely supported) features without having to wait for angular to implement them.

Environment


Angular version: 6.0.4


Browser:
- [x] Chrome (desktop) version XX
- [x] Chrome (Android) version XX
- [ ] Chrome (iOS) version XX
- [x] Firefox version XX
- [ ] Safari (desktop) version XX
- [ ] Safari (iOS) version XX
- [ ] IE version XX
- [ ] Edge version XX
 
For Tooling issues:
- Node version: 8.11.1
- Platform:  Windows 7

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    area: service-workerIssues related to the @angular/service-worker packagefeatureLabel used to distinguish feature request from other issues

    Type

    No type

    Projects

    No projects

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions