diff options
Diffstat (limited to 'testing/web-platform/tests/mathml/presentation-markup/mrow/mrow-fallback.html')
-rw-r--r-- | testing/web-platform/tests/mathml/presentation-markup/mrow/mrow-fallback.html | 125 |
1 files changed, 125 insertions, 0 deletions
diff --git a/testing/web-platform/tests/mathml/presentation-markup/mrow/mrow-fallback.html b/testing/web-platform/tests/mathml/presentation-markup/mrow/mrow-fallback.html new file mode 100644 index 0000000000..3f9d466148 --- /dev/null +++ b/testing/web-platform/tests/mathml/presentation-markup/mrow/mrow-fallback.html @@ -0,0 +1,125 @@ +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>Test mrow fallback for some MathML elements</title> +<link rel="help" href="https://w3c.github.io/mathml-core/#script-and-limit-schemata"> +<meta name="assert" content="Verify that invalid markup fallbacks to row layout."> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="/mathml/support/feature-detection.js"></script> +<script src="/mathml/support/fonts.js"></script> +<script src="/mathml/support/layout-comparison.js"></script> +<script src="/mathml/support/mathml-fragments.js"></script> +<script> + setup({ explicit_done: true }); + window.addEventListener("load", () => { loadAllFonts().then(runTests); }); + + function isValid(tagName, mspaceCount) { + switch (tagName) { + case "mfrac": + case "mroot": + case "munder": + case "mover": + case "msub": + case "msup": + return mspaceCount == 2; + case "munderover": + case "msubsup": + return mspaceCount == 3; + case "mmultiscripts": + return mspaceCount % 2 == 1; + } + } + + function runTests() { + let container = document.getElementById("container"); + const epsilon = 1; + ["mfrac", "mroot", "munder", "mover", "munderover", "msub", "msup", "msubsup", "mmultiscripts"].forEach(tag => { + let element = FragmentHelper.createElement(tag); + let reference = FragmentHelper.createElement("mrow"); + container.appendChild(element); + container.appendChild(reference); + let maxCount = tag == "mmultiscripts" ? 10 : 5; + let mspaceCount = 0; + for (let count = 0; count <= maxCount; count++) { + if (!isValid(tag, mspaceCount)) { + test(function() { + compareLayout(element, reference, epsilon); + }, `Invalid <${element.tagName}> should lay out as an mrow (count == ${count})`); + } + if (tag == "mmultiscripts" && count == maxCount / 2) { + [element, reference].forEach(el => { + el.insertAdjacentHTML("beforeend", `<mprescripts/>`); + }); + } else { + let width = (count + 1) * 10; + let height = (count + 1) * (count % 2 ? 15 : 5); + let depth = (count + 1) * (count % 2 ? 5 : 15); + [element, reference].forEach(el => { + el.insertAdjacentHTML("beforeend", `<mspace height="${height}px" depth="${depth}px" width="${width}px" style="background: black"/>`); + }); + mspaceCount++; + } + } + }); + Array.from(document.getElementById("invalidMultiscripts"). + getElementsByTagName("mmultiscripts")).forEach(element => { + let reference = element.nextElementSibling; + let description = element.dataset.description; + test(function() { + compareLayout(element, reference, epsilon); + }, `Invalid mmultiscripts should lay out as an mrow (${description})`); + }); + + done(); + } +</script> +</head> +<body> + <div id="log"></div> + <div id="container"></div> + <div id="invalidMultiscripts"> + <math> + <mmultiscripts data-description="first in-flow child is an <mprescripts>"> + <mprescripts/> + <mspace height="5px" depth="15px" width="10px" style="background: black"/> + <mspace height="30px" depth="10px" width="20px" style="background: black"/> + <mspace height="15px" depth="45px" width="30px" style="background: black"/> + <mspace height="60px" depth="20px" width="40px" style="background: black"/> + + </mmultiscripts> + <mrow> + <mprescripts/> + <mspace height="5px" depth="15px" width="10px" style="background: black"/> + <mspace height="30px" depth="10px" width="20px" style="background: black"/> + <mspace height="15px" depth="45px" width="30px" style="background: black"/> + <mspace height="60px" depth="20px" width="40px" style="background: black"/> + + </mrow> + </math> + <math> + <mmultiscripts data-description="one of the even number of children after the first <mprescripts> is an <mprescripts>"> + <mspace height="5px" depth="15px" width="10px" style="background: black"/> + <mspace height="30px" depth="10px" width="20px" style="background: black"/> + <mspace height="15px" depth="45px" width="30px" style="background: black"/> + <mprescripts/> + <mspace height="60px" depth="20px" width="40px" style="background: black"/> + <mprescripts/> + <mspace height="25px" depth="75px" width="50px" style="background: black"/> + <mspace height="35px" depth="105px" width="70px" style="background: black"/> + </mmultiscripts> + <mrow> + <mspace height="5px" depth="15px" width="10px" style="background: black"/> + <mspace height="30px" depth="10px" width="20px" style="background: black"/> + <mspace height="15px" depth="45px" width="30px" style="background: black"/> + <mprescripts/> + <mspace height="60px" depth="20px" width="40px" style="background: black"/> + <mprescripts/> + <mspace height="25px" depth="75px" width="50px" style="background: black"/> + <mspace height="35px" depth="105px" width="70px" style="background: black"/> + </mrow> + </math> + </div> +</body> +</html> |