| <!DOCTYPE html> |
| <html class="reftest-wait"> |
| <head> |
| <meta charset="utf-8"> |
| <title>fractions bar</title> |
| <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#mfrac"> |
| <meta name="assert" content="Verifies painting of the fraction bar"> |
| <link rel="match" href="frac-bar-001-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: 0; |
| top: 0; |
| } |
| </style> |
| <script src="/common/reftest-wait.js"></script> |
| <script> |
| window.addEventListener("load", () => { |
| // Delay the check to workaround WebKit's bug https://webkit.org/b/174030. |
| requestAnimationFrame(() => { document.fonts.ready.then(adjustPositionOfFraction); }); |
| }); |
| function adjustPositionOfFraction() |
| { |
| requestAnimationFrame(() => { |
| var container = document.getElementById("container"); |
| var numeratorBox = document.getElementById("numerator").getBoundingClientRect(); |
| container.style.left = (10 - numeratorBox.left) + "px"; |
| container.style.top = (50 - numeratorBox.top) + "px"; |
| requestAnimationFrame(takeScreenshot); |
| }); |
| } |
| </script> |
| </head> |
| <body> |
| <p>This test passes if you see a green square.</p> |
| <div id="container"> |
| <math> |
| <mfrac style="color: green; font-size: 15em"> |
| <mspace id="numerator" width="150px"></mspace> |
| <mspace></mspace> |
| </mfrac> |
| </math> |
| </div> |
| </body> |
| </html> |