Bug 1918856 - Do serialization of computed border-spacing in stylo r=emilio

Differential Revision: https://phabricator.services.mozilla.com/D222204

layout/style/ServoCSSPropList.mako.py

@@ -55,9 +55,6 @@ def method(prop):
 
 # TODO(emilio): Get this to zero.
 LONGHANDS_NOT_SERIALIZED_WITH_SERVO = [
-    # Servo serializes one value when both are the same, a few tests expect two.
-    "border-spacing",
-
     # These resolve auto to zero in a few cases, but not all.
     "max-height",
     "max-width",

layout/style/nsComputedDOMStyle.cpp

@@ -1748,18 +1748,6 @@ already_AddRefed<CSSValue> nsComputedDOMStyle::DoGetPaddingRight() {
   return GetPaddingWidthFor(eSideRight);
 }
 
-already_AddRefed<CSSValue> nsComputedDOMStyle::DoGetBorderSpacing() {
-  RefPtr<nsDOMCSSValueList> valueList = GetROCSSValueList(false);
-
-  const nsStyleTableBorder* border = StyleTableBorder();
-  valueList->AppendCSSValue(
-      PixelsToCSSValue(border->mBorderSpacing.width.ToCSSPixels()));
-  valueList->AppendCSSValue(
-      PixelsToCSSValue(border->mBorderSpacing.height.ToCSSPixels()));
-
-  return valueList.forget();
-}
-
 already_AddRefed<CSSValue> nsComputedDOMStyle::DoGetBorderTopWidth() {
   return GetBorderWidthFor(eSideTop);
 }

layout/style/nsComputedDOMStyle.h

@@ -254,9 +254,6 @@ class nsComputedDOMStyle final : public nsDOMCSSDeclaration,
   already_AddRefed<CSSValue> DoGetPaddingLeft();
   already_AddRefed<CSSValue> DoGetPaddingRight();
 
-  /* Table Properties */
-  already_AddRefed<CSSValue> DoGetBorderSpacing();
-
   /* Border Properties */
   already_AddRefed<CSSValue> DoGetBorderTopWidth();
   already_AddRefed<CSSValue> DoGetBorderBottomWidth();

testing/web-platform/tests/css/css-tables/inheritance.html

@@ -16,7 +16,7 @@
 </div>
 <script>
 assert_inherited('border-collapse', 'separate', 'collapse');
-assert_inherited('border-spacing', '0px 0px', '10px 20px');
+assert_inherited('border-spacing', '0px', '10px 20px');
 assert_inherited('caption-side', 'top', 'bottom');
 assert_inherited('empty-cells', 'show', 'hide');
 assert_not_inherited('table-layout', 'auto', 'fixed');

testing/web-platform/tests/css/css-tables/parsing/border-spacing-computed.html

@@ -18,7 +18,13 @@
 </style>
 <script>
 test_computed_value("border-spacing", "10px 20px");
-test_computed_value("border-spacing", "0", "0px 0px");
+
+// This should be "0px" and not "0px 0px" due to the shortest serialization principle:
+// https://drafts.csswg.org/cssom/#serializing-css-values
+// > If component values can be omitted or replaced with a shorter
+// > representation without changing the meaning of the value, omit/replace them.
+test_computed_value("border-spacing", "0", "0px");
+
 test_computed_value("border-spacing", "calc(10px + 0.5em) calc(10px - 0.5em)", "30px 0px");
 test_computed_value("border-spacing", "calc(10px - 0.5em) calc(10px + 0.5em)", "0px 30px");
 </script>

testing/web-platform/tests/css/css-variables/variable-substitution-basic.html

@@ -29,13 +29,13 @@
             {
                 testName:"Simple substitution test",
                 propertyName:"border-spacing",
-                expectedValue:"20px 20px",
+                expectedValue:"20px",
                 style:"--gap: 20px;border-spacing: var(--gap);"
             },
             {
                 testName:"You can't build up a single token where part of it is provided by a variable",
                 propertyName:"border-spacing",
-                expectedValue:"0px 0px",
+                expectedValue:"0px",
                 style:"--gap: 20;border-spacing: var(--gap)px;"
             },
             {
@@ -59,13 +59,13 @@
             {
                 testName:"Fallback value",
                 propertyName:"border-spacing",
-                expectedValue:"11px 11px",
+                expectedValue:"11px",
                 style:"border-spacing:var(--gap,11px);"
             },
             {
                 testName:"Fallback value which is also a variable reference",
                 propertyName:"border-spacing",
-                expectedValue:"27px 27px",
+                expectedValue:"27px",
                 style:"--gap2: 27px; border-spacing:var(--gap,var(--gap2));"
             },
             {

testing/web-platform/tests/html/rendering/non-replaced-elements/tables/table-attribute.html

@@ -106,7 +106,7 @@ function commonHeightTest(id, attr, value, cssProp, expected, type="", divClass)
 // table#bordercolor
 commonTest("table", "bordercolor", "red", "border-color", "rgb(255, 0, 0)");
 // table#cellspacing
-commonTest("table", "cellspacing", "10", "border-spacing", "10px 10px", "10");
+commonTest("table", "cellspacing", "10", "border-spacing", "10px", "10");
 
 // {table, thead, body, tfoot, tr, td, th}#background
 // {table, thead, body, tfoot, tr, td, th}#bgcolor

testing/web-platform/tests/web-animations/animation-model/animation-types/property-list.js

@@ -278,7 +278,7 @@ const gCSSProperties1 = {
   },
   'border-spacing': {
     // https://drafts.csswg.org/css-tables/#propdef-border-spacing
-    types: [ 'lengthPair' ]
+    types: [ 'length' ]
   },
   'border-top-color': {
     // https://drafts.csswg.org/css-backgrounds-3/#border-top-color