Add system colors SelectedItem and SelectedItemText.
https://www.w3.org/TR/css-color-4/#css-system-colors specifies all
system colors supported by CSS Color Spec Level 4. This CL adds the
last two remaining colors that were not implemented yet.
Fixed: 1314218
Change-Id: Icf957ba4d829cd1a4faead5a9b15dbb4fec00f48
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3613783
Commit-Queue: Jan Keitel <jkeitel@google.com>
Reviewed-by: Stephen Chenney <schenney@chromium.org>
Cr-Commit-Position: refs/heads/main@{#998540}
diff --git a/third_party/blink/renderer/core/css/css.dict b/third_party/blink/renderer/core/css/css.dict
index 4d3da9f..30711de 100644
--- a/third_party/blink/renderer/core/css/css.dict
+++ b/third_party/blink/renderer/core/css/css.dict
@@ -208,6 +208,8 @@
"marktext"
"menutext"
"scrollbar"
+"selecteditem"
+"selecteditemtext"
"threeddarkshadow"
"threedface"
"threedhighlight"
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 1d50fbcd..c048898 100644
--- a/third_party/blink/renderer/core/css/css_value_keywords.json5
+++ b/third_party/blink/renderer/core/css/css_value_keywords.json5
@@ -217,6 +217,8 @@
"mark",
"marktext",
"menutext",
+ "selecteditem",
+ "selecteditemtext",
"scrollbar",
"threeddarkshadow",
"threedface",
diff --git a/third_party/blink/renderer/core/css/style_color.cc b/third_party/blink/renderer/core/css/style_color.cc
index f56f2a20c..5266602f 100644
--- a/third_party/blink/renderer/core/css/style_color.cc
+++ b/third_party/blink/renderer/core/css/style_color.cc
@@ -73,22 +73,23 @@
bool StyleColor::IsSystemColor(CSSValueID id) {
switch (id) {
- // SelectedItem, SelectedItemText not understood yet.
- case CSSValueID::kCanvas:
- case CSSValueID::kCanvastext:
- case CSSValueID::kLinktext:
- case CSSValueID::kVisitedtext:
case CSSValueID::kActivetext:
case CSSValueID::kButtonborder:
case CSSValueID::kButtonface:
case CSSValueID::kButtontext:
+ case CSSValueID::kCanvas:
+ case CSSValueID::kCanvastext:
case CSSValueID::kField:
case CSSValueID::kFieldtext:
+ case CSSValueID::kGraytext:
case CSSValueID::kHighlight:
case CSSValueID::kHighlighttext:
- case CSSValueID::kGraytext:
+ case CSSValueID::kLinktext:
case CSSValueID::kMark:
case CSSValueID::kMarktext:
+ case CSSValueID::kSelecteditem:
+ case CSSValueID::kSelecteditemtext:
+ case CSSValueID::kVisitedtext:
return true;
default:
return false;
diff --git a/third_party/blink/renderer/core/html/resources/html.css b/third_party/blink/renderer/core/html/resources/html.css
index ec260a6..7034f340 100644
--- a/third_party/blink/renderer/core/html/resources/html.css
+++ b/third_party/blink/renderer/core/html/resources/html.css
@@ -933,8 +933,8 @@
it breaks some WebUI menus. */
select:-internal-list-box:focus option:checked,
select:-internal-list-box:focus option:checked:hover {
- background-color: -internal-active-list-box-selection !important;
- color: -internal-active-list-box-selection-text !important;
+ background-color: SelectedItem !important;
+ color: SelectedItemText !important;
}
/* TODO(crbug.com/1244986): We should be able to remove !important here, but
diff --git a/third_party/blink/renderer/core/layout/layout_theme.cc b/third_party/blink/renderer/core/layout/layout_theme.cc
index 5c872ee..a142fe9 100644
--- a/third_party/blink/renderer/core/layout/layout_theme.cc
+++ b/third_party/blink/renderer/core/layout/layout_theme.cc
@@ -671,8 +671,10 @@
: 0xFF000000;
case CSSValueID::kVisitedtext:
return 0xFF551A8B;
+ case CSSValueID::kSelecteditem:
case CSSValueID::kInternalActiveListBoxSelection:
return ActiveListBoxSelectionBackgroundColor(color_scheme);
+ case CSSValueID::kSelecteditemtext:
case CSSValueID::kInternalActiveListBoxSelectionText:
return ActiveListBoxSelectionForegroundColor(color_scheme);
case CSSValueID::kInternalInactiveListBoxSelection:
diff --git a/third_party/blink/web_tests/external/wpt/css/css-color/parsing/system-color-valid-expected.txt b/third_party/blink/web_tests/external/wpt/css/css-color/parsing/system-color-valid-expected.txt
deleted file mode 100644
index a29fcb0..0000000
--- a/third_party/blink/web_tests/external/wpt/css/css-color/parsing/system-color-valid-expected.txt
+++ /dev/null
@@ -1,20 +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
-FAIL e.style['color'] = "SelectedItem" should set the property value assert_not_equals: property should be set got disallowed value ""
-FAIL e.style['color'] = "SelectedItemText" should set the property value assert_not_equals: property should be set got disallowed value ""
-Harness: the test ran to completion.
-
diff --git a/third_party/blink/web_tests/svg/css/css-systemcolors.svg b/third_party/blink/web_tests/svg/css/css-systemcolors.svg
index 1916268..c951922 100644
--- a/third_party/blink/web_tests/svg/css/css-systemcolors.svg
+++ b/third_party/blink/web_tests/svg/css/css-systemcolors.svg
@@ -459,6 +459,30 @@
</feDiffuseLighting>
<feComposite in="SourceGraphic" in2="light" k1="1" k2="0" k3="0" k4="0" operator="arithmetic" />
</filter>
+ <filter x="0" y="0" width="1" height="1" id="f38">
+ <feFlood flood-color="currentColor" color="SelectedItem" />
+ </filter>
+ <linearGradient id="g38">
+ <stop stop-color="currentColor" color="SelectedItem" />
+ </linearGradient>
+ <filter x="0" y="0" width="1" height="1" id="fl38">
+ <feDiffuseLighting color="SelectedItem" lighting-color="currentColor" in="SourceAlpha" result="light">
+ <feDistantLight azimuth="45" elevation="45" />
+ </feDiffuseLighting>
+ <feComposite in="SourceGraphic" in2="light" k1="1" k2="0" k3="0" k4="0" operator="arithmetic" />
+ </filter>
+ <filter x="0" y="0" width="1" height="1" id="f39">
+ <feFlood flood-color="currentColor" color="SelectedItemText" />
+ </filter>
+ <linearGradient id="g39">
+ <stop stop-color="currentColor" color="SelectedItemText" />
+ </linearGradient>
+ <filter x="0" y="0" width="1" height="1" id="fl39">
+ <feDiffuseLighting color="SelectedItemText" lighting-color="currentColor" in="SourceAlpha" result="light">
+ <feDistantLight azimuth="45" elevation="45" />
+ </feDiffuseLighting>
+ <feComposite in="SourceGraphic" in2="light" k1="1" k2="0" k3="0" k4="0" operator="arithmetic" />
+ </filter>
</defs>
<rect width="28" height="28" x="0" filter="url(#f0)" />
<rect width="28" height="28" x="0" y="28" fill="url(#g0)" />
@@ -574,4 +598,10 @@
<rect width="28" height="28" x="1036" filter="url(#f37)" />
<rect width="28" height="28" x="1036" y="28" fill="url(#g37)" />
<rect width="28" height="28" x="1036" y="56" fill="white" filter="url(#fl37)" />
+ <rect width="28" height="28" x="1064" filter="url(#f38)" />
+ <rect width="28" height="28" x="1064" y="28" fill="url(#g38)" />
+ <rect width="28" height="28" x="1064" y="56" fill="white" filter="url(#fl38)" />
+ <rect width="28" height="28" x="1092" filter="url(#f39)" />
+ <rect width="28" height="28" x="1092" y="28" fill="url(#g39)" />
+ <rect width="28" height="28" x="1092" y="56" fill="white" filter="url(#fl39)" />
</svg>
diff --git a/third_party/blink/web_tests/svg/css/rect-system-color-expected.txt b/third_party/blink/web_tests/svg/css/rect-system-color-expected.txt
index c6b4658..ec4b6d7 100644
--- a/third_party/blink/web_tests/svg/css/rect-system-color-expected.txt
+++ b/third_party/blink/web_tests/svg/css/rect-system-color-expected.txt
@@ -91,6 +91,12 @@
Testing system colorScrollbar
PASS computedStyleText.fill is computedStyleDiv.get('color').toString()
PASS computedStyleText.stroke is computedStyleDiv.get('color').toString()
+Testing system colorSelectedItem
+PASS computedStyleText.fill is computedStyleDiv.get('color').toString()
+PASS computedStyleText.stroke is computedStyleDiv.get('color').toString()
+Testing system colorSelectedItemText
+PASS computedStyleText.fill is computedStyleDiv.get('color').toString()
+PASS computedStyleText.stroke is computedStyleDiv.get('color').toString()
Testing system colorThreeDDarkShadow
PASS computedStyleText.fill is computedStyleDiv.get('color').toString()
PASS computedStyleText.stroke is computedStyleDiv.get('color').toString()
diff --git a/third_party/blink/web_tests/svg/css/rect-system-color.xhtml b/third_party/blink/web_tests/svg/css/rect-system-color.xhtml
index c8217c0f5..36e03b8 100644
--- a/third_party/blink/web_tests/svg/css/rect-system-color.xhtml
+++ b/third_party/blink/web_tests/svg/css/rect-system-color.xhtml
@@ -28,8 +28,9 @@
"ButtonFace", "ButtonHighlight", "ButtonShadow", "ButtonText", "Canvas", "CanvasText",
"CaptionText", "Field", "FieldText", "GrayText", "Highlight", "HighlightText",
"InactiveBorder", "InactiveCaption", "InactiveCaptionText", "InfoBackground",
- "InfoText", "LinkText", "Mark", "MarkText", "Menu", "MenuText", "Scrollbar", "ThreeDDarkShadow",
- "ThreeDFace", "ThreeDHighlight", "ThreeDLightShadow", "ThreeDShadow", "VisitedText",
+ "InfoText", "LinkText", "Mark", "MarkText", "Menu", "MenuText", "Scrollbar",
+ "SelectedItem", "SelectedItemText", "ThreeDDarkShadow", "ThreeDFace",
+ "ThreeDHighlight", "ThreeDLightShadow", "ThreeDShadow", "VisitedText",
"Window", "WindowFrame", "WindowText");
var svgElement = document.getElementsByTagName("svg")[0];
for (i = 0; i < systemColors.length; ++i) {
