Skip to content

Commit

Permalink
[mathml] Add more tests for layout algorithms with specified width/he…
Browse files Browse the repository at this point in the history 
…ight

This is a followup of [1] with more tests for MathML elements that
have a specified width/height:

- frac-bar-003.html: Verify that the painted bar takes the specified
  width, not the one of the children.

- width-height-001.html: Don't skip mtable (in the past the test was
  checking the properties are ignored, but this changed in [1]).

- width-height-002.html, width-height-003.html: Add tests to verify
  the position where the math content is rendered when a larger
  width/height is specified.

- TestExpectations: Remove obsolete Failure expectations.

[1] https://chromium-review.googlesource.com/c/chromium/src/+/4221437
[2] w3c/mathml-core#75

Bug: 6606
Change-Id: I5ea7c33eed9fde8b53ccd0400e6fcfa5eab055a0
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4233950
Commit-Queue: Frédéric Wang <fwang@igalia.com>
Reviewed-by: Ian Kilpatrick <ikilpatrick@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1103928}
  • Loading branch information
@fred-wang
fred-wang authored and Chromium LUCI CQ committed Feb 10, 2023
1 parent 9cd7888 commit dc64ec8
Show file tree
Hide file tree
Showing 8 changed files with 656 additions and 4 deletions.
4 changes: 1 addition & 3 deletions third_party/blink/web_tests/TestExpectations
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1539,9 +1539,7 @@ crbug.com/958381 [ Debug Mac12 ] fragmentation/single-line-cells-paginated-with-

# ====== MathMLCore-only tests from here ======

# These tests fail because some CSS properties affect MathML layout.
crbug.com/1227601 external/wpt/mathml/relations/css-styling/ignored-properties-001.html [ Failure Timeout ]
crbug.com/1227598 external/wpt/mathml/relations/css-styling/width-height-001.html [ Failure ]
crbug.com/1227601 external/wpt/mathml/relations/css-styling/ignored-properties-001.html [ Timeout ]

# These tests fail because we don't parse math display values according to the spec.
crbug.com/1127222 external/wpt/mathml/presentation-markup/mrow/legacy-mrow-like-elements-001.html [ Failure ]
Expand Down
21 changes: 21 additions & 0 deletions ...y/blink/web_tests/external/wpt/mathml/presentation-markup/fractions/frac-bar-003-ref.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>fractions bar (reference)</title>
<style type="text/css">
#container {
position: absolute;
left: 10px;
top: 50px;
width: 150px;
height: 150px;
background: green;
}
</style>
</head>
<body>
<p>This test passes if you see a green square.</p>
<div id="container"></div>
</body>
</html>
46 changes: 46 additions & 0 deletions ...party/blink/web_tests/external/wpt/mathml/presentation-markup/fractions/frac-bar-003.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>fractions bar</title>
<link rel="help" href="https://w3c.github.io/mathml-core/#fractions-mfrac">
<meta name="assert" content="Verifies that the fraction bar takes the full width of the mfrac element">
<link rel="match" href="frac-bar-003-ref.html">
<style type="text/css">
@font-face {
font-family: TestFont;
src: url("/fonts/math/fraction-rulethickness10000.woff");
}
math {
/* FractionRuleThickness = 10000 * 1 / 1000 = 10px; */
/* The gap / shift / axisheight parameters are set to 0. */
font-family: "TestFont";
font-size: 1px;
}
#container {
position: absolute;
left: 10px;
top: 50px;
width: 150px;
height: 150px;
}

/* Revert style specified in the UA style sheet that changes box size. */
mfrac { padding: 0; }
</style>
<script src="/mathml/support/fonts.js"></script>
</head>
<body>
<p>This test passes if you see a green square.</p>
<div id="container">
<math>
<mfrac style="width: 150px; color: green; font-size: 15em">
<mspace></mspace>
<mspace></mspace>
</mfrac>
</math>
</div>
<script src="/mathml/support/feature-detection.js"></script>
<script>MathMLFeatureDetection.ensure_for_match_reftest("has_mfrac");</script>
</body>
</html>
2 changes: 1 addition & 1 deletion third_party/blink/web_tests/external/wpt/mathml/relations/css-styling/width-height-001.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@
function runTests() {

for (tag in MathMLFragments) {
if (!FragmentHelper.isValidChildOfMrow(tag) || tag === "mtable")
if (!FragmentHelper.isValidChildOfMrow(tag))
continue;

document.body.insertAdjacentHTML("beforeend", `<div style="position: absolute;"><math><mrow>${MathMLFragments[tag]}</mrow></math></div>`);
Expand Down
141 changes: 141 additions & 0 deletions ...party/blink/web_tests/external/wpt/mathml/relations/css-styling/width-height-002-ref.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,141 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>content position with width/height (reference)</title>
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
<style>
body, math {
font: 25px/1 Ahem;
color: black;
}
.test {
margin: .5em;
}
.box {
width: 7em;
height: 3em;
border: 1px solid blue;
display: inline-block;
}
.center {
text-align: center;
}

/* Revert style specified in the UA style sheet that changes box size. */
mfrac { padding: 0; }
</style>
</head>
<body>
<div class="test">
<div class="box">
<math>
<mtext>X</mtext>
</math>
</div>
<div class="box" dir="rtl">
<math dir="rtl">
<mtext>X</mtext>
</math>
</div>
</div>

<div class="test">
<div class="box">
<math>
<mrow>
<mtext>X</mtext>
<mtext>X</mtext>
<mtext>X</mtext>
</mrow>
</math>
</div>
<div class="box" dir="rtl">
<math dir="rtl">
<mrow>
<mtext>X</mtext>
<mtext>X</mtext>
<mtext>X</mtext>
</mrow>
</math>
</div>
</div>

<div class="test">
<div class="box">
<math>
<mpadded lspace="1em" voffset="-1em">
<mtext>X</mtext>
<mtext>X</mtext>
<mtext>X</mtext>
</mpadded>
</math>
</diV>
<div class="box" dir="rtl">
<math dir="rtl">
<mpadded lspace="1em" voffset="-1em">
<mtext>X</mtext>
<mtext>X</mtext>
<mtext>X</mtext>
</mpadded>
</math>
</div>
</div>

<div class="test">
<div class="box center">
<math>
<mfrac linethickness="0">
<mtext>X</mtext>
<mtext>X</mtext>
</mfrac>
</math>
</div>
<div class="box center" dir="rtl">
<math dir="rtl">
<mfrac linethickness="0">
<mtext>X</mtext>
<mtext>X</mtext>
</mfrac>
</math>
</div>
</div>

<div class="test">
<div class="box">
<math>
<msqrt>
<mtext>X</mtext>
</msqrt>
</math>
</div>
<div class="box" dir="rtl">
<math dir="rtl">
<msqrt>
<mtext>X</mtext>
</msqrt>
</math>
</div>
</div>

<div class="test">
<div class="box">
<math>
<mroot>
<mtext>X</mtext>
<mtext>X</mtext>
</mroot>
</math>
</div>
<div class="box" dir="rtl">
<math dir="rtl">
<mroot>
<mtext>X</mtext>
<mtext>X</mtext>
</mroot>
</math>
</div>
</div>

</body>
</htmL>
118 changes: 118 additions & 0 deletions third_party/blink/web_tests/external/wpt/mathml/relations/css-styling/width-height-002.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,118 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>content position with width/height</title>
<link rel="match" href="width-height-002-ref.html">
<link rel="help" href="https://w3c.github.io/mathml-core/#layout-algorithms">
<link rel="help" href="https://w3c.github.io/mathml-core/#fractions-mfrac">
<meta name="assert" content="Verify the inline-start and block-start edges of the math content box for the mtext, mrow, mpadded, mfrac, msqrt, mroot layout algorithms."/>
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
<style>
body, math {
font: 25px/1 Ahem;
color: black;
}
.test {
margin: .5em;
}
.box {
width: 7em;
height: 3em;
border: 1px solid blue;
}

/* Revert style specified in the UA style sheet that changes box size. */
mfrac { padding: 0; }
</style>
</head>
<body>

<div class="test">
<math>
<mtext class="box">X</mtext>
</math>
<math dir="rtl">
<mtext class="box">X</mtext>
</math>
</div>

<div class="test">
<math>
<mrow class="box">
<mtext>X</mtext>
<mtext>X</mtext>
<mtext>X</mtext>
</mrow>
</math>
<math dir="rtl">
<mrow class="box">
<mtext>X</mtext>
<mtext>X</mtext>
<mtext>X</mtext>
</mrow>
</math>
</div>

<div class="test">
<math>
<mpadded lspace="1em" voffset="-1em" class="box">
<mtext>X</mtext>
<mtext>X</mtext>
<mtext>X</mtext>
</mpadded>
</math>
<math dir="rtl">
<mpadded lspace="1em" voffset="-1em" class="box">
<mtext>X</mtext>
<mtext>X</mtext>
<mtext>X</mtext>
</mpadded>
</math>
</div>

<div class="test">
<math>
<mfrac class="box" linethickness="0">
<mtext>X</mtext>
<mtext>X</mtext>
</mfrac>
</math>
<math dir="rtl">
<mfrac class="box" linethickness="0">
<mtext>X</mtext>
<mtext>X</mtext>
</mfrac>
</math>
</div>

<div class="test">
<math>
<msqrt class="box">
<mtext>X</mtext>
</msqrt>
</math>
<math dir="rtl">
<msqrt class="box">
<mtext>X</mtext>
</msqrt>
</math>
</div>

<div class="test">
<math>
<mroot class="box">
<mtext>X</mtext>
<mtext>X</mtext>
</mroot>
</math>
<math dir="rtl">
<mroot class="box">
<mtext>X</mtext>
<mtext>X</mtext>
</mroot>
</math>
</div>

</body>
</htmL>

0 comments on commit dc64ec8

Please sign in to comment.