Dark Mode Toggle isn't global

[higaski]

I've tried the Dark Mode Toggle and although it basically works, it only switches preferences for a single html page and not globally for all pages in the documentation. Once the option is set for a page it stays that way.

PS: Thank you for this project. It literally saved the documentation of an legacy project I'm working on currently.

[jothepro]

Hmm, thats weird and I cannot reproduce it. What the toggle does is write a key in the localStorage. The localStorage should be global for your domain. Do you have the same problem with the demo page?

Are you opening the documentation locally on your computer with a file: URL? The localStorage documentation says:

In all current browsers, localStorage seems to return a different object for each file: URL. In other words, each file: URL seems to have its own unique local-storage area.

I didn't experience this behaviour on my machine, but maybe that's a hint to what your problem may be?

Another reason could be that you have some plugins installed that prevent the value to be persisted in the localStorage? 🤔

[higaski]

Hmm, thats weird and I cannot reproduce it. What the toggle does is write a key in the localStorage. The localStorage should be global for your domain. Do you have the same problem with the demo page?

Oh I'm an idiot I'm sorry. I could have checked that before... The problem does not occur with the demo page. I've previously thought that the demo page contains only one page (index.html), but of course namespaces, files and so forth are different pages.

Are you opening the documentation locally on your computer with a file: URL?

Actually yes I am. Good catch. I'll run it through a webserver and report back.

For documents loaded from file: URLs (that is, files opened in the browser directly from the user’s local filesystem, rather than being served from a web server) the requirements for localStorage behavior are undefined and may vary among different browsers.

Funny... that reads more like a page from the C++ standard. :smile:

[higaski]

Sorry for wasting your time, you were right. This only occurs locally.

[jothepro]

Out of curiosity, on what browser/OS did you experience this? While the MDN documentation is pretty confident that it behaves like this, on my Mac I can only observe this behaviour in Firefox. Safari and Chrome seem to treat file:/// as the domain for all local files.

[higaski]

Firefox 94.0 on Arch

[jothepro]

K, so this seem to be a Firefox thing...

[nbl0]

Hello!

Firstly, thank you for your efforts—they're greatly appreciated! You rock!

I've encountered a similar issue as a fellow user while using Firefox. I'm not well-versed in the web environment, but do you have a quick and straightforward solution to suggest? I primarily rely on local documentation, and the bug is causing discomfort as I frequently switch between dark and light modes. Your assistance would be immensely valuable.

[higaski]

This isn't a bug, it's a standardization issue by the W3C. For some reason they decided that they don't care about local localstorage and browser vendors are free to do whatever when encountering a file: URL. Personally I would suggest disabling the toggle altogether.

[jothepro]

I can't add anything to the answer by @higaski. It seems like there is no fix or workaround for this problem at the moment.

[nbl0]

Ok I understand. Thank you guys!