Re: [w3c/ServiceWorker] Allow service workers to detect light/dark mode (#1577)

@jakearchibald, for clarity, are you suggesting that this is not the right forum to discuss this issue or just noting that discussion should consider use cases beyond service workers? In the case of the former, I'm happy to start a new discussion with WHATWG or in more appropriate forum.

@wanderview, to make sure I understand [this suggestion](https://github.com/w3c/ServiceWorker/issues/1577#issuecomment-814934274), are you saying that a page would do can/should like this?

```js
// page script
let prefersDark = matchMedia('(prefers-color-scheme: dark)').matches;
let swURL = `/sw.js?prefersDark=${prefersDark}`;
navigator.serviceWorker.register(swUrl);

// service worker
self.addEventListener('install', event => {
  let url = new URL(location);
  let prefersDark = url.searchParams.get('prefersDark');
  
  event.waitUntil(async () => {
    /* use `prefersDark` to cache color scheme specific resources */
  })
});
```

I think this approach (and the one described by @tomayac) are reasonable (if somewhat unergonomic) solutions to the open web use case for caching assets on initial SW registration. Unfortunately neither is great for extensions as Chrome serves extension assets and manages the extension service worker lifecycle. Extensions tend to work best when either given an imperative API that can be accessed at runtime or with a declarative API that allows the extension to the browser for the heavy lifting. 

The use case that originally inspired this issue was dynamically rendering an extension's icon. My thinking was that without a clear signal on which color scheme should be used, the extension would have to fall back to rendering the icon using a default (probably light) theme.

On additional reflection, though, that use case has more to do with the user's browser theme than it does their system's `prefers-color-scheme` value. While these may be related, they are not necessarily the same. Extension UI can (and should) continue to use existing web development patterns to determine which theme to use in web contexts such as the action popup window or UI injected into a web page.

-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/w3c/ServiceWorker/issues/1577#issuecomment-815367251

Received on Thursday, 8 April 2021 00:48:34 UTC