Support setting background color (fixes #795) (PR #819)

Adds a `--background-color` flag for the background of the window when the app isn't loaded.

app/src/components/mainWindow/mainWindow.js

@@ -125,6 +125,7 @@ function createMainWindow(inpOptions, onAppQuit, setDockBadge) {
         alwaysOnTop: options.alwaysOnTop,
         titleBarStyle: options.titleBarStyle,
         show: options.tray !== 'start-in-tray',
+        backgroundColor: options.backgroundColor,
       },
       DEFAULT_WINDOW_OPTIONS,
     ),

docs/api.md

@@ -65,6 +65,7 @@
     - [[always-on-top]](#always-on-top)
     - [[global-shortcuts]](#global-shortcuts)
     - [[darwin-dark-mode-support]](#darwin-dark-mode-support)
+    - [[background-color]](#background-color)
 - [Programmatic API](#programmatic-api)
   - [Addition packaging options for Windows](#addition-packaging-options-for-windows)
     - [[version-string]](#version-string)
@@ -703,6 +704,14 @@ Example `shortcuts.json` for `https://deezer.com` & `https://soundcloud.com` to
 
 Enables Dark Mode support on macOS 10.4+.
 
+#### [background-color]
+
+```
+--background-color
+```
+
+See https://electronjs.org/docs/api/browser-window#setting-backgroundcolor
+
 ## Programmatic API
 
 You can use the Nativefier programmatic API as well.

src/build/buildApp.js

@@ -58,6 +58,7 @@ function selectAppArgs(options) {
     alwaysOnTop: options.alwaysOnTop,
     titleBarStyle: options.titleBarStyle,
     globalShortcuts: options.globalShortcuts,
+    backgroundColor: options.backgroundColor,
     darwinDarkModeSupport: options.darwinDarkModeSupport,
   };
 }
@@ -134,6 +135,7 @@ function changeAppPackageJsonName(appPath, name, url) {
  */
 function buildApp(src, dest, options, callback) {
   const appArgs = selectAppArgs(options);
+
   copy(src, dest, (error) => {
     if (error) {
       callback(`Error Copying temporary directory: ${error}`);

src/cli.js

@@ -238,6 +238,10 @@ if (require.main === module) {
       '--global-shortcuts <value>',
       'JSON file with global shortcut configuration. See https://github.com/jiahaog/nativefier/blob/master/docs/api.md#global-shortcuts',
     )
+    .option(
+      '--background-color <value>',
+      "Sets the background color (for seamless experience while the app is loading). Example value: '#2e2c29'",
+    )
     .option(
       '--darwin-dark-mode-support',
       '(macOS only) enable Dark Mode support on macOS 10.14+',

src/options/optionsMain.js

@@ -77,6 +77,7 @@ export default function(inpOptions) {
     alwaysOnTop: inpOptions.alwaysOnTop || false,
     titleBarStyle: inpOptions.titleBarStyle || null,
     globalShortcuts: inpOptions.globalShortcuts || null,
+    backgroundColor: inpOptions.backgroundColor || null,
     darwinDarkModeSupport: inpOptions.darwinDarkModeSupport || false,
   };