-
Notifications
You must be signed in to change notification settings - Fork 2k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Bug 1581788 [wpt PR 19118] - Add tests to check that legacy maction/s…
…emantics elements are treated…, a=testonly Automatic update from web-platform-tests Add tests to check that legacy maction/semantics elements are treated as mrow-like (#19118) w3c/mathml#26 w3c/mathml#100 This also checks a bit annotation/annotation-xml and display: math. -- wpt-commits: 8b04cca826ffcbfe3f0f101f9824b8fb0003e21d wpt-pr: 19118
- Loading branch information
1 parent
08902c2
commit 153320d
Showing
3 changed files
with
291 additions
and
0 deletions.
There are no files selected for viewing
188 changes: 188 additions & 0 deletions
188
...ing/web-platform/tests/mathml/presentation-markup/mrow/legacy-mrow-like-elements-001.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,188 @@ | ||
<!DOCTYPE html> | ||
<html> | ||
<head> | ||
<meta charset="utf-8"> | ||
<title>Legacy maction and semantics elements</title> | ||
<link rel="help" href="https://www.w3.org/TR/MathML3/chapter3.html#presm.maction"> | ||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#enlivening-expressions"> | ||
<link rel="help" href="https://www.w3.org/TR/MathML3/chapter3.html#presm.semantics"> | ||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#semantics-and-presentation"> | ||
<meta name="assert" content="Legacy maction and semantics elements are handled as mrow with special style"> | ||
<script src="/resources/testharness.js"></script> | ||
<script src="/resources/testharnessreport.js"></script> | ||
<script src="/mathml/support/feature-detection.js"></script> | ||
<script src="/mathml/support/layout-comparison.js"></script> | ||
<script type="text/javascript"> | ||
setup({ explicit_done: true }); | ||
window.addEventListener("load", runTests); | ||
function runTests() | ||
{ | ||
Array.from(document.getElementsByClassName("TestContainer")).forEach(container => { | ||
const id = container.id; | ||
const math = container.getElementsByTagName("math"); | ||
test(function() { | ||
assert_true(MathMLFeatureDetection.has_mspace(), "<mspace> is supported"); | ||
const epsilon = 1; | ||
compareLayout(math[0], math[1], epsilon); | ||
}, `Element is laid out as an mrow with only first child displayed (id=${id})`); | ||
|
||
test(function() { | ||
assert_true(MathMLFeatureDetection.has_mspace(), "<mspace> is supported"); | ||
let firstChild = math[0].firstElementChild.firstElementChild; | ||
for (var child = firstChild; child; child = child.nextElementSibling) { | ||
var style = window.getComputedStyle(child).getPropertyValue("display"); | ||
if (child == firstChild) { | ||
assert_equals(style, "math", "First child has display: math"); | ||
} else { | ||
assert_equals(style, "none", "Other children have display: none"); | ||
} | ||
} | ||
}, `Computed display of children (id=${id})`); | ||
}); | ||
done(); | ||
} | ||
</script> | ||
<style> | ||
mspace:nth-child(2n) { | ||
background: lightblue; | ||
} | ||
mspace:nth-child(2n+1) { | ||
background: lightgreen; | ||
} | ||
mrow.onlyShowFirstChild > :not(:first-child) { | ||
display: none; | ||
} | ||
</style> | ||
</head> | ||
<body> | ||
<div id="log"></div> | ||
<p class="TestContainer" id="semantics"> | ||
<math> | ||
<semantics> | ||
<mspace width="10px" height="10px"></mspace> | ||
<mspace width="10px" depth="10px"></mspace> | ||
<mspace width="10px" height="15px" depth="5px"></mspace> | ||
<mspace width="10px" height="5px" depth="15px"></mspace> | ||
</semantics> | ||
</math> | ||
<math> | ||
<mrow class="onlyShowFirstChild"> | ||
<mspace width="10px" height="10px"></mspace> | ||
<mspace width="10px" depth="10px"></mspace> | ||
<mspace width="10px" height="15px" depth="5px"></mspace> | ||
<mspace width="10px" height="5px" depth="15px"></mspace> | ||
</mrow> | ||
</math> | ||
</p> | ||
<p class="TestContainer" id="semantics-annotations"> | ||
<math> | ||
<semantics> | ||
<mspace width="10px" height="10px"></mspace> | ||
<annotation>ANNOTATION</annotation> | ||
<annotation-xml>ANNOTATION-XML</annotation-xml> | ||
</semantics> | ||
</math> | ||
<math> | ||
<mrow class="onlyShowFirstChild"> | ||
<mspace width="10px" height="10px"></mspace> | ||
<annotation>ANNOTATION</annotation> | ||
<annotation-xml>ANNOTATION-XML</annotation-xml> | ||
</mrow> | ||
</math> | ||
</p> | ||
<p class="TestContainer" id="maction"> | ||
<math> | ||
<maction> | ||
<mspace width="10px" height="10px"></mspace> | ||
<mspace width="10px" depth="10px"></mspace> | ||
<mspace width="10px" height="15px" depth="5px"></mspace> | ||
<mspace width="10px" height="5px" depth="15px"></mspace> | ||
</maction> | ||
</math> | ||
<math> | ||
<mrow class="onlyShowFirstChild"> | ||
<mspace width="10px" height="10px"></mspace> | ||
<mspace width="10px" depth="10px"></mspace> | ||
<mspace width="10px" height="15px" depth="5px"></mspace> | ||
<mspace width="10px" height="5px" depth="15px"></mspace> | ||
</mrow> | ||
</math> | ||
</p> | ||
<p class="TestContainer" id="maction-toggle"> | ||
<math> | ||
<maction actiontype="toggle"> | ||
<mspace width="10px" height="10px"></mspace> | ||
<mspace width="10px" depth="10px"></mspace> | ||
<mspace width="10px" height="15px" depth="5px"></mspace> | ||
<mspace width="10px" height="5px" depth="15px"></mspace> | ||
</maction> | ||
</math> | ||
<math> | ||
<mrow class="onlyShowFirstChild"> | ||
<mspace width="10px" height="10px"></mspace> | ||
<mspace width="10px" depth="10px"></mspace> | ||
<mspace width="10px" height="15px" depth="5px"></mspace> | ||
<mspace width="10px" height="5px" depth="15px"></mspace> | ||
</mrow> | ||
</math> | ||
</p> | ||
<p class="TestContainer" id="maction-toggle-selection"> | ||
<math> | ||
<maction actiontype="toggle" selection="3"> | ||
<mspace width="10px" height="10px"></mspace> | ||
<mspace width="10px" depth="10px"></mspace> | ||
<mspace width="10px" height="15px" depth="5px"></mspace> | ||
<mspace width="10px" height="5px" depth="15px"></mspace> | ||
</maction> | ||
</math> | ||
<math> | ||
<mrow class="onlyShowFirstChild"> | ||
<mspace width="10px" height="10px"></mspace> | ||
<mspace width="10px" depth="10px"></mspace> | ||
<mspace width="10px" height="15px" depth="5px"></mspace> | ||
<mspace width="10px" height="5px" depth="15px"></mspace> | ||
</mrow> | ||
</math> | ||
</p> | ||
<p class="TestContainer" id="maction-statusline"> | ||
<math> | ||
<maction actiontype="statusline"> | ||
<mspace width="10px" height="10px"></mspace> | ||
<mtext>MESSAGE</mtext> | ||
</maction> | ||
</math> | ||
<math> | ||
<mrow class="onlyShowFirstChild"> | ||
<mspace width="10px" height="10px"></mspace> | ||
<mtext>MESSAGE</mtext> | ||
</mrow> | ||
</math> | ||
</p> | ||
<p class="TestContainer" id="maction-tooltip"> | ||
<math> | ||
<maction actiontype="tooltip"> | ||
<mspace width="10px" height="10px"></mspace> | ||
<mtext>MESSAGE</mtext> | ||
</maction> | ||
</math> | ||
<math> | ||
<mrow class="onlyShowFirstChild"> | ||
<mspace width="10px" height="10px"></mspace> | ||
<mtext>MESSAGE</mtext> | ||
</mrow> | ||
</math> | ||
</p> | ||
<p class="TestContainer" id="maction-input"> | ||
<math> | ||
<maction actiontype="input"> | ||
<mspace width="10px" height="10px"></mspace> | ||
</maction> | ||
</math> | ||
<math> | ||
<mrow class="onlyShowFirstChild"> | ||
<mspace width="10px" height="10px"></mspace> | ||
</mrow> | ||
</math> | ||
</p> | ||
</body> | ||
</html> |
46 changes: 46 additions & 0 deletions
46
...web-platform/tests/mathml/presentation-markup/mrow/legacy-mrow-like-elements-002-ref.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,46 @@ | ||
<!DOCTYPE html> | ||
<html> | ||
<head> | ||
<meta charset="utf-8"> | ||
<title>Legacy maction and semantics elements (reference)</title> | ||
</head> | ||
<body> | ||
<p>This test passes if you see 4 green squares and no red.</p> | ||
<p> | ||
<math> | ||
<mrow> | ||
<mtext> | ||
<span style="display: inline-block; width: 50px; height: 50px; background: green;"></span> | ||
</mtext> | ||
</mrow> | ||
</math> | ||
</p> | ||
<p> | ||
<math> | ||
<mrow> | ||
<mrow style="display: inline-block"> | ||
<span style="display: inline-block; width: 50px; height: 50px; background: green;"></span> | ||
</mrow> | ||
</mrow> | ||
</math> | ||
</p> | ||
<p> | ||
<math> | ||
<mrow> | ||
<mspace style="background: green" width="50px" height="50px"></mspace> | ||
</mrow> | ||
</math> | ||
</p> | ||
<p> | ||
<math> | ||
<maction actiontype="toggle" selection="2"> | ||
<mspace style="display: none; background: red" width="50px" height="50px"></mspace> | ||
<mspace style="display: math; background: green" width="50px" height="50px"></mspace> | ||
<mspace style="background: red" width="50px" height="50px"></mspace> | ||
</maction> | ||
</math> | ||
</p> | ||
<script src="/mathml/support/feature-detection.js"></script> | ||
<script>MathMLFeatureDetection.ensure_for_match_reftest("has_mspace");</script> | ||
</body> | ||
</html> |
57 changes: 57 additions & 0 deletions
57
...ing/web-platform/tests/mathml/presentation-markup/mrow/legacy-mrow-like-elements-002.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,57 @@ | ||
<!DOCTYPE html> | ||
<html> | ||
<head> | ||
<meta charset="utf-8"> | ||
<title>Legacy maction and semantics elements</title> | ||
<link rel="help" href="https://www.w3.org/TR/MathML3/chapter3.html#presm.maction"> | ||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#enlivening-expressions"> | ||
<link rel="help" href="https://www.w3.org/TR/MathML3/chapter3.html#presm.semantics"> | ||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#semantics-and-presentation"> | ||
<meta name="assert" content="Verify that one can override the default rendering legacy maction and semantics elements using the display property"> | ||
<link rel="match" href="legacy-mrow-like-elements-002-ref.html"> | ||
</head> | ||
<body> | ||
<p>This test passes if you see 4 green squares and no red.</p> | ||
<p> | ||
<math> | ||
<semantics> | ||
<mspace style="display: none; background: red;" width="50px" height="50px"></mspace> | ||
<mspace style="background: red;" width="50px" height="50px"></mspace> | ||
<annotation style="display: math"> | ||
<span style="display: inline-block; width: 50px; height: 50px; background: green;"></span> | ||
</annotation> | ||
</semantics> | ||
</math> | ||
</p> | ||
<p> | ||
<math> | ||
<semantics> | ||
<mspace style="display: none; background: red;" width="50px" height="50px"></mspace> | ||
<mspace style="background: red;" width="50px" height="50px"></mspace> | ||
<annotation-xml style="display: inline-block" encoding="text/html"> | ||
<span style="display: inline-block; width: 50px; height: 50px; background: green;"></span> | ||
</annotation-xml> | ||
</semantics> | ||
</math> | ||
</p> | ||
<p> | ||
<math> | ||
<maction actiontype="toggle"> | ||
<mspace style="display: none; background: red" width="50px" height="50px"></mspace> | ||
<mspace style="display: math; background: green" width="50px" height="50px"></mspace> | ||
</maction> | ||
</math> | ||
</p> | ||
<p> | ||
<math> | ||
<maction actiontype="toggle" selection="2"> | ||
<mspace style="display: none; background: red" width="50px" height="50px"></mspace> | ||
<mspace style="display: math; background: green" width="50px" height="50px"></mspace> | ||
<mspace style="background: red" width="50px" height="50px"></mspace> | ||
</maction> | ||
</math> | ||
</p> | ||
<script src="/mathml/support/feature-detection.js"></script> | ||
<script>MathMLFeatureDetection.ensure_for_match_reftest("has_mspace");</script> | ||
</body> | ||
</html> |