mrow-fallback-001.html (1704B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>Test mrow fallback for some MathML elements</title> 6 <link rel="help" href="https://w3c.github.io/mathml-core/#script-and-limit-schemata"> 7 <meta name="assert" content="Verify that invalid markup fallbacks to row layout."> 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 <script src="/mathml/support/layout-comparison.js"></script> 13 <script src="/mathml/support/mathml-fragments.js"></script> 14 <script src="/mathml/support/invalid-markup.js"></script> 15 <style> 16 /* Revert style specified in the UA style sheet that changes box size. */ 17 mfrac { padding-inline: 0; } 18 </style> 19 <script> 20 setup({ explicit_done: true }); 21 window.addEventListener("load", () => { loadAllFonts().then(runTests); }); 22 23 function runTests() { 24 let container = document.getElementById("container"); 25 let invalidMarkup = generateInvalidMarkup(); 26 container.appendChild(invalidMarkup); 27 const epsilon = 1; 28 29 for (let math of invalidMarkup.children) { 30 let element = math.firstElementChild; 31 let reference = element.nextElementSibling; 32 let description = element.dataset.description; 33 test(function() { 34 compareLayout(element, reference, epsilon); 35 assert_approx_equals(element.getBoundingClientRect().top, reference.getBoundingClientRect().top, epsilon); 36 }, `Invalid <${element.tagName}> should lay out as an mrow (${description})`); 37 } 38 39 done(); 40 } 41 </script> 42 </head> 43 <body> 44 <div id="log"></div> 45 <div id="container"></div> 46 </body> 47 </html>