-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Bug 1570928 [wpt PR 18253] - MathML: Move tests for vertical math int…
…o .tentative.html for now., a=testonly Automatic update from web-platform-tests MathML: Move tests for vertical math into .tentative.html for now. (#18253) https://github.com/mathml-refresh/mathml/issues/18 -- wpt-commits: 8da4c04051c2e456398448b9a5b758c666688474 wpt-pr: 18253 UltraBlame original commit: 0b23e5302fce2092217a9b8662a3eaa0fe7979c3
- Loading branch information
Showing
4 changed files
with
201 additions
and
58 deletions.
There are no files selected for viewing
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
111 changes: 111 additions & 0 deletions
111
...-platform/tests/mathml/relations/css-styling/writing-mode/writing-mode-001.tentative.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,111 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <meta charset="utf-8"> | ||
| <title>writing mode</title> | ||
| <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#layout-algorithms"> | ||
| <meta name="assert" content="Verify CSS writing mode (writing-mode and directionproperties) for mrow."> | ||
| <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> | ||
| var epsilon = 1; | ||
|
|
||
| setup({ explicit_done: true }); | ||
| window.addEventListener("load", runTests); | ||
|
|
||
| function runTests() { | ||
| var reference = document.getElementById("horizontal-tb_ltr"); | ||
|
|
||
| // These tests are kept in a separate tentative.html file until it is | ||
| // clear how to handle vertical math layout. | ||
| // See https://github.com/mathml-refresh/mathml/issues/18 | ||
| ["vertical-lr_ltr", | ||
| "vertical-lr_rtl", | ||
| "vertical-rl_ltr", | ||
| "vertical-rl_rtl"].forEach(id => { | ||
| var element = document.getElementById(id); | ||
|
|
||
| test(function() { | ||
| var style = window.getComputedStyle(element); | ||
| var writingMode = id.split("_"); | ||
| assert_equals(style.getPropertyValue("writing-mode"), | ||
| writingMode[0], "writing-mode"); | ||
| assert_equals(style.getPropertyValue("direction"), | ||
| writingMode[1], "direction"); | ||
| }, `Inheritance of CSS writing-mode and direction (id='${id}')`); | ||
|
|
||
| test(function() { | ||
| assert_true(MathMLFeatureDetection.has_mspace()); | ||
| compareLayout(element, reference, epsilon); | ||
| }, `Layout of mrow (id='${id}')`); | ||
| }); | ||
| done(); | ||
| } | ||
| </script> | ||
| </head> | ||
| <body> | ||
| <div id="log"></div> | ||
| <p> | ||
| <math> | ||
| <mrow id="horizontal-tb_ltr"> | ||
| <mspace style="background: blue" | ||
| width="20px" height="30px" depth="40px"></mspace> | ||
| <mspace style="background: black" | ||
| width="50px" depth="60px"></mspace> | ||
| <mspace style="background: yellow" | ||
| width="70px" height="80px"></mspace> | ||
| </mrow> | ||
| </math> | ||
| </p> | ||
| <p> | ||
| <math style="writing-mode: vertical-lr;"> | ||
| <mrow id="vertical-lr_ltr"> | ||
| <mspace style="background: blue" | ||
| width="20px" height="30px" depth="40px"></mspace> | ||
| <mspace style="background: black" | ||
| width="50px" depth="60px"></mspace> | ||
| <mspace style="background: yellow" | ||
| width="70px" height="80px"></mspace> | ||
| </mrow> | ||
| </math> | ||
| </p> | ||
| <p> | ||
| <math style="writing-mode: vertical-lr; direction: rtl;"> | ||
| <mrow id="vertical-lr_rtl"> | ||
| <mspace style="background: blue" | ||
| width="20px" height="30px" depth="40px"></mspace> | ||
| <mspace style="background: black" | ||
| width="50px" depth="60px"></mspace> | ||
| <mspace style="background: yellow" | ||
| width="70px" height="80px"></mspace> | ||
| </mrow> | ||
| </math> | ||
| </p> | ||
| <p> | ||
| <math style="writing-mode: vertical-rl;"> | ||
| <mrow id="vertical-rl_ltr"> | ||
| <mspace style="background: blue" | ||
| width="20px" height="30px" depth="40px"></mspace> | ||
| <mspace style="background: black" | ||
| width="50px" depth="60px"></mspace> | ||
| <mspace style="background: yellow" | ||
| width="70px" height="80px"></mspace> | ||
| </mrow> | ||
| </math> | ||
| </p> | ||
| <p> | ||
| <math style="writing-mode: vertical-rl; direction: rtl;"> | ||
| <mrow id="vertical-rl_rtl"> | ||
| <mspace style="background: blue" | ||
| width="20px" height="30px" depth="40px"></mspace> | ||
| <mspace style="background: black" | ||
| width="50px" depth="60px"></mspace> | ||
| <mspace style="background: yellow" | ||
| width="70px" height="80px"></mspace> | ||
| </mrow> | ||
| </math> | ||
| </p> | ||
| </body> | ||
| </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
88 changes: 88 additions & 0 deletions
88
...-platform/tests/mathml/relations/css-styling/writing-mode/writing-mode-002.tentative.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,88 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <meta charset="utf-8"> | ||
| <title>writing mode</title> | ||
| <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#layout-algorithms"> | ||
| <meta name="assert" content="Verify CSS writing mode (writing-mode and direction properties) for mrow."> | ||
| <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 src="/mathml/support/mathml-fragments.js"></script> | ||
| <script> | ||
| var epsilon = 1; | ||
|
|
||
| setup({ explicit_done: true }); | ||
| window.addEventListener("load", runTests); | ||
|
|
||
| function runTests() { | ||
| for (tag in MathMLFragments) { | ||
| if (tag == "annotation" || tag == "annotation-xml") | ||
| continue; // These tags have display: none. | ||
|
|
||
| // These tests are kept in a separate tentative.html file until it is | ||
| // clear how to handle vertical math layout. | ||
| // See https://github.com/mathml-refresh/mathml/issues/18 | ||
| ["vertical-lr_ltr", | ||
| "vertical-lr_rtl", | ||
| "vertical-rl_ltr", | ||
| "vertical-rl_rtl"].forEach(id => { | ||
| var writingMode = id.split("_"); | ||
| var writingModeString = `writing-mode: ${writingMode[0]}; direction: ${writingMode[1]};`; | ||
|
|
||
| document.body.insertAdjacentHTML("beforeend", `<div>\ | ||
| <math>${MathMLFragments[tag]}</math>\ | ||
| <math>${MathMLFragments[tag]}</math>\ | ||
| </div>`); | ||
| var div = document.body.lastElementChild; | ||
|
|
||
| var styleMath = div.firstElementChild; | ||
| styleMath.setAttribute("style", writingModeString); | ||
| var styleElement = FragmentHelper.element(styleMath); | ||
|
|
||
| var referenceMath = div.lastElementChild; | ||
| var referenceElement = FragmentHelper.element(referenceMath); | ||
|
|
||
| [styleMath, referenceMath].forEach(math => { | ||
| Array.from(math.getElementsByClassName("mathml-container")).forEach(container => { | ||
| container.insertAdjacentHTML("beforeend", "\ | ||
| <mspace style='background: blue'\ | ||
| width='20px' height='30px' depth='40px'></mspace>\ | ||
| <mspace style='background: black'\ | ||
| width='50px' depth='60px'></mspace>\ | ||
| <mspace style='background: yellow'\ | ||
| width='70px' height='80px'></mspace>"); | ||
| }); | ||
| Array.from(math.getElementsByClassName("foreign-container")).forEach(container => { | ||
| container.insertAdjacentHTML("beforeend", "\ | ||
| <span style='display: inline-block; background: lightblue;\ | ||
| inline-size: 20px; block-size: 30px;\ | ||
| vertical-align: bottom;'></span>\ | ||
| <span style='display: inline-block; background: pink;\ | ||
| inline-size: 40px; block-size: 50px;\ | ||
| vertical-align: bottom;'></span>"); | ||
| }); | ||
| }); | ||
|
|
||
| test(function() { | ||
| assert_true(MathMLFeatureDetection.has_mspace()); | ||
| var style = window.getComputedStyle(styleElement); | ||
| assert_equals(style.getPropertyValue("writing-mode"), | ||
| writingMode[0], "writing-mode"); | ||
| assert_equals(style.getPropertyValue("direction"), | ||
| writingMode[1], "direction"); | ||
| compareLayout(styleElement, referenceElement, epsilon); | ||
| }, `Layout of ${tag} (${writingModeString})`); | ||
|
|
||
| div.style = "display: none;"; // Hide the div after testing. | ||
| }); | ||
| } | ||
| done(); | ||
| } | ||
| </script> | ||
| </head> | ||
| <body> | ||
| <div id="log"></div> | ||
| </body> | ||
| </html> |