New elm-pwa package almost ready

I’ve been working on elm-pwa, a small package that wires browser PWA APIs to your Elm app through a single pair of ports.

It covers: service worker lifecycle (install, update, cache strategies), install prompt, online/offline detection, and push notifications.

What it provides:

  • Elm module (Pwa) — typed events, decoder, and command helpers
  • JS module (init) — wires browser events to the ports
  • Build function (generateSW) — generates a configurable service worker

The generated service worker supports cache-first, network-first, and network-only strategies, SPA navigation fallback, push notifications, and automatic update checking.

Live demo: elm-pwa.pages.dev

Repo: github.com/mpizenberg/elm-pwa

I’d love to get feedback on the API design and overall approach. Also, if you could try the demo on your device/browser and report whether it works (install prompt, offline mode, push notifications), that would be very helpful!

Of course elm-indexeddb will be complementary to provide the local data storage :wink:

EDIT: screenshot after a few iterations with feedback (thank you!)

16 Likes

Up to now, feedback I got say that notifications with chrome on Android work, but iOS does not. So if you are and Elm dev with access to an iPhone, I’m really interested in your feedback and potential contribution.

Here is the demo web app: https://elm-pwa.pages.dev/

Install the PWA, then open it, subscribe to notifications and let me know if you receive notifications or not. And if you want to help, there are a few ways.

One is simply finding clear resources on how to make web push notifications work on iOS. Best would be resources that prove what they say by showing the code and having an example app that works.

Then the next step is trying stuff directly with the elm-pwa code. The code of the demo app is here: elm-pwa/examples/demo at main · mpizenberg/elm-pwa · GitHub

And for the push server, I’m using this: https://github.com/mpizenberg/go-notify-server
deployed here: https://push.dokploy.zidev.ovh/

I may have fixed it now! Let me know!

I tried on iPhone and got no notifications. The UI said that 1 was sent.

1 Like

Would you mind sharing your device + browser and steps? Especially iOS safari version.

They don’t show Safari versions on iOS. But I’m on 26.1 now version of iOS, iPhone 17.

I subscribed to notifications and it requested it via native dialog, then subscribe to push. Then send a message via form. It showed green succes sent message.

1 Like

Just to make sure, did you “install” the PWA before doing these steps, and opened the installed PWA? You should see something like that:

I did. Otherwise there is no button to subscribe

I see what happen now. I had sleep on which prevents notifications :slight_smile: so it works as expected. I disabled sleep mode and got notifications.

2 Likes

I get the following results on MacOS (Tahoe 26.2)

Safari (26.2 (21623.1.14.11.9)) - no option to install, permissions requested, notifications are sent and received

Firefox (147.0.4 (aarch64)) - no option to install, permissions requested, notifications are sent but not received

Chorme (145.0.7632.110 (arm64)) - installed fine, no permissions requested, notifications are sent but not received

HTH

1 Like

I have added two new features to the demo:

  1. just after installation, show a banner to suggest opening the dedicated PWA instead of staying in browser.
  2. later, when opening the browser while the PWA is installed, display a hint that the pwa is installed.

These are possible through web apis only available on chrome unfortunately, so will only work on android mobiles. On desktop macos, I have only (1) working, but not (2) even with chrome. And on iOS, unfortunately none of these two are possible.

2 Likes

I just added support for two additional push notification fields:

  • lang: can be used to indicate language preferences for the notification
  • silent: indicate the notification should be silent, avoid noise and vibration. A nice gesture when your app isn’t super important.

These two fields are also supported in the accompanying push notification server GitHub - mpizenberg/go-notify-server: A minimal, self-hosted Web Push notification server in Go · GitHub

Also updated the example demo app to be able to set the tag field and silent toggle, as well as always send the notification with the icon field set to the app icon so that it’s visible in the notification.

The tag field is convenient to be able to replace notifications (with same tag) instead of staking many of them. Very useful when many notifications would be sent, so that the receiver only have 1 notification in their notification center.

5 Likes