Merge pull request #4993 from atom/background-color

Use BrowserWindow's backgroundColor as renderer view's background color

atom/browser/api/atom_api_window.cc

@@ -141,6 +141,10 @@ Window::Window(v8::Isolate* isolate, const mate::Dictionary& options) {
   if (options.Get(options::kZoomFactor, &value))
     web_preferences.Set(options::kZoomFactor, value);
 
+  // Copy the backgroundColor to webContents.
+  if (options.Get(options::kBackgroundColor, &value))
+    web_preferences.Set(options::kBackgroundColor, value);
+
   // Creates the WebContents used by BrowserWindow.
   auto web_contents = WebContents::Create(isolate, web_preferences);
   web_contents_.Reset(isolate, web_contents.ToV8());

atom/browser/native_window.cc

@@ -594,27 +594,4 @@ void NativeWindow::OnCapturePageDone(const CapturePageCallback& callback,
   callback.Run(bitmap);
 }
 
-SkColor NativeWindow::ParseHexColor(const std::string& name) {
-  auto color = name.substr(1);
-  unsigned length = color.size();
-  SkColor result = (length != 8 ? 0xFF000000 : 0x00000000);
-  unsigned value = 0;
-  if (length != 3 && length != 6 && length != 8)
-    return result;
-  for (unsigned i = 0; i < length; ++i) {
-    if (!base::IsHexDigit(color[i]))
-      return result;
-    value <<= 4;
-    value |= (color[i] < 'A' ? color[i] - '0' : (color[i] - 'A' + 10) & 0xF);
-  }
-  if (length == 6 || length == 8) {
-    result |= value;
-    return result;
-  }
-  result |= (value & 0xF00) << 12 | (value & 0xF00) << 8
-      | (value & 0xF0) << 8 | (value & 0xF0) << 4
-      | (value & 0xF) << 4 | (value & 0xF);
-  return result;
-}
-
 }  // namespace atom

atom/browser/native_window.h

@@ -282,9 +282,6 @@ class NativeWindow : public base::SupportsUserData,
   void BeforeUnloadDialogCancelled() override;
   bool OnMessageReceived(const IPC::Message& message) override;
 
-  // Parse hex color like "#FFF" or "#EFEFEF"
-  SkColor ParseHexColor(const std::string& name);
-
  private:
   // Schedule a notification unresponsive event.
   void ScheduleUnresponsiveEvent(int ms);

atom/browser/native_window_mac.mm

@@ -6,6 +6,7 @@
 
 #include <string>
 
+#include "atom/common/color_util.h"
 #include "atom/common/draggable_region.h"
 #include "atom/common/options_switches.h"
 #include "base/mac/mac_util.h"
@@ -18,6 +19,7 @@
 #include "content/public/browser/render_view_host.h"
 #include "content/public/browser/render_widget_host_view.h"
 #include "native_mate/dictionary.h"
+#include "skia/ext/skia_utils_mac.h"
 #include "ui/gfx/skia_util.h"
 
 namespace {
@@ -804,12 +806,8 @@ bool NativeWindowMac::IsKiosk() {
 }
 
 void NativeWindowMac::SetBackgroundColor(const std::string& color_name) {
-  SkColor background_color = NativeWindow::ParseHexColor(color_name);
-  NSColor *color = [NSColor colorWithCalibratedRed:SkColorGetR(background_color)
-    green:SkColorGetG(background_color)
-    blue:SkColorGetB(background_color)
-    alpha:SkColorGetA(background_color)/255.0f];
-  [window_ setBackgroundColor:color];
+  SkColor color = ParseHexColor(color_name);
+  [window_ setBackgroundColor:skia::SkColorToCalibratedNSColor(color)];
 }
 
 void NativeWindowMac::SetHasShadow(bool has_shadow) {

atom/browser/native_window_views.cc

@@ -9,6 +9,7 @@
 
 #include "atom/browser/ui/views/menu_bar.h"
 #include "atom/browser/ui/views/menu_layout.h"
+#include "atom/common/color_util.h"
 #include "atom/common/draggable_region.h"
 #include "atom/common/options_switches.h"
 #include "base/strings/utf_string_conversions.h"
@@ -614,7 +615,7 @@ bool NativeWindowViews::IsKiosk() {
 
 void NativeWindowViews::SetBackgroundColor(const std::string& color_name) {
   // web views' background color.
-  SkColor background_color = NativeWindow::ParseHexColor(color_name);
+  SkColor background_color = ParseHexColor(color_name);
   set_background(views::Background::CreateSolidBackground(background_color));
 
 #if defined(OS_WIN)

atom/browser/web_contents_preferences.cc

@@ -116,6 +116,11 @@ void WebContentsPreferences::AppendExtraCommandLineSwitches(
       LOG(ERROR) << "preload url must be file:// protocol.";
   }
 
+  // --background-color.
+  std::string color;
+  if (web_preferences.GetString(options::kBackgroundColor, &color))
+    command_line->AppendSwitchASCII(switches::kBackgroundColor, color);
+
   // The zoom factor.
   double zoom_factor = 1.0;
   if (web_preferences.GetDouble(options::kZoomFactor, &zoom_factor) &&

atom/common/color_util.cc

@@ -0,0 +1,34 @@
+// Copyright (c) 2016 GitHub, Inc.
+// Use of this source code is governed by the MIT license that can be
+// found in the LICENSE file.
+
+#include "atom/common/color_util.h"
+
+#include "base/strings/string_util.h"
+
+namespace atom {
+
+SkColor ParseHexColor(const std::string& name) {
+  auto color = name.substr(1);
+  unsigned length = color.size();
+  SkColor result = (length != 8 ? 0xFF000000 : 0x00000000);
+  unsigned value = 0;
+  if (length != 3 && length != 6 && length != 8)
+    return result;
+  for (unsigned i = 0; i < length; ++i) {
+    if (!base::IsHexDigit(color[i]))
+      return result;
+    value <<= 4;
+    value |= (color[i] < 'A' ? color[i] - '0' : (color[i] - 'A' + 10) & 0xF);
+  }
+  if (length == 6 || length == 8) {
+    result |= value;
+    return result;
+  }
+  result |= (value & 0xF00) << 12 | (value & 0xF00) << 8
+      | (value & 0xF0) << 8 | (value & 0xF0) << 4
+      | (value & 0xF) << 4 | (value & 0xF);
+  return result;
+}
+
+}  // namespace atom

atom/common/color_util.h

@@ -0,0 +1,19 @@
+// Copyright (c) 2016 GitHub, Inc.
+// Use of this source code is governed by the MIT license that can be
+// found in the LICENSE file.
+
+#ifndef ATOM_COMMON_COLOR_UTIL_H_
+#define ATOM_COMMON_COLOR_UTIL_H_
+
+#include <string>
+
+#include "third_party/skia/include/core/SkColor.h"
+
+namespace atom {
+
+// Parse hex color like "#FFF" or "#EFEFEF"
+SkColor ParseHexColor(const std::string& name);
+
+}  // namespace atom
+
+#endif  // ATOM_COMMON_COLOR_UTIL_H_

atom/common/options_switches.cc

@@ -142,12 +142,13 @@ const char kCipherSuiteBlacklist[] = "cipher-suite-blacklist";
 const char kAppUserModelId[] = "app-user-model-id";
 
 // The command line switch versions of the options.
-const char kZoomFactor[]                 = "zoom-factor";
-const char kPreloadScript[]              = "preload";
-const char kPreloadURL[]                 = "preload-url";
-const char kNodeIntegration[]            = "node-integration";
-const char kGuestInstanceID[]            = "guest-instance-id";
-const char kOpenerID[]                   = "opener-id";
+const char kBackgroundColor[] = "background-color";
+const char kZoomFactor[]      = "zoom-factor";
+const char kPreloadScript[]   = "preload";
+const char kPreloadURL[]      = "preload-url";
+const char kNodeIntegration[] = "node-integration";
+const char kGuestInstanceID[] = "guest-instance-id";
+const char kOpenerID[]        = "opener-id";
 
 // Widevine options
 // Path to Widevine CDM binaries.

atom/common/options_switches.h

@@ -76,6 +76,7 @@ extern const char kSSLVersionFallbackMin[];
 extern const char kCipherSuiteBlacklist[];
 extern const char kAppUserModelId[];
 
+extern const char kBackgroundColor[];
 extern const char kZoomFactor[];
 extern const char kPreloadScript[];
 extern const char kPreloadURL[];

atom/renderer/atom_renderer_client.cc

@@ -10,6 +10,7 @@
 #include "atom/common/api/api_messages.h"
 #include "atom/common/api/atom_bindings.h"
 #include "atom/common/api/event_emitter_caller.h"
+#include "atom/common/color_util.h"
 #include "atom/common/node_bindings.h"
 #include "atom/common/node_includes.h"
 #include "atom/common/options_switches.h"
@@ -120,8 +121,17 @@ void AtomRendererClient::RenderFrameCreated(
 }
 
 void AtomRendererClient::RenderViewCreated(content::RenderView* render_view) {
-  // Set default UA-dependent background as transparent.
-  render_view->GetWebView()->setBaseBackgroundColor(SK_ColorTRANSPARENT);
+  base::CommandLine* cmd = base::CommandLine::ForCurrentProcess();
+  if (cmd->HasSwitch(switches::kGuestInstanceID)) {  // webview.
+    // Set transparent background.
+    render_view->GetWebView()->setBaseBackgroundColor(SK_ColorTRANSPARENT);
+  } else {  // normal window.
+    // If backgroundColor is specified then use it.
+    std::string name = cmd->GetSwitchValueASCII(switches::kBackgroundColor);
+    // Otherwise use white background.
+    SkColor color = name.empty() ? SK_ColorWHITE : ParseHexColor(name);
+    render_view->GetWebView()->setBaseBackgroundColor(color);
+  }
 
   new printing::PrintWebViewHelper(render_view);
   new AtomRenderViewObserver(render_view, this);

docs/faq/electron-faq.md

@@ -144,19 +144,6 @@ is very likely you are using the module in the wrong process. For example
 `electron.app` can only be used in the main process, while `electron.webFrame`
 is only available in renderer processes.
 
-## Why is my app's background transparent?
-
-Since Electron `0.37.3`, the default user-agent background color is `transparent`.
-Simply specify a background color in HTML:
-
-```html
-<style type='text/css'>
-  html {
-    background: white;
-  }
-</style>
-```
-
 [memory-management]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Memory_Management
 [variable-scope]: https://msdn.microsoft.com/library/bzt2dkta(v=vs.94).aspx
 [electron-module]: https://www.npmjs.com/package/electron

filenames.gypi

@@ -307,6 +307,8 @@
       'atom/common/atom_command_line.h',
       'atom/common/atom_constants.cc',
       'atom/common/atom_constants.h',
+      'atom/common/color_util.cc',
+      'atom/common/color_util.h',
       'atom/common/common_message_generator.cc',
       'atom/common/common_message_generator.h',
       'atom/common/crash_reporter/crash_reporter.cc',

spec/static/index.html

@@ -3,11 +3,6 @@
   <meta name="referrer" content="always">
   <link href="../node_modules/mocha/mocha.css" rel="stylesheet">
   <script src="jquery-2.0.3.min.js"></script>
-  <style type="text/css">
-    body {
-      background-color: white;
-    }
-  </style>
 </head>
 <body>