Skip to content

Commit e03c39a

Browse files
Ahmad-S792Ahmad Saleem
Ahmad-S792
authored and
Ahmad Saleem
committed
[MathML] Position mprescripts element in mmultiscripts layout
https://bugs.webkit.org/show_bug.cgi?id=308426 rdar://170909975 Reviewed by Frédéric Wang. This patch aligns WebKit with Gecko / Firefox and Blink / Chromium. The mprescripts element was never explicitly positioned during mmultiscripts layout. It was only used as a loop boundary to separate prescripts from postscripts, leaving it at its default position. Position it aligned with the base (left edge in LTR, right edge in RTL), vertically centered with the base. Also fix RTL positioning of prescript pairs by placing the space-after-script on the inline-end side of each pair, so mirrorIfNeeded produces correct visual positions in RTL mode. * Source/WebCore/rendering/mathml/RenderMathMLScripts.cpp: (WebCore::RenderMathMLScripts::layoutBlock): * LayoutTests/imported/w3c/web-platform-tests/mathml/presentation-markup/scripts/subsup-6-expected.txt: Progression * LayoutTests/imported/w3c/web-platform-tests/mathml/presentation-markup/scripts/subsup-6-rtl-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/mathml/presentation-markup/scripts/subsup-6-rtl.html: Added. Canonical link: https://commits.webkit.org/308013@main
1 parent dfb367b commit e03c39a

File tree

4 files changed

+151
-5
lines changed

4 files changed

+151
-5
lines changed

‎LayoutTests/imported/w3c/web-platform-tests/mathml/presentation-markup/scripts/subsup-6-expected.txt‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11

2-
FAIL mprescripts coordinates and sizes (2 postscripts) assert_approx_equals: 2 postscripts, top expected 51 +/- 1 but got 16
3-
FAIL mprescripts coordinates and sizes (2 prescripts) assert_approx_equals: 2 prescripts, left expected 43 +/- 1 but got 8
4-
FAIL mprescripts coordinates and sizes (2 prescripts, 4 postscripts) assert_approx_equals: 2 prescripts, 4 postscripts, left expected 43 +/- 1 but got 8
5-
FAIL mprescripts coordinates and sizes (4 prescripts, 2 postscripts) assert_approx_equals: 4 prescripts, 2 postscripts, left expected 78 +/- 1 but got 8
6-
FAIL mprescripts coordinates and sizes (prescripts with padding/border/margin) assert_approx_equals: prescripts with padding/border/margin, left expected 43 +/- 1 but got 8
2+
PASS mprescripts coordinates and sizes (2 postscripts)
3+
PASS mprescripts coordinates and sizes (2 prescripts)
4+
PASS mprescripts coordinates and sizes (2 prescripts, 4 postscripts)
5+
PASS mprescripts coordinates and sizes (4 prescripts, 2 postscripts)
6+
PASS mprescripts coordinates and sizes (prescripts with padding/border/margin)
77

88

99

‎LayoutTests/imported/w3c/web-platform-tests/mathml/presentation-markup/scripts/subsup-6-rtl-expected.txt‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
2+
PASS mprescripts RTL coordinates and sizes (rtl 2 postscripts)
3+
PASS mprescripts RTL coordinates and sizes (rtl 2 prescripts)
4+
PASS mprescripts RTL coordinates and sizes (rtl 2 prescripts, 4 postscripts)
5+
PASS mprescripts RTL coordinates and sizes (rtl 4 prescripts, 2 postscripts)
6+
PASS mprescripts RTL coordinates and sizes (rtl prescripts with padding/border/margin)
7+
8+
9+
10+
11+

‎LayoutTests/imported/w3c/web-platform-tests/mathml/presentation-markup/scripts/subsup-6-rtl.html‎

Lines changed: 121 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,121 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>mprescripts RTL</title>
6+
<link rel="help" href="https://w3c.github.io/mathml-core/#subscripts-and-superscripts-msub-msup-msubsup">
7+
<meta name="assert" content="Position and size of mprescripts in mmultiscript element with dir=rtl.">
8+
<script src="/resources/testharness.js"></script>
9+
<script src="/resources/testharnessreport.js"></script>
10+
<script src="/mathml/support/feature-detection.js"></script>
11+
<script src="/mathml/support/fonts.js"></script>
12+
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
13+
<style>
14+
math, mspace {
15+
font: 25px/1 Ahem;
16+
}
17+
</style>
18+
<script>
19+
/* This test verifies that mprescripts is correctly positioned in RTL
20+
mmultiscripts. The right side of mprescripts should align with the
21+
right side of the base, and it should be vertically centered. */
22+
23+
setup({ explicit_done: true });
24+
window.addEventListener("load", () => { loadAllFonts().then(runTests); });
25+
26+
function runTests() {
27+
Array.from(document.getElementsByTagName("mprescripts")).
28+
forEach(prescript => {
29+
let mmultiscripts = prescript.parentNode;
30+
let name = mmultiscripts.getAttribute("data-name");
31+
test(function() {
32+
assert_true(MathMLFeatureDetection.has_mspace());
33+
var e = 1;
34+
let base_box = mmultiscripts.firstElementChild.getBoundingClientRect();
35+
let prescript_box = prescript.getBoundingClientRect();
36+
assert_approx_equals(prescript_box.right, base_box.right, e, `${name}, right`);
37+
assert_approx_equals((prescript_box.top + prescript_box.bottom) / 2, (base_box.top + base_box.bottom) / 2, e, `${name}, vertical center`);
38+
39+
if (name == "rtl prescripts with padding/border/margin") {
40+
assert_approx_equals(prescript_box.width, 2*(15 + 25), e, `${name}, width`);
41+
assert_approx_equals(prescript_box.height, 2*(10 + 20), e, `${name}, height`);
42+
} else {
43+
assert_approx_equals(prescript_box.width, 0, e, `${name}, width`);
44+
assert_approx_equals(prescript_box.height, 0, e, `${name}, height`);
45+
}
46+
}, `mprescripts RTL coordinates and sizes (${name})`);
47+
});
48+
49+
done();
50+
}
51+
</script>
52+
</head>
53+
<body>
54+
<div id="log"></div>
55+
<p>
56+
<math dir="rtl">
57+
<mmultiscripts data-name="rtl 2 postscripts">
58+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
59+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
60+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
61+
<mprescripts/>
62+
</mmultiscripts>
63+
</math>
64+
</p>
65+
<p>
66+
<math dir="rtl">
67+
<mmultiscripts data-name="rtl 2 prescripts">
68+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
69+
<mprescripts/>
70+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
71+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
72+
</mmultiscripts>
73+
</math>
74+
</p>
75+
<p>
76+
<math dir="rtl">
77+
<mmultiscripts data-name="rtl 2 prescripts, 4 postscripts">
78+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
79+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
80+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
81+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
82+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
83+
<mprescripts/>
84+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
85+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
86+
</mmultiscripts>
87+
</math>
88+
</p>
89+
<p>
90+
<math dir="rtl">
91+
<mmultiscripts data-name="rtl 4 prescripts, 2 postscripts">
92+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
93+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
94+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
95+
<mprescripts/>
96+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
97+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
98+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
99+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
100+
</mmultiscripts>
101+
</math>
102+
</p>
103+
<p>
104+
<math dir="rtl">
105+
<mmultiscripts data-name="rtl prescripts with padding/border/margin">
106+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
107+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
108+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
109+
<mprescripts style="background: blue;
110+
padding-top: 10px; border-top: 20px solid green;
111+
padding-bottom: 10px; border-bottom: 20px solid green;
112+
padding-left: 15px; border-left: 25px solid green;
113+
padding-right: 15px; border-right: 25px solid green;
114+
margin-top: 50px;"/>
115+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
116+
<mspace width="30px" height="15px" depth="15px" style="background: black"/>
117+
</mmultiscripts>
118+
</math>
119+
</p>
120+
</body>
121+
</html>

‎Source/WebCore/rendering/mathml/RenderMathMLScripts.cpp‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -467,6 +467,20 @@ void RenderMathMLScripts::layoutBlock(RelayoutChildren relayoutChildren, LayoutU
467467
LayoutPoint baseLocation(mirrorIfNeeded(horizontalOffset + reference.base->marginStart(), *reference.base), ascent - baseAscent + reference.base->marginBefore());
468468
reference.base->setLocation(baseLocation);
469469
horizontalOffset += reference.base->logicalWidth() + reference.base->marginLogicalWidth();
470+
471+
// Position the prescriptDelimiter (mprescripts element) aligned with the base, vertically centered.
472+
// In LTR, left edges align. In RTL, right edges align.
473+
if (reference.prescriptDelimiter) {
474+
LayoutUnit prescriptHeight = reference.prescriptDelimiter->logicalHeight();
475+
LayoutUnit baseBorderBoxHeight = reference.base->logicalHeight();
476+
LayoutUnit baseCenterY = baseLocation.y() + baseBorderBoxHeight / 2;
477+
LayoutUnit prescriptX = baseLocation.x();
478+
if (writingMode().isBidiRTL())
479+
prescriptX += reference.base->logicalWidth() - reference.prescriptDelimiter->logicalWidth();
480+
LayoutPoint prescriptLocation(prescriptX, baseCenterY - prescriptHeight / 2);
481+
reference.prescriptDelimiter->setLocation(prescriptLocation);
482+
}
483+
470484
subScript = reference.firstPostScript;
471485
while (subScript && subScript != reference.prescriptDelimiter) {
472486
auto supScript = subScript->nextInFlowSiblingBox();

0 commit comments

Comments
 (0)