Get notified of new strips through push notifications (BETA)

Webcomic Push Notification Manager (BETA)

This BrowserApp's Subscription Status

FYI: you are now viewing this page in a regular browser tab.

FYI: you are now viewing this page in a PWA environment.

About

This is a rudimentary web push notification system to be reminded when a new SONAIS webcomic strip is available. This works most reliably in regular browsers (Firefox, Chrome) on desktop operating systems. On mobile devices it can be hit-and-miss.
The BETA label means this may contain bugs and not behave according to my quality standards. Given the current state of how Web Push is implemented across different platforms, I'm afraid I will not be able to remove the BETA label in the foreseeable future, if ever.
Some alternative ways of getting notified of new strips are explained on the About page.

Instructions

In a nutshell:

First open this page on the device where you want to receive the notifications. Then continue reading the instructions from here onward.
There are 2 possible ways to set up notifications on a device:

1. Install this as a so-called PWA, a “Progressive Web App,” basically a webpage bookmark on your home screen that gets special treatment to make it act like an app. This is what you should use on mobile devices like iOS or Android.
   Detailed instructions are below. After deploying the PWA, open it and continue following these instructions shown inside it. It looks like you have already deployed the PWA, and we're inside it. Good. Now the only thing left to do, is press the Subscribe/Refresh button if you haven't already.
2. Subscribe your web browser itself to the notifications. This is the recommended way on PCs/Macs/laptops (most of them won't even support deploying a PWA anyhow).
   In this case, just press the Subscribe/Refresh button. (If that button is not even available, you are likely using a mobile device and will need to deploy the PWA.)

More details:

Unfortunately the current state of push notifications is still shrouded in black magic and arcane rituals—not only for developers, but also for users. However, I expect anyone who reads the S.O.N.A.I.S. comic to be geeky enough to figure it out. If you are unfamiliar with push notifications, I'm sorry to say that you will have to read through the entire pile of text below, to have a good chance of the notifications working and not breaking after a while—welcome to the modern Internet.

• Push messages are registered for the specific browser on the device where the Subscribe button is pressed.
  For instance, if you want the messages to show up on your smartphone, navigate to this page on that phone, then do the PWA ritual as described below because it is a mobile device, and then press the button in the PWA.
• On iOS Safari (iPhones and such), you need at least iOS version 16.4, it won't work in older ones. Even in compatible versions, this will not work directly in the Safari app: you must first install this as a PWA.
  To do this, press the ‘Share’ button that is either in the top right of the display or at the bottom (scroll up to make it appear), and then choose “Add to Home Screen.” Then open this newly installed ‘app,’ and follow the instructions inside it. In iOS, you must deploy this as a PWA, but it looks like you already did this. 👍
• It looks like you have already deployed the PWA and are now reading these instructions inside it. Good. The only thing left to do, is press the Subscribe/Refresh button above if you haven't already.
• On Android or other non-iOS mobile devices, I recommend deploying the PWA as well, for reasons of convenience and reliability.
  You might get a prompt to deploy the PWA upon opening this page. If not, it can be installed through the browser menu in a similar way as described above for iOS. First deploy the PWA, open it, and only then press the Subscribe button inside it. If you prematurely subscribed outside of the PWA, hit Unsubscribe before re-subscribing inside it.
• The registered app must stay “open” for notifications to appear (mostly) reliably. You don't need to keep any of this website's pages open; notifications are handled by a ‘service worker’ that stays present in the background. (Don't worry, resource usage is minimal.)
  Even though in theory, on some devices it is not required to open the PWA or browser app after a reboot, in practice it is recommended, to avoid the omnipresent bugs.
• If you want notifications on multiple devices, you need to subscribe each of them, but this is not recommended because each device will act independently and be unaware that you already opened a message elsewhere.
  If you want to migrate to a new device, unsubscribe the old one and repeat the subscription process on the new one.
• You should open this pagePWA from time to time, to allow the notification system to update itself to a newer version if available.
  I recommend opening this PWA at least once a month, to avoid that your device thinks you do not actively use it—recent mobile operating systems are really eager to automatically disable stuff.

Remarks

• This requires a fairly recent browser to work. If you are using Chrome or Firefox on any non-antique device, it should work. Safari on iOS works from version 16.4 onwards. Safari in MacOS works from Ventura (13.0) onwards (but, see remark below).
• The local notification test button creates a fake notification to see if at least that part works. It does not test receiving messages from the server. The only way to verify that, is to wait for the next strip to be published. It is not abnormal for the first message not to appear, so don't panic until you have seen at least 2 new strips on the S.O.N.A.I.S. website without being notified.
• Safari in (a compatible version of) MacOS does does have one upside: you should still receive notifications even when Safari is “closed*.” However, the downside is that you may also have to jump through extra hoops here, see the troubleshooting section below.
  • (* spoiler: Safari never really closes. Apple is now doing exactly what they accused Microsoft of back in the days: making their browser too intertwined with the OS. How times have changed… or not.)
• When opening a notification, the comic page should be opened either in an embedded browser inside this PWA, or in your regular browser app, this varies per browser and device brand.
  Random bugs in Web Push may cause you to end up on this ‘app’ page instead of the comic page. In that case, you can always hit the SONAIS logo above to go to the comic.
  If opened inside the PWA and you're done reading, close the embedded browser or hit the ‘back’ or ‘Done’ button to return to this UI, but mind the iOS bug mentioned below.
• If you want to remove notifications from this particular device, first hit the ‘Unsubscribe’ button while connected to the internet. It makes sense to uninstall the PWA afterwards (remove it from your home screen and/or apps list).
• This comes without any promises. Use at your own risk—although the worst that can go wrong is that you either get no notification when you should, or perhaps get a few duplicates of the same notification. Reliability depends on Google's FCM, my ability to work around bugs, alignment of the stars and planets, and the degree to which certain companies succeed in pushing their disgusting agendas rife with dumb short-sighted greedy policies aimed at hurtling us all back to the pre-internet era.
• This has the least risk of spontaneously breaking if the subscribed browser is pretty much guaranteed to be always running. Reliability seems best on a desktop/laptop machine. A smartphone that is always online should also work most of the time; a tablet that is only sporadically used, not so much…
• This works without logins or authentications. I opted to implement the messages through Google's FCM, a.k.a. Firebase service. The FCM server keeps a unique ID for this particular ‘app’ on the browser where the Subscribe button is pressed. If you want to have this ID wiped from the servers, it can be done, but you will have to contact me. In general it is pointless to be paranoid about this; this little bit of data is of no use to anybody and will vanish a few months after unsubscribing anyway.
• Don't try to go all Zhang on this to see if you can break it with typical QA practices like hitting the buttons like a madman. The server might decide you behave like a bot, and trigger an automated ban. Also do not try to install the PWA multiple times even if it seems possible.

Troubleshooting

• Push message subscriptions are fragile. Expect notifications to break as soon as you change something about this site's notification permissions in your browser's preferences, or if you indiscriminately delete site data.
  If you don't use a device for a long time, it will no longer receive messages. A month is guaranteed problematic, but it might already decide to quit working after less than 2 weeks of inactivity. You should check the subscription from time to time by coming back to this page, or opening the PWA if installed.opening this PWA. If you suspect notifications might be broken, hit the ‘Subscribe/Refresh’ button.
• In the Brave browser, you may bump into a “push service error;” in that case you need to jump through some extra hoops to allow push subscriptions.
• In iOS Safari, there may be a risk of getting duplicate notifications. There is nothing I can do about this, it is caused by the combination of a bug in FCM and how iOS treats push notifications. Due to the nature of the bug, unsubscribing and re-subscribing will not fix this, it could make it even worse, so don't. The duplicates should stop occurring after a while—again, no promises.
• Also in iOS Safari, yet another Apple bug: you may end up on a blank page after opening a notification and pressing ‘Done.’ The only remedy is to restart the whole notification app: do the weird gesture to get an overview of open apps, swipe the SONAIS app upwards to close it, then re-open it. To reduce the risk of this bug occurring, keep the app open.
• If you are using Safari in MacOS, and you get an error about ‘PushManager’ when clicking the Subscribe button, this is perfectly “normal,” because Apple. The remedy is to quit Safari and reopen it—don't ask why: Apple. Then click the Subscribe button again, and it might work; if not, repeat this process a few times. If it keeps failing, why not try Firefox or Chrome instead? You might like it.
• In recent versions of Chrome, you may end up in a “default” situation where it seems as if you denied notification permissions, even if you didn't. This is a total mess for which the proper resolution is unclear, but you have a decent chance of fixing it by unsubscribing (if need be, using the ‘force’ option from Geek Mode), entirely uninstalling the PWA if installed, and deleting any notification settings for www.dr-lex.be in your browser's settings. Then re-subscribe.
• Some devices may postpone showing the notification when they are in airplane/silent mode, even if WiFi is enabled.

Why is this so complicated?

If this all seems terribly complicated and confusing, that's because it is. The Web Push ‘standard’ is an organically grown atrocity of which every device/browser vendor has a different interpretation. If it looks awkward as a user, imagine what it took to get all this working from a developer point-of-view. When I started working on this, I thought it would be relatively straightforward to implement—oh boy, what a naïve idea.

For those interested, I have summarised my experiences gathered while implementing this push message system.
There seem to be proposals to make web push messaging less of a pain to implement and use, but for the time being, this is how it is.

Back to the S.O.N.A.I.S. comic