style: Add scrollbar-{face,track}-color properties.

Bug: 1460456
Reviewed-by: heycam
MozReview-Commit-ID: ImNfHHfzRdM

components/style/properties/gecko.mako.rs

@@ -1436,6 +1436,7 @@ impl Clone for ${style_struct.gecko_struct_name} {
     # Types used with predefined_type()-defined properties that we can auto-generate.
     predefined_types = {
         "Color": impl_color,
+        "ColorOrAuto": impl_color,
         "GreaterThanOrEqualToOneNumber": impl_simple,
         "Integer": impl_simple,
         "length::LengthOrAuto": impl_style_coord,
@@ -5303,7 +5304,7 @@ clip-path
 </%self:impl_trait>
 
 <%self:impl_trait style_struct_name="InheritedUI"
-                  skip_longhands="cursor caret-color">
+                  skip_longhands="cursor">
     pub fn set_cursor(&mut self, v: longhands::cursor::computed_value::T) {
         use style_traits::cursor::CursorKind;
 
@@ -5449,8 +5450,6 @@ clip-path
 
         longhands::cursor::computed_value::T { images, keyword }
     }
-
-    <%call expr="impl_color('caret_color', 'mCaretColor')"></%call>
 </%self:impl_trait>
 
 <%self:impl_trait style_struct_name="Column"

components/style/properties/longhand/inherited_ui.mako.rs

@@ -50,3 +50,25 @@ ${helpers.predefined_type(
     ignored_when_colors_disabled=True,
     products="gecko",
 )}
+
+// Only scrollbar-face-color and scrollbar-track-color are added here.
+// These two are the only common parts of scrollbar among Windows and
+// macOS. We may or may not want to provide other properties to allow
+// finer-grain control.
+//
+// NOTE The syntax in spec is currently `normal | <color>`, but I think
+//      reusing `auto | <color>` as `caret-color` makes more sense. See
+//      https://github.com/w3c/csswg-drafts/issues/2660
+% for part in ["face", "track"]:
+${helpers.predefined_type(
+    "scrollbar-%s-color" % part,
+    "ColorOrAuto",
+    "Either::Second(Auto)",
+    spec="https://drafts.csswg.org/css-scrollbars-1/#scrollbar-color-properties",
+    gecko_pref="layout.css.scrollbar-colors.enabled",
+    animation_value_type="ColorOrAuto",
+    ignored_when_colors_disabled=True,
+    enabled_in="chrome",
+    products="gecko",
+)}
+% endfor