diff --git a/third_party/blink/renderer/core/css/css.dict b/third_party/blink/renderer/core/css/css.dict index db200acf58f69a..d6b1dba4c7b3ed 100644 --- a/third_party/blink/renderer/core/css/css.dict +++ b/third_party/blink/renderer/core/css/css.dict @@ -935,6 +935,8 @@ "spelling-error" "grammar-error" "color-contrast" +"accentcolor" +"accentcolortext" # at-rules "@charset" diff --git a/third_party/blink/renderer/core/css/css_value_keywords.json5 b/third_party/blink/renderer/core/css/css_value_keywords.json5 index 8e75661f16e379..368f0adc20f9c3 100644 --- a/third_party/blink/renderer/core/css/css_value_keywords.json5 +++ b/third_party/blink/renderer/core/css/css_value_keywords.json5 @@ -204,6 +204,8 @@ "transparent", "-webkit-link", "-webkit-activelink", + "accentcolor", + "accentcolortext", "activeborder", "activecaption", "activetext", diff --git a/third_party/blink/renderer/core/css/style_color.cc b/third_party/blink/renderer/core/css/style_color.cc index 91d647665851ad..9cebdf68f0571e 100644 --- a/third_party/blink/renderer/core/css/style_color.cc +++ b/third_party/blink/renderer/core/css/style_color.cc @@ -319,6 +319,8 @@ bool StyleColor::IsSystemColorIncludingDeprecated(CSSValueID id) { bool StyleColor::IsSystemColor(CSSValueID id) { switch (id) { + case CSSValueID::kAccentcolor: + case CSSValueID::kAccentcolortext: case CSSValueID::kActivetext: case CSSValueID::kButtonborder: case CSSValueID::kButtonface: diff --git a/third_party/blink/renderer/core/layout/layout_theme.cc b/third_party/blink/renderer/core/layout/layout_theme.cc index 757324816a97c6..990cd891b18227 100644 --- a/third_party/blink/renderer/core/layout/layout_theme.cc +++ b/third_party/blink/renderer/core/layout/layout_theme.cc @@ -585,6 +585,14 @@ Color LayoutTheme::DefaultSystemColor( // https://www.w3.org/TR/css-color-4/#deprecated-system-colors. switch (css_value_id) { + case CSSValueID::kAccentcolor: + return RuntimeEnabledFeatures::CSSSystemAccentColorEnabled() + ? GetAccentColorOrDefault(color_scheme) + : Color(); + case CSSValueID::kAccentcolortext: + return RuntimeEnabledFeatures::CSSSystemAccentColorEnabled() + ? GetAccentColorText(color_scheme) + : Color(); case CSSValueID::kActivetext: return Color::FromRGBA32(0xFFFF0000); case CSSValueID::kButtonborder: @@ -844,4 +852,22 @@ void LayoutTheme::UpdateForcedColorsState() { ForcedColors::kNone; } +Color LayoutTheme::GetAccentColorOrDefault( + mojom::blink::ColorScheme color_scheme) const { + // This is from the kAccent color from NativeThemeBase::GetControlColor + const Color kDefaultAccentColor = Color(0x00, 0x75, 0xFF); + Color accent_color = GetSystemAccentColor(color_scheme); + return accent_color == Color() ? kDefaultAccentColor : accent_color; +} + +Color LayoutTheme::GetAccentColorText( + mojom::blink::ColorScheme color_scheme) const { + Color accent_color = GetAccentColorOrDefault(color_scheme); + // This logic matches AccentColorText in Firefox. If the accent color to draw + // text on is dark, then use white. If it's light, then use dark. + return color_utils::GetRelativeLuminance4f(accent_color.toSkColor4f()) <= 128 + ? Color::kWhite + : Color::kBlack; +} + } // namespace blink diff --git a/third_party/blink/renderer/core/layout/layout_theme.h b/third_party/blink/renderer/core/layout/layout_theme.h index 2cb87cea41cf6a..7437f1fa4692e2 100644 --- a/third_party/blink/renderer/core/layout/layout_theme.h +++ b/third_party/blink/renderer/core/layout/layout_theme.h @@ -185,9 +185,18 @@ class CORE_EXPORT LayoutTheme : public RefCounted { mojom::blink::ColorScheme color_scheme) const { return false; } - virtual Color GetAccentColor(mojom::blink::ColorScheme color_scheme) const { + // GetSystemAccentColor returns transparent unless there is a special value + // from the OS color scheme. + virtual Color GetSystemAccentColor( + mojom::blink::ColorScheme color_scheme) const { return Color(); } + // GetAccentColorOrDefault will return GetAccentColor if there is a value from + // the OS, otherwise it will return the default accent color. + Color GetAccentColorOrDefault(mojom::blink::ColorScheme color_scheme) const; + // GetAccentColorText returns black or white depending on which can be + // rendered with enough contrast on the result of GetAccentColorOrDefault. + Color GetAccentColorText(mojom::blink::ColorScheme color_scheme) const; bool InForcedColorsMode() const { return in_forced_colors_mode_; } diff --git a/third_party/blink/renderer/core/layout/layout_theme_mac.h b/third_party/blink/renderer/core/layout/layout_theme_mac.h index 6e71638d5d05ee..4562a78db88900 100644 --- a/third_party/blink/renderer/core/layout/layout_theme_mac.h +++ b/third_party/blink/renderer/core/layout/layout_theme_mac.h @@ -52,7 +52,7 @@ class LayoutThemeMac final : public LayoutThemeDefault { bool SupportsSelectionForegroundColors() const override { return false; } bool IsAccentColorCustomized( mojom::blink::ColorScheme color_scheme) const override; - Color GetAccentColor(mojom::blink::ColorScheme color_scheme) const override; + Color GetSystemAccentColor(mojom::blink::ColorScheme color_scheme) const override; protected: // Controls color values returned from FocusRingColor(). diff --git a/third_party/blink/renderer/core/layout/layout_theme_mac.mm b/third_party/blink/renderer/core/layout/layout_theme_mac.mm index 0f639c4ab6f5fc..5d6e69e6c84d8a 100644 --- a/third_party/blink/renderer/core/layout/layout_theme_mac.mm +++ b/third_party/blink/renderer/core/layout/layout_theme_mac.mm @@ -104,7 +104,7 @@ Color GetSystemColor(MacSystemColorID color_id, return true; } -Color LayoutThemeMac::GetAccentColor( +Color LayoutThemeMac::GetSystemAccentColor( mojom::blink::ColorScheme color_scheme) const { if (@available(macOS 10.14, *)) { return GetSystemColor(MacSystemColorID::kControlAccentColor, color_scheme); diff --git a/third_party/blink/renderer/core/paint/theme_painter_default.cc b/third_party/blink/renderer/core/paint/theme_painter_default.cc index daebf88a64860b..53cb03b97b7289 100644 --- a/third_party/blink/renderer/core/paint/theme_painter_default.cc +++ b/third_party/blink/renderer/core/paint/theme_painter_default.cc @@ -181,7 +181,7 @@ absl::optional GetAccentColor(const ComputedStyle& style) { mojom::blink::ColorScheme color_scheme = style.UsedColorScheme(); LayoutTheme& layout_theme = LayoutTheme::GetTheme(); if (layout_theme.IsAccentColorCustomized(color_scheme)) { - return layout_theme.GetAccentColor(color_scheme).Rgb(); + return layout_theme.GetSystemAccentColor(color_scheme).Rgb(); } return absl::nullopt; diff --git a/third_party/blink/renderer/platform/runtime_enabled_features.json5 b/third_party/blink/renderer/platform/runtime_enabled_features.json5 index cc89a162efc0dc..93a388168f0edf 100644 --- a/third_party/blink/renderer/platform/runtime_enabled_features.json5 +++ b/third_party/blink/renderer/platform/runtime_enabled_features.json5 @@ -913,6 +913,10 @@ name: "CSSStyleQueries", status: "stable" }, + { + name: "CSSSystemAccentColor", + status: "experimental", + }, // Support for CSS Toggles, https://tabatkins.github.io/css-toggle/ { name: "CSSToggles", diff --git a/third_party/blink/web_tests/external/wpt/css/css-color/parsing/color-valid-system-color-expected.txt b/third_party/blink/web_tests/external/wpt/css/css-color/parsing/color-valid-system-color-expected.txt deleted file mode 100644 index 0ab1033c4e9a82..00000000000000 --- a/third_party/blink/web_tests/external/wpt/css/css-color/parsing/color-valid-system-color-expected.txt +++ /dev/null @@ -1,22 +0,0 @@ -This is a testharness.js-based test. -PASS e.style['color'] = "ActiveText" should set the property value -PASS e.style['color'] = "ButtonBorder" should set the property value -PASS e.style['color'] = "ButtonFace" should set the property value -PASS e.style['color'] = "ButtonText" should set the property value -PASS e.style['color'] = "Canvas" should set the property value -PASS e.style['color'] = "CanvasText" should set the property value -PASS e.style['color'] = "Field" should set the property value -PASS e.style['color'] = "FieldText" should set the property value -PASS e.style['color'] = "GrayText" should set the property value -PASS e.style['color'] = "Highlight" should set the property value -PASS e.style['color'] = "HighlightText" should set the property value -PASS e.style['color'] = "LinkText" should set the property value -PASS e.style['color'] = "Mark" should set the property value -PASS e.style['color'] = "MarkText" should set the property value -PASS e.style['color'] = "VisitedText" should set the property value -PASS e.style['color'] = "SelectedItem" should set the property value -PASS e.style['color'] = "SelectedItemText" should set the property value -FAIL e.style['color'] = "AccentColor" should set the property value assert_not_equals: property should be set got disallowed value "" -FAIL e.style['color'] = "AccentColorText" should set the property value assert_not_equals: property should be set got disallowed value "" -Harness: the test ran to completion. -