Bug 1658121 - Implement padding/border layout for <mspace>. r=emilio

This patch doesn’t try to handle width/height or similar properties ([[ https://github.com/mathml-refresh/mathml/issues/45 | mathml-refresh/mathml#45 ]]) or non-horizontal writing modes ([[ https://bugzilla.mozilla.org/show_bug.cgi?id=1077525 | bug 1077525 ]]).

* [[ https://phabricator.services.mozilla.com/D86471?id=324103 | Diff 1 ]] implements padding well enough to pass WPT’s [[ http://wpt.live/mathml/relations/css-styling/padding-border-margin/padding-002.html | “Padding properties on mspace” ]]
* [[ https://phabricator.services.mozilla.com/D86471?id=324105 | Diff 2 ]] implements border well enough to pass WPT’s [[ http://wpt.live/mathml/relations/css-styling/padding-border-margin/border-002.html | “Border properties on mspace” ]]
* [[ https://phabricator.services.mozilla.com/D86471?id=324110 | Diff 3 ]] adjusts mBlockStartAscent + mBoundingMetrics in the same way as the rest of the ReflowOutput
* [[ https://phabricator.services.mozilla.com/D86471?id=327654 | Diff 4 ]] adjusts MeasureForWidth by IntrinsicISizeOffsets().{padding,border}
* Diff 5 through Diff 8 relate to margin layout, and now live in D87594
* [[ https://phabricator.services.mozilla.com/D86471?id=328587 | Diff 9 ]] + [[ https://phabricator.services.mozilla.com/D86471?id=336839 | Diff 10 ]] mark the relevant WPT cases as passing
* [[ https://phabricator.services.mozilla.com/D86471?id=338658 | Diff 11 ]] adds a workaround for [[ https://bugzilla.mozilla.org/show_bug.cgi?id=1658135 | bug 1658135 ]] to the WPT support script

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

layout/mathml/nsMathMLmspaceFrame.cpp

@@ -94,16 +94,17 @@ void nsMathMLmspaceFrame::Reflow(nsPresContext* aPresContext,
   mPresentationData.flags &= ~NS_MATHML_ERROR;
   ProcessAttributes(aPresContext);
 
+  auto borderPadding = aReflowInput.ComputedPhysicalBorderPadding();
   mBoundingMetrics = nsBoundingMetrics();
-  mBoundingMetrics.width = mWidth;
-  mBoundingMetrics.ascent = mHeight;
-  mBoundingMetrics.descent = mDepth;
+  mBoundingMetrics.width = mWidth + borderPadding.LeftRight();
+  mBoundingMetrics.ascent = mHeight + borderPadding.Side(eSideTop);
+  mBoundingMetrics.descent = mDepth + borderPadding.Side(eSideBottom);
   mBoundingMetrics.leftBearing = 0;
   mBoundingMetrics.rightBearing = mBoundingMetrics.width;
 
-  aDesiredSize.SetBlockStartAscent(mHeight);
+  aDesiredSize.SetBlockStartAscent(mBoundingMetrics.ascent);
   aDesiredSize.Width() = std::max(0, mBoundingMetrics.width);
-  aDesiredSize.Height() = aDesiredSize.BlockStartAscent() + mDepth;
+  aDesiredSize.Height() = mBoundingMetrics.ascent + mBoundingMetrics.descent;
   // Also return our bounding metrics
   aDesiredSize.mBoundingMetrics = mBoundingMetrics;
 
@@ -115,7 +116,8 @@ nsresult nsMathMLmspaceFrame::MeasureForWidth(DrawTarget* aDrawTarget,
                                               ReflowOutput& aDesiredSize) {
   ProcessAttributes(PresContext());
   mBoundingMetrics = nsBoundingMetrics();
-  mBoundingMetrics.width = mWidth;
+  auto offsets = IntrinsicISizeOffsets();
+  mBoundingMetrics.width = mWidth + offsets.padding + offsets.border;
   aDesiredSize.Width() = std::max(0, mBoundingMetrics.width);
   aDesiredSize.mBoundingMetrics = mBoundingMetrics;
   return NS_OK;

testing/web-platform/meta/mathml/relations/css-styling/padding-border-margin/border-002.html.ini

@@ -1,7 +1,4 @@
 [border-002.html]
-  [Border properties on mspace]
-    expected: FAIL
-
   [Border properties on mmultiscripts]
     expected: FAIL
 

testing/web-platform/meta/mathml/relations/css-styling/padding-border-margin/padding-002.html.ini

@@ -2,9 +2,6 @@
   [Padding properties on mphantom]
     expected: FAIL
 
-  [Padding properties on mspace]
-    expected: FAIL
-
   [Padding properties on mtext]
     expected: FAIL
 

testing/web-platform/tests/mathml/support/box-comparison.js

@@ -71,23 +71,24 @@ function compareSizeWithAndWithoutStyle(tag, style) {
     if (!FragmentHelper.isValidChildOfMrow(tag))
         throw `Invalid argument: ${tag}`;
 
+    // FIXME <mrow> only needed as workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=1658135
     document.body.insertAdjacentHTML("beforeend", `<div style="position: absolute;">\
-<div style="display: inline-block"><math>${MathMLFragments[tag]}</math></div>\
-<div style="display: inline-block"><math>${MathMLFragments[tag]}</math></div>\
+<div style="display: inline-block"><math><mrow>${MathMLFragments[tag]}</mrow></math></div>\
+<div style="display: inline-block"><math><mrow>${MathMLFragments[tag]}</mrow></math></div>\
 </div>`);
     var div = document.body.lastElementChild;
 
     var styleDiv = div.firstElementChild;
-    var styleMath = styleDiv.firstElementChild;
-    var styleElement = FragmentHelper.element(styleMath);
+    var styleParent = styleDiv.firstElementChild.firstElementChild;
+    var styleElement = FragmentHelper.element(styleParent);
     styleElement.setAttribute("style", style);
-    var styleMathBox = styleMath.getBoundingClientRect();
+    var styleParentBox = styleParent.getBoundingClientRect();
     var styleElementBox = styleElement.getBoundingClientRect();
 
     var noStyleDiv = div.lastElementChild;
-    var noStyleMath = noStyleDiv.firstElementChild;
-    var noStyleElement = FragmentHelper.element(noStyleMath);
-    var noStyleMathBox = noStyleMath.getBoundingClientRect();
+    var noStyleParent = noStyleDiv.firstElementChild.firstElementChild;
+    var noStyleElement = FragmentHelper.element(noStyleParent);
+    var noStyleParentBox = noStyleParent.getBoundingClientRect();
     var noStyleElementBox = noStyleElement.getBoundingClientRect();
 
     var preferredWidthDelta =
@@ -98,8 +99,8 @@ function compareSizeWithAndWithoutStyle(tag, style) {
 
     return {
         preferred_width_delta: preferredWidthDelta,
-        width_delta: styleMathBox.width - noStyleMathBox.width,
-        height_delta: styleMathBox.height - noStyleMathBox.height,
+        width_delta: styleParentBox.width - noStyleParentBox.width,
+        height_delta: styleParentBox.height - noStyleParentBox.height,
         element_width_delta: styleElementBox.width - noStyleElementBox.width,
         element_height_delta: styleElementBox.height - noStyleElementBox.height
     };