Add API's to support dark mode in Mojave

[MarshallOfSound]

macOS Mojave adds a whole bunch of API's and utilities around a OS level concept of "dark mode", we should add API's to Electron that allow users to determine the current OS level "dark mode" setting and to configure the dark mode setting for the individual application.

Proposed APIs

// Main Process

/**
 * This API already exists but it should continue operating as it currently does
 * on macOS < mojave and on >= mojave it should hit the the "effective appearance"
 * API linked below and respond correctly.
 **/
systemPreferences.isDarkMode()

/**
 * This API should return the current appearance setting being applied to this app as a string enum.
 * There are actually multiple different appearances that can be considered "dark mode"
 * so users can use this method to figure out EXACTLY which appearance the system is
 * using.
 *
 * By default this will return the OS level appearance settings, if users call `setAppLevelAppearance`
 * it will start returning the appearance setting that was chosen.  This behavior is controlled by macOS
 **/
systemPreferences.getEffectiveAppearance()

/**
 * Exactly the same as `getSystemAppearance()` but at the app level, each app on mojave
 * can set it's "appearance" setting independently of the system, this allows individual apps
 * to turn dark mode on / off for their app alone.
 **/
systemPreferences.getAppLevelAppearance()

/**
 * Setting but for app level appearance, this will set the `appearance` value so that mojave
 * updates its rendering and will give dark mode / light mode to the app.
 **/
systemPreferences.setAppLevelAppearance()

/**
 * Self explanatory event, should be fired when the effective appearance changes
 */
systemPreferences.on('change-effective-appearance', (newAppearance) => {})

API Docs:

• Effective Appearance - The current appearance being applied to this application.
• App Level Appearance - The current app level setting for "dark mode"
• Possible values for NSAppearance - These are the enum values we will have to use for the get and set APIs
• KVO - The reccomended strategy for monitoring changes on effectiveAppearance
• Guidelines and reccomendations for supporting dark mode

Notes:

• We will need to forward declare these API's, they are only in the 10.14 SDK
• Will need a Mojave machine to test these actually work 😆

Additional context

People like dark mode... 😄

[bpasero]

@MarshallOfSound thanks for taking care. will this also fix the issue that currently native tabs in dark mode show in light colors? See below:

From microsoft/vscode#59283

[bpasero]

Actually the bigger issue seems to be that the window title is not showing up in dark theme at all:

[MarshallOfSound]

@bpasero Yes, calling setAppLevelAppearance('dark') will make the window title and all native UI render with the dark theme. E.g. Context menu's, window titles and (untested) native tabs.

[bpasero]

@MarshallOfSound great. wouldn't it make more sense to call this automatically within electron based on the OS setting and then maybe have a way to opt out? This would reduce the likelyhood of seeing tons of Electron apps not looking nice in dark mode because the developer forgot to call this.

[MarshallOfSound]

@bpasero See #14755 (comment)

The automatic API we have implemented at the moment (startAppLevelAppearanceTrackingOS()) attempts to match what macOS application would do natively if we were targetting the 10.14 SDK. As soon as we target the 10.14 SDK that API will be removed as macOS will do the auto-switching for us by-default and it will become opt-out through a standard macOS Info.plist setting. While we have this API in place, it will be opt-in

[bpasero]

Oke

[bpasero]

This also applies to more things:

• file dialogs (or dialogs in general)
• IME input method flyovers

[bpasero]

@MarshallOfSound even though this is new API, we would probably be interested in getting some support for dark mode down to 2-0-x. Is there any plans to backport this work? For us it would be sufficient to just have some way of letting Electron automatically use the dark mode without calling any API (e.g. by having an environment variable).

[MarshallOfSound]

@bpasero It's traditionally against semver but with Mojave going out to the world as of this week and the earliest this feature coming in being 4.0 I'll see what can be done. Would a native node module that provides a super basic enableMojaveDarkMode() and disableMojaveDarkMode() set of APIs be enough for Code or is adding a native dep not a good way forward even temporarily?

[bpasero]

@MarshallOfSound yeah we can easily ship a native module with VSCode. Not sure about other applications though.