How to enable Electron to use chrome://flags/#enable-force-dark

Question

We found the chrome flag chrome://flags/#enable-force-dark that forces all websites to use dark mode and it's quite nice actually!

We cannot get this flag to work in Electron, however. Here's what we tried:

app.commandLine.appendSwitch('enable-force-dark');
app.commandLine.appendSwitch('force-dark-mode');
app.commandLine.appendSwitch('enable-features', 'enableForceDark');
app.commandLine.appendSwitch('enable-features', 'WebUIDarkMode');

Sadly, none of them work. Any pointers would be appreciated.

Answer 1

The Electron docs specify a list of supported command line switches (some of which do come from Chromium). Unfortunately, --enable-force-dark is not on that list.

Answer 2

That's because it should be:

app.commandLine.appendSwitch('enable-features', 'WebContentsForceDark');

You can find it out by enabling it and going to chrome://version and looking at the command line.

However in this case you should use themeSource instead.

Edit: Actually I guess that isn't the same as forcing dark mode (not sure you should do that) but if you want to I think maybe you're meant to do this instead:

    new BrowserWindow({
      webPreferences: {
        enableBlinkFeatures: "WebContentsForceDark",
      },
      ...

I haven't tried it though, and it seems to be hella janky. I can't make it work through any method for CSSColorSchemeUARendering.