Can a PWA schedule notifications when closed?
12:25 06 Jan 2022

I'm developing a TODO-list PWA which should display the tasks of the day every day at 8:00am, even when the app is closed (similar to an alarm clock).

Is there a way to achieve this with PWAs? (Mainly targeting Chrome/Android)

So far, in my service worker I have (simplified)


self.addEventListener("message", (event) => {
    // Workflow: The app sends a message that the timer should be set.
    const prom = new Promise((resolveIt) =>
      self.setTimeout(() => showAlarmAndResolve(resolveIt, event.data), '')
    );
    // tell the service worker to remain alive until promise is resolved
    event.waitUntil(prom); 
  }
});

async function showAlarmAndResolve(resolveIt, text) {
  const options = {
    body: text,
    tag: "todo-alert",
  };
  await self.registration.showNotification(
    "Your tasks for today",
    options
  );
  resolveIt();   // allow the service worker to terminate
}

Without the event.waitUntil, the notification is not displayed when I close the app on my phone (or close the browser tab), with it, it is displayed. However, keeping the service worker alive for half a day somehow seems like a really bad idea - and furthermore, I read (here: Best practice for keeping timer running in PWA) that on Android the service worker might terminate anyway after ~20 minutes.

How can I implement such an alarm clock like functionality?

Some (older) questions do not really give that much help / hope...
Background events in progressive web apps? (building an alarm clock app)
Is it possible to set the alarm by PWA? (building a timer/alarm clock app)

progressive-web-apps service-worker