Skip to content

feat: add {get|set}AccentColor on Windows #47741

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 13 additions & 0 deletions docs/api/base-window.md
Original file line number Diff line number Diff line change
Expand Up @@ -1260,6 +1260,19 @@ Sets the properties for the window's taskbar button.
> `relaunchCommand` and `relaunchDisplayName` must always be set
> together. If one of those properties is not set, then neither will be used.

#### `win.setAccentColor(accentColor)` _Windows_

* `accentColor` boolean | string - The accent color for the window. By default, follows user preference in System Settings. Set to `false` to explicitly disable, or set the color in Hex, RGB, RGBA, HSL, HSLA or named CSS color format. Alpha values will be ignored.

Sets the system accent color and highlighting of active window border.

#### `win.getAccentColor()` _Windows_

Returns `string | null` - the system accent color and highlighting of active window border in RGB format.

If a color has been set for the window that differs from the system accent color, the window accent color will
be returned. Otherwise, the system accent color will be returned, if one is enabled.

#### `win.setIcon(icon)` _Windows_ _Linux_

* `icon` [NativeImage](native-image.md) | string
Expand Down
13 changes: 13 additions & 0 deletions docs/api/browser-window.md
Original file line number Diff line number Diff line change
Expand Up @@ -1440,6 +1440,19 @@ Sets the properties for the window's taskbar button.
> `relaunchCommand` and `relaunchDisplayName` must always be set
> together. If one of those properties is not set, then neither will be used.

#### `win.setAccentColor(accentColor)` _Windows_

* `accentColor` boolean | string - The accent color for the window. By default, follows user preference in System Settings. Set to `false` to explicitly disable, or set the color in Hex, RGB, RGBA, HSL, HSLA or named CSS color format. Alpha values will be ignored.

Sets the system accent color and highlighting of active window border.

#### `win.getAccentColor()` _Windows_
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It looks like with this API, it won't be possible to distinguish between a window which has its accent color pinned to the system accent color (e.g. via setAccentColor(true)) and a window that happens to have the same color as the system accent color (e.g. via setAccentColor(systemPreferences.getAccentColor())).

Do we want to have a way to explicitly check if a window's accent color follows the System Settings?


Returns `string | null` - the system accent color and highlighting of active window border in RGB format.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is documented as string | null but the implementation seems to be string | false.


If a color has been set for the window that differs from the system accent color, the window accent color will
be returned. Otherwise, the system accent color will be returned, if one is enabled.

#### `win.showDefinitionForSelection()` _macOS_

Same as `webContents.showDefinitionForSelection()`.
Expand Down
33 changes: 33 additions & 0 deletions shell/browser/api/electron_api_base_window.cc
Original file line number Diff line number Diff line change
Expand Up @@ -1089,6 +1089,37 @@ void BaseWindow::SetAppDetails(const gin_helper::Dictionary& options) {
bool BaseWindow::IsSnapped() const {
return window_->IsSnapped();
}

void BaseWindow::SetAccentColor(gin_helper::Arguments* args) {
bool accent_color = false;
std::string accent_color_string;
if (args->GetNext(&accent_color_string)) {
std::optional<SkColor> maybe_color = ParseCSSColor(accent_color_string);
if (maybe_color.has_value()) {
window_->SetAccentColor(maybe_color.value());
window_->UpdateWindowAccentColor();
}
} else if (args->GetNext(&accent_color)) {
window_->SetAccentColor(accent_color);
window_->UpdateWindowAccentColor();
} else {
args->ThrowError(
"Invalid accent color value - must be a string or boolean");
}
}

v8::Local<v8::Value> BaseWindow::GetAccentColor() const {
v8::Isolate* isolate = v8::Isolate::GetCurrent();
auto accent_color = window_->GetAccentColor();

if (std::holds_alternative<bool>(accent_color)) {
return v8::Boolean::New(isolate, std::get<bool>(accent_color));
} else if (std::holds_alternative<std::string>(accent_color)) {
return gin::StringToV8(isolate, std::get<std::string>(accent_color));
}

return v8::Null(isolate);
}
#endif

#if BUILDFLAG(IS_WIN) || BUILDFLAG(IS_LINUX)
Expand Down Expand Up @@ -1277,6 +1308,8 @@ void BaseWindow::BuildPrototype(v8::Isolate* isolate,
#if BUILDFLAG(IS_WIN)
.SetMethod("isSnapped", &BaseWindow::IsSnapped)
.SetProperty("snapped", &BaseWindow::IsSnapped)
.SetMethod("setAccentColor", &BaseWindow::SetAccentColor)
.SetMethod("getAccentColor", &BaseWindow::GetAccentColor)
.SetMethod("hookWindowMessage", &BaseWindow::HookWindowMessage)
.SetMethod("isWindowMessageHooked", &BaseWindow::IsWindowMessageHooked)
.SetMethod("unhookWindowMessage", &BaseWindow::UnhookWindowMessage)
Expand Down
2 changes: 2 additions & 0 deletions shell/browser/api/electron_api_base_window.h
Original file line number Diff line number Diff line change
Expand Up @@ -255,6 +255,8 @@ class BaseWindow : public gin_helper::TrackableObject<BaseWindow>,
bool SetThumbnailToolTip(const std::string& tooltip);
void SetAppDetails(const gin_helper::Dictionary& options);
bool IsSnapped() const;
void SetAccentColor(gin_helper::Arguments* args);
v8::Local<v8::Value> GetAccentColor() const;
#endif

#if BUILDFLAG(IS_WIN) || BUILDFLAG(IS_LINUX)
Expand Down
2 changes: 1 addition & 1 deletion shell/browser/api/electron_api_system_preferences.h
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@ class SystemPreferences final
const char* GetTypeName() override;

#if BUILDFLAG(IS_WIN) || BUILDFLAG(IS_MAC)
std::string GetAccentColor();
static std::string GetAccentColor();
std::string GetColor(gin_helper::ErrorThrower thrower,
const std::string& color);
std::string GetMediaAccessStatus(gin_helper::ErrorThrower thrower,
Expand Down
9 changes: 3 additions & 6 deletions shell/browser/api/electron_api_system_preferences_win.cc
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@
#include <iomanip>
#include <string_view>

#include <dwmapi.h>
#include <windows.devices.enumeration.h>
#include <wrl/client.h>

Expand Down Expand Up @@ -84,14 +83,12 @@ std::string hexColorDWORDToRGBA(DWORD color) {
}

std::string SystemPreferences::GetAccentColor() {
DWORD color = 0;
BOOL opaque = FALSE;
std::optional<DWORD> color = GetSystemAccentColor();

if (FAILED(DwmGetColorizationColor(&color, &opaque))) {
if (!color.has_value())
return "";
}

return hexColorDWORDToRGBA(color);
return hexColorDWORDToRGBA(color.value());
}

std::string SystemPreferences::GetColor(gin_helper::ErrorThrower thrower,
Expand Down
4 changes: 4 additions & 0 deletions shell/browser/native_window.h
Original file line number Diff line number Diff line change
Expand Up @@ -343,6 +343,10 @@ class NativeWindow : public base::SupportsUserData,

#if BUILDFLAG(IS_WIN)
void NotifyWindowMessage(UINT message, WPARAM w_param, LPARAM l_param);
virtual void SetAccentColor(
std::variant<std::monostate, bool, SkColor> accent_color) = 0;
virtual std::variant<bool, std::string> GetAccentColor() const = 0;
virtual void UpdateWindowAccentColor() = 0;
#endif

void AddObserver(NativeWindowObserver* obs) { observers_.AddObserver(obs); }
Expand Down
1 change: 1 addition & 0 deletions shell/browser/native_window_views.cc
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,7 @@
#include "base/strings/utf_string_conversions.h"
#include "content/public/browser/desktop_media_id.h"
#include "content/public/common/color_parser.h"
#include "shell/browser/api/electron_api_system_preferences.h"
#include "shell/browser/api/electron_api_web_contents.h"
#include "shell/browser/ui/inspectable_web_contents_view.h"
#include "shell/browser/ui/views/root_view.h"
Expand Down
5 changes: 4 additions & 1 deletion shell/browser/native_window_views.h
Original file line number Diff line number Diff line change
Expand Up @@ -176,6 +176,10 @@ class NativeWindowViews : public NativeWindow,
#endif

#if BUILDFLAG(IS_WIN)
void SetAccentColor(
std::variant<std::monostate, bool, SkColor> accent_color) override;
std::variant<bool, std::string> GetAccentColor() const override;
void UpdateWindowAccentColor() override;
TaskbarHost& taskbar_host() { return taskbar_host_; }
void UpdateThickFrame();
#endif
Expand Down Expand Up @@ -222,7 +226,6 @@ class NativeWindowViews : public NativeWindow,
void ResetWindowControls();
void SetRoundedCorners(bool rounded);
void SetForwardMouseMessages(bool forward);
void UpdateWindowAccentColor();
static LRESULT CALLBACK SubclassProc(HWND hwnd,
UINT msg,
WPARAM w_param,
Expand Down
52 changes: 36 additions & 16 deletions shell/browser/native_window_views_win.cc
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,9 @@
#include "shell/browser/native_window_views.h"
#include "shell/browser/ui/views/root_view.h"
#include "shell/browser/ui/views/win_frame_view.h"
#include "shell/common/color_util.h"
#include "shell/common/electron_constants.h"
#include "skia/ext/skia_utils_win.h"
#include "ui/display/display.h"
#include "ui/display/screen.h"
#include "ui/gfx/geometry/resize_utils.h"
Expand Down Expand Up @@ -46,21 +48,6 @@
LOG(WARNING) << "Failed to set border color";
}

std::optional<DWORD> GetAccentColor() {
base::win::RegKey key;
if (key.Open(HKEY_CURRENT_USER, L"SOFTWARE\\Microsoft\\Windows\\DWM",
KEY_READ) != ERROR_SUCCESS) {
return std::nullopt;
}

DWORD accent_color = 0;
if (key.ReadValueDW(L"AccentColor", &accent_color) != ERROR_SUCCESS) {
return std::nullopt;
}

return accent_color;
}

bool IsAccentColorOnTitleBarsEnabled() {
base::win::RegKey key;
if (key.Open(HKEY_CURRENT_USER, L"SOFTWARE\\Microsoft\\Windows\\DWM",
Expand Down Expand Up @@ -594,7 +581,7 @@

// Use system accent color as fallback if no explicit color was set.
if (!border_color.has_value() && should_apply_accent) {
std::optional<DWORD> system_accent_color = GetAccentColor();
std::optional<DWORD> system_accent_color = GetSystemAccentColor();
if (system_accent_color.has_value()) {
border_color = RGB(GetRValue(system_accent_color.value()),
GetGValue(system_accent_color.value()),
Expand All @@ -606,6 +593,39 @@
SetWindowBorderAndCaptionColor(GetAcceleratedWidget(), final_color);
}

void NativeWindowViews::SetAccentColor(
std::variant<std::monostate, bool, SkColor> accent_color) {
accent_color_ = accent_color;
}

/*
* Returns the window's accent color, per the following heuristic:
*
* - If |accent_color_| is an SkColor, return that color as a hex string.
* - If |accent_color_| is true, return the system accent color as a hex string.
* - If |accent_color_| is false, return false.
* - Otherwise, return the system accent color as a hex string.

Check failure on line 607 in shell/browser/native_window_views_win.cc

View check run for this annotation

trop / Backportable? - 36-x-y

shell/browser/native_window_views_win.cc#L600-L607

Patch Conflict
Raw output
++<<<<<<< HEAD
 +    if (IsAccentColorOnTitleBarsEnabled()) {
 +      std::optional<DWORD> accent_color = GetAccentColor();
 +      if (accent_color.has_value()) {
 +        border_color = RGB(GetRValue(accent_color.value()),
 +                           GetGValue(accent_color.value()),
 +                           GetBValue(accent_color.value()));
 +        should_apply_accent = true;
 +      }
++=======
+     // If no explicit color was set, default to the system accent color.
+     should_apply_accent = IsAccentColorOnTitleBarsEnabled();
+   }
+ 
+   // Use system accent color as fallback if no explicit color was set.
+   if (!border_color.has_value() && should_apply_accent) {
+     std::optional<DWORD> system_accent_color = GetSystemAccentColor();
+     if (system_accent_color.has_value()) {
+       border_color = RGB(GetRValue(system_accent_color.value()),
+                          GetGValue(system_accent_color.value()),
+                          GetBValue(system_accent_color.value()));
++>>>>>>> feat: add setAccentColor on Windows
*/
std::variant<bool, std::string> NativeWindowViews::GetAccentColor() const {

Check failure on line 609 in shell/browser/native_window_views_win.cc

View check run for this annotation

trop / Backportable? - 37-x-y

shell/browser/native_window_views_win.cc#L602-L609

Patch Conflict
Raw output
++<<<<<<< HEAD
 +    if (IsAccentColorOnTitleBarsEnabled()) {
 +      std::optional<DWORD> accent_color = GetAccentColor();
 +      if (accent_color.has_value()) {
 +        border_color = RGB(GetRValue(accent_color.value()),
 +                           GetGValue(accent_color.value()),
 +                           GetBValue(accent_color.value()));
 +        should_apply_accent = true;
 +      }
++=======
+     // If no explicit color was set, default to the system accent color.
+     should_apply_accent = IsAccentColorOnTitleBarsEnabled();
+   }
+ 
+   // Use system accent color as fallback if no explicit color was set.
+   if (!border_color.has_value() && should_apply_accent) {
+     std::optional<DWORD> system_accent_color = GetSystemAccentColor();
+     if (system_accent_color.has_value()) {
+       border_color = RGB(GetRValue(system_accent_color.value()),
+                          GetGValue(system_accent_color.value()),
+                          GetBValue(system_accent_color.value()));
++>>>>>>> feat: add setAccentColor on Windows
std::optional<DWORD> system_color = GetSystemAccentColor();

if (std::holds_alternative<SkColor>(accent_color_)) {
return ToRGBHex(std::get<SkColor>(accent_color_));
} else if (std::holds_alternative<bool>(accent_color_)) {
if (std::get<bool>(accent_color_)) {
if (!system_color.has_value())
return false;
return ToRGBHex(skia::COLORREFToSkColor(system_color.value()));
} else {
return false;
}
} else {
if (!system_color.has_value())
return false;
return ToRGBHex(skia::COLORREFToSkColor(system_color.value()));
}
}

void NativeWindowViews::ResetWindowControls() {
// If a given window was minimized and has since been
// unminimized (restored/maximized), ensure the WCO buttons
Expand Down
15 changes: 15 additions & 0 deletions shell/common/color_util.cc
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,10 @@
#include "content/public/common/color_parser.h"
#include "third_party/abseil-cpp/absl/strings/str_format.h"

#if BUILDFLAG(IS_WIN)
#include <dwmapi.h>
#endif

namespace {

bool IsHexFormatWithAlpha(const std::string& str) {
Expand Down Expand Up @@ -62,4 +66,15 @@ std::string ToRGBAHex(SkColor color, bool include_hash) {
return color_str;
}

#if BUILDFLAG(IS_WIN)
std::optional<DWORD> GetSystemAccentColor() {
DWORD color = 0;
BOOL opaque = FALSE;

if (FAILED(DwmGetColorizationColor(&color, &opaque)))
return std::nullopt;
return color;
}
#endif

} // namespace electron
10 changes: 10 additions & 0 deletions shell/common/color_util.h
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,12 @@
#include <optional>
#include <string>

#include "build/build_config.h"

#if BUILDFLAG(IS_WIN)
#include <windows.h>
#endif

#include "third_party/skia/include/core/SkColor.h"

// SkColor is a typedef for uint32_t, this wrapper is to tag an SkColor for
Expand All @@ -31,6 +37,10 @@ std::string ToRGBHex(SkColor color);
// Convert color to RGBA hex value like "#RRGGBBAA".
std::string ToRGBAHex(SkColor color, bool include_hash = true);

#if BUILDFLAG(IS_WIN)
std::optional<DWORD> GetSystemAccentColor();
#endif

} // namespace electron

#endif // ELECTRON_SHELL_COMMON_COLOR_UTIL_H_
86 changes: 86 additions & 0 deletions spec/api-browser-window-spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2555,6 +2555,92 @@ describe('BrowserWindow module', () => {
});
});

ifdescribe(process.platform === 'win32')('BrowserWindow.{get|set}AccentColor', () => {
afterEach(closeAllWindows);

it('throws if called with an invalid parameter', () => {
const w = new BrowserWindow({ show: false });
expect(() => {
// @ts-ignore this is wrong on purpose.
w.setAccentColor([1, 2, 3]);
}).to.throw('Invalid accent color value - must be a string or boolean');
});

it('returns the accent color after setting it to a string', () => {
const w = new BrowserWindow({ show: false });
const testColor = '#FF0000';
w.setAccentColor(testColor);
const accentColor = w.getAccentColor();
expect(accentColor).to.be.a('string');
expect(accentColor).to.equal(testColor);
});

it('returns the accent color after setting it to false', () => {
const w = new BrowserWindow({ show: false });
w.setAccentColor(false);
const accentColor = w.getAccentColor();
expect(accentColor).to.be.a('boolean');
expect(accentColor).to.equal(false);
});

it('returns a system color when set to true', () => {
const w = new BrowserWindow({ show: false });
w.setAccentColor(true);
const accentColor = w.getAccentColor();
expect(accentColor).to.be.a('string');
expect(accentColor).to.match(/^#[0-9A-F]{6}$/i);
});

it('returns the correct accent color after multiple changes', () => {
const w = new BrowserWindow({ show: false });

const testColor1 = '#00FF00';
w.setAccentColor(testColor1);
expect(w.getAccentColor()).to.equal(testColor1);

w.setAccentColor(false);
expect(w.getAccentColor()).to.equal(false);

const testColor2 = '#0000FF';
w.setAccentColor(testColor2);
expect(w.getAccentColor()).to.equal(testColor2);

w.setAccentColor(true);
const systemColor = w.getAccentColor();
expect(systemColor).to.be.a('string');
expect(systemColor).to.match(/^#[0-9A-F]{6}$/i);
});

it('handles CSS color names correctly', () => {
const w = new BrowserWindow({ show: false });
const testColor = 'red';
w.setAccentColor(testColor);
const accentColor = w.getAccentColor();
expect(accentColor).to.be.a('string');
expect(accentColor).to.equal('#FF0000');
});

it('handles RGB color values correctly', () => {
const w = new BrowserWindow({ show: false });
const testColor = 'rgb(255, 128, 0)';
w.setAccentColor(testColor);
const accentColor = w.getAccentColor();
expect(accentColor).to.be.a('string');
expect(accentColor).to.equal('#FF8000');
});

it('persists accent color across window operations', () => {
const w = new BrowserWindow({ show: false });
const testColor = '#ABCDEF';
w.setAccentColor(testColor);

w.show();
w.hide();

expect(w.getAccentColor()).to.equal(testColor);
});
});

describe('BrowserWindow.setAlwaysOnTop(flag, level)', () => {
let w: BrowserWindow;

Expand Down
Loading