Diff
Modified: trunk/LayoutTests/ChangeLog (227721 => 227722)
--- trunk/LayoutTests/ChangeLog 2018-01-29 05:08:13 UTC (rev 227721)
+++ trunk/LayoutTests/ChangeLog 2018-01-29 06:35:57 UTC (rev 227722)
@@ -1,3 +1,15 @@
+2018-01-28 Minsheng Liu <[email protected]>
+
+ Overflow of formulas is hidden for display mathematics
+ https://bugs.webkit.org/show_bug.cgi?id=160547
+
+ Reviewed by Frédéric Wang.
+
+ Add a test to ensure <math> with display="block" will not truncate overflowed contents.
+
+ * mathml/presentation/display-math-horizontal-overflow-expected.txt: Added.
+ * mathml/presentation/display-math-horizontal-overflow.html: Added.
+
2018-01-28 Zan Dobersek <[email protected]>
Unreviewed WPE gardening.
Added: trunk/LayoutTests/mathml/presentation/math-inline-display-width-expected.txt (0 => 227722)
--- trunk/LayoutTests/mathml/presentation/math-inline-display-width-expected.txt (rev 0)
+++ trunk/LayoutTests/mathml/presentation/math-inline-display-width-expected.txt 2018-01-29 06:35:57 UTC (rev 227722)
@@ -0,0 +1,14 @@
+Inline math of 100px content in a 200px container. The test passes if the bar is to the left of the container.
+
+Display math of 100px content in a 200px container. The test passes if the bar is in the middle of the container.
+
+Inline math of 400px content in a 200px container. The test passes if the bar can be scrolled horizontally to see the full content.
+
+Display math of 400px content in a 200px container. The test passes if the bar behaves exactly the same as the previous one.
+
+
+PASS inline math, 100px content, 200px container
+PASS display math, 100px content, 200px container
+PASS inline math, 400px content, 200px container
+PASS display math, 400px content, 200px container
+
Added: trunk/LayoutTests/mathml/presentation/math-inline-display-width.html (0 => 227722)
--- trunk/LayoutTests/mathml/presentation/math-inline-display-width.html (rev 0)
+++ trunk/LayoutTests/mathml/presentation/math-inline-display-width.html 2018-01-29 06:35:57 UTC (rev 227722)
@@ -0,0 +1,82 @@
+<!doctype html>
+<html>
+ <head>
+ <title>display math overflow</title>
+ <script src=""
+ <script src=""
+ <script>
+ setup({ "explicit_done": true });
+
+ function run() {
+ test(function() {
+ let math = document.getElementById('inline-100');
+ assert_equals(math.clientWidth, 100);
+ }, "inline math, 100px content, 200px container");
+
+ test(function() {
+ let math = document.getElementById('display-100');
+ assert_equals(math.clientWidth, 200);
+
+ let mspace = document.getElementById('space-100');
+
+ let mathBox = math.getBoundingClientRect();
+ let mspaceBox = mspace.getBoundingClientRect();
+ assert_equals(mspaceBox.left - mathBox.left, mathBox.right - mspaceBox.right);
+ }, "display math, 100px content, 200px container");
+
+ test(function() {
+ let math = document.getElementById('inline-400');
+ assert_equals(math.clientWidth, 400);
+ }, "inline math, 400px content, 200px container");
+
+ test(function() {
+ let math = document.getElementById('display-400');
+ assert_equals(math.clientWidth, 400);
+ }, "display math, 400px content, 200px container");
+ done();
+ }
+ </script>
+
+ <style>
+ #test-area div {
+ width: 200px;
+ overflow: hidden;
+ border-style: solid;
+ /* Make sure inline <math> will fill the whole <div> vertically. */
+ line-height: 0;
+ }
+ </style>
+ </head>
+ <body _onload_="run()">
+
+ <div id="test-area">
+ <p>Inline math of 100px content in a 200px container. The test passes if the bar is to the left of the container.</p>
+ <div>
+ <math id="inline-100" xmlns="http://www.w3.org/1998/Math/MathML">
+ <mspace width="100px" height="50px" style="background: linear-gradient(to right, red, green)"></mspace>
+ </math>
+ </div>
+
+ <p>Display math of 100px content in a 200px container. The test passes if the bar is in the middle of the container.</p>
+ <div>
+ <math id="display-100" display="block" xmlns="http://www.w3.org/1998/Math/MathML">
+ <mspace id="space-100" width="100px" height="50px" style="background: linear-gradient(to right, red, green)"></mspace>
+ </math>
+ </div>
+
+ <p>Inline math of 400px content in a 200px container. The test passes if the bar can be scrolled horizontally to see the full content.</p>
+ <div>
+ <math id="inline-400" xmlns="http://www.w3.org/1998/Math/MathML">
+ <mspace width="400px" height="50px" style="background: linear-gradient(to right, red, green)"></mspace>
+ </math>
+ </div>
+
+ <p>Display math of 400px content in a 200px container. The test passes if the bar behaves exactly the same as the previous one.</p>
+ <div>
+ <math id="display-400" display="block" xmlns="http://www.w3.org/1998/Math/MathML">
+ <mspace width="400px" height="50px" style="background: linear-gradient(to right, red, green)"></mspace>
+ </math>
+ </div>
+ </div>
+ </body>
+</html>
Modified: trunk/Source/WebCore/ChangeLog (227721 => 227722)
--- trunk/Source/WebCore/ChangeLog 2018-01-29 05:08:13 UTC (rev 227721)
+++ trunk/Source/WebCore/ChangeLog 2018-01-29 06:35:57 UTC (rev 227722)
@@ -1,3 +1,20 @@
+2018-01-28 Minsheng Liu <[email protected]>
+
+ Overflow of formulas is hidden for display mathematics
+ https://bugs.webkit.org/show_bug.cgi?id=160547
+
+ Reviewed by Frédéric Wang.
+
+ Previously, <math> with display="block" uses its container's logical width as logical width.
+ However, that behavior will truncate overflowed contents. The patch fixes it by setting
+ the logical width as its content width rather than its container's logical width
+ if the former is wider than the latter.
+
+ Test: mathml/presentation/display-math-horizontal-overflow.html
+
+ * rendering/mathml/RenderMathMLRow.cpp:
+ (WebCore::RenderMathMLRow::layoutBlock):
+
2018-01-26 Antoine Quint <[email protected]>
[Web Animations] Distinguish between an omitted and a null timeline argument to the Animation constructor
Modified: trunk/Source/WebCore/rendering/mathml/RenderMathMLMath.cpp (227721 => 227722)
--- trunk/Source/WebCore/rendering/mathml/RenderMathMLMath.cpp 2018-01-29 05:08:13 UTC (rev 227721)
+++ trunk/Source/WebCore/rendering/mathml/RenderMathMLMath.cpp 2018-01-29 06:35:57 UTC (rev 227722)
@@ -43,6 +43,53 @@
{
}
+void RenderMathMLMath::centerChildren(LayoutUnit contentWidth)
+{
+ LayoutUnit centerBlockOffset = (logicalWidth() - contentWidth) / 2;
+ if (!style().isLeftToRightDirection())
+ centerBlockOffset = -centerBlockOffset;
+ for (auto* child = firstChildBox(); child; child = child->nextSiblingBox()) {
+ if (!child->isOutOfFlowPositioned())
+ child->setLocation(child->location() + LayoutPoint(centerBlockOffset, 0));
+ }
}
+void RenderMathMLMath::layoutBlock(bool relayoutChildren, LayoutUnit pageLogicalHeight)
+{
+ ASSERT(needsLayout());
+
+ if (style().display() != BLOCK) {
+ RenderMathMLRow::layoutBlock(relayoutChildren, pageLogicalHeight);
+ return;
+ }
+
+ if (!relayoutChildren && simplifiedLayout())
+ return;
+
+ recomputeLogicalWidth();
+
+ setLogicalHeight(borderAndPaddingLogicalHeight() + scrollbarLogicalHeight());
+
+ LayoutUnit width, ascent, descent;
+ stretchVerticalOperatorsAndLayoutChildren();
+ getContentBoundingBox(width, ascent, descent);
+ layoutRowItems(logicalWidth(), ascent);
+
+ // Display formulas must be centered horizontally if there is extra space left.
+ // Otherwise, logical width must be updated to the content width to avoid truncation.
+ if (width < logicalWidth())
+ centerChildren(width);
+ else
+ setLogicalWidth(width);
+
+ setLogicalHeight(borderTop() + paddingTop() + ascent + descent + borderBottom() + paddingBottom() + horizontalScrollbarHeight());
+ updateLogicalHeight();
+
+ layoutPositionedObjects(relayoutChildren);
+
+ clearNeedsLayout();
+}
+
+}
+
#endif // ENABLE(MATHML)
Modified: trunk/Source/WebCore/rendering/mathml/RenderMathMLMath.h (227721 => 227722)
--- trunk/Source/WebCore/rendering/mathml/RenderMathMLMath.h 2018-01-29 05:08:13 UTC (rev 227721)
+++ trunk/Source/WebCore/rendering/mathml/RenderMathMLMath.h 2018-01-29 06:35:57 UTC (rev 227722)
@@ -41,6 +41,9 @@
private:
bool isRenderMathMLMath() const final { return true; }
const char* renderName() const final { return "RenderMathMLMath"; }
+
+ void centerChildren(LayoutUnit contentWidth);
+ void layoutBlock(bool relayoutChildren, LayoutUnit pageLogicalHeight = 0) final;
};
}
Modified: trunk/Source/WebCore/rendering/mathml/RenderMathMLRow.cpp (227721 => 227722)
--- trunk/Source/WebCore/rendering/mathml/RenderMathMLRow.cpp 2018-01-29 05:08:13 UTC (rev 227721)
+++ trunk/Source/WebCore/rendering/mathml/RenderMathMLRow.cpp 2018-01-29 06:35:57 UTC (rev 227722)
@@ -171,22 +171,8 @@
LayoutUnit width, ascent, descent;
stretchVerticalOperatorsAndLayoutChildren();
getContentBoundingBox(width, ascent, descent);
-
- if (isRenderMathMLMath() && style().display() == BLOCK) {
- // Display formulas must be centered horizontally.
- layoutRowItems(logicalWidth(), ascent);
- LayoutUnit centerBlockOffset = std::max<LayoutUnit>(0, logicalWidth() - width) / 2;
- if (!style().isLeftToRightDirection())
- centerBlockOffset = -centerBlockOffset;
- for (auto* child = firstChildBox(); child; child = child->nextSiblingBox()) {
- if (!child->isOutOfFlowPositioned())
- child->setLocation(child->location() + LayoutPoint(centerBlockOffset, 0));
- }
- } else {
- layoutRowItems(width, ascent);
- setLogicalWidth(width);
- }
-
+ layoutRowItems(width, ascent);
+ setLogicalWidth(width);
setLogicalHeight(borderTop() + paddingTop() + ascent + descent + borderBottom() + paddingBottom() + horizontalScrollbarHeight());
updateLogicalHeight();
