| <!DOCTYPE html> |
| <html> |
| <head> |
| <meta charset="utf-8"> |
| <title>Subscripts and Superscripts parameters</title> |
| <link rel="help" href="https://mathml-refresh.github.io/mathml-core/#msubmsup"> |
| <meta name="assert" content="Elements msub, msup, subsup and msubsup correctly use the italic correction from the MATH table."> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <style> |
| math, mspace { |
| font-size: 10px; |
| } |
| @font-face { |
| font-family: largeop-displayoperatorminheight5000; |
| src: url("/fonts/math/largeop-displayoperatorminheight5000.woff"); |
| } |
| @font-face { |
| font-family: largeop-displayoperatorminheight2000-2AFF-italiccorrection3000; |
| src: url("/fonts/math/largeop-displayoperatorminheight2000-2AFF-italiccorrection3000.woff"); |
| } |
| </style> |
| <script> |
| function getBox(aId) { |
| return document.getElementById(aId).getBoundingClientRect(); |
| } |
| |
| setup({ explicit_done: true }); |
| window.addEventListener("load", function() { |
| // Delay the check to workaround WebKit's bug https://webkit.org/b/174030. |
| requestAnimationFrame(() => { document.fonts.ready.then(runTests); }); |
| }); |
| |
| /* |
| These two tests verify that: |
| - In msub, the script is at the right of the base minus the italic correction. |
| - In msup, the script is just at the right of the base. |
| - In msubsup, the scripts are shifted by the italic correction. |
| - In mmultiscripts, postscript pairs are shifted by the italic correction. |
| - In mmultiscripts, prescript pairs are vertically aligned. |
| */ |
| var epsilon = 1; |
| function runTests() { |
| test(function() { |
| var v = 0; |
| assert_approx_equals(getBox("base001").right - getBox("sub001").left, v, epsilon, "msub"); |
| assert_approx_equals(getBox("sup002").left, getBox("base002").right, epsilon, "msup"); |
| assert_approx_equals(getBox("sup003").left - getBox("sub003").left, v, epsilon, "msubsup"); |
| assert_approx_equals(getBox("sup004").left - getBox("sub004").left, v, epsilon, "mmultiscripts postscripts"); |
| assert_approx_equals(getBox("sup005").left - getBox("sub005").left, 0, epsilon, "mmultiscripts prescripts"); |
| }, "Null Italic Correction"); |
| test(function() { |
| var emToPx = 10 / 1000; // font-size: 10px, font.em = 1000 |
| var v = 3000 * emToPx; |
| assert_approx_equals(getBox("base011").right - getBox("sub011").left, v, epsilon, "msub"); |
| assert_approx_equals(getBox("sup012").left, getBox("base012").right, epsilon, "msup"); |
| assert_approx_equals(getBox("sup013").left - getBox("sub013").left, v, epsilon, "msubsup"); |
| assert_approx_equals(getBox("sup014").left - getBox("sub014").left, v, epsilon, "mmultiscripts postscripts"); |
| assert_approx_equals(getBox("sup015").left - getBox("sub015").left, 0, epsilon, "mmultiscripts prescripts"); |
| }, "NonNull Italic Correction"); |
| done(); |
| } |
| </script> |
| </head> |
| <body> |
| <div id="log"></div> |
| <h2>Null Italic Correction</h2> |
| <p> |
| <math displaystyle="true" style="font-family: largeop-displayoperatorminheight5000;"> |
| <msub> |
| <mo id="base001" lspace="0px" rspace="0px">⫿</mo> |
| <mspace id="sub001" height="1em" width="1em" style="background: blue"/> |
| </msub> |
| </math> |
| <math displaystyle="true" style="font-family: largeop-displayoperatorminheight5000;"> |
| <msup> |
| <mo id="base002" lspace="0px" rspace="0px">⫿</mo> |
| <mspace id="sup002" height="1em" width="1em" style="background: blue"/> |
| </msup> |
| </math> |
| <math displaystyle="true" style="font-family: largeop-displayoperatorminheight5000;"> |
| <msubsup> |
| <mo lspace="0px" rspace="0px">⫿</mo> |
| <mspace id="sub003" height="1em" width="1em" style="background: blue"/> |
| <mspace id="sup003" height="1em" width="1em" style="background: green"/> |
| </msubsup> |
| </math> |
| <math displaystyle="true" style="font-family: largeop-displayoperatorminheight5000;"> |
| <mmultiscripts> |
| <mo lspace="0px" rspace="0px">⫿</mo> |
| <mspace id="sub004" height="1em" width="1em" style="background: blue"/> |
| <mspace id="sup004" height="1em" width="1em" style="background: green"/> |
| <mprescripts/> |
| <mspace id="sub005" height="1em" width="1em" style="background: magenta"/> |
| <mspace id="sup005" height="1em" width="1em" style="background: cyan"/> |
| </mmultiscripts> |
| </math> |
| </p> |
| <h2>NonNull Italic Correction</h2> |
| <p> |
| <math displaystyle="true" style="font-family: largeop-displayoperatorminheight2000-2AFF-italiccorrection3000;"> |
| <msub> |
| <mo id="base011" lspace="0px" rspace="0px">⫿</mo> |
| <mspace id="sub011" height="1em" width="1em" style="background: blue"/> |
| </msub> |
| </math> |
| <math displaystyle="true" style="font-family: largeop-displayoperatorminheight2000-2AFF-italiccorrection3000;"> |
| <msup> |
| <mo id="base012" lspace="0px" rspace="0px">⫿</mo> |
| <mspace id="sup012" height="1em" width="1em" style="background: blue"/> |
| </msup> |
| </math> |
| <math displaystyle="true" style="font-family: largeop-displayoperatorminheight2000-2AFF-italiccorrection3000;"> |
| <msubsup> |
| <mo lspace="0px" rspace="0px">⫿</mo> |
| <mspace id="sub013" height="1em" width="1em" style="background: blue"/> |
| <mspace id="sup013" height="1em" width="1em" style="background: green"/> |
| </msubsup> |
| </math> |
| <math displaystyle="true" style="font-family: largeop-displayoperatorminheight2000-2AFF-italiccorrection3000;"> |
| <mmultiscripts> |
| <mo lspace="0px" rspace="0px">⫿</mo> |
| <mspace id="sub014" height="1em" width="1em" style="background: blue"/> |
| <mspace id="sup014" height="1em" width="1em" style="background: green"/> |
| <mprescripts/> |
| <mspace id="sub015" height="1em" width="1em" style="background: magenta"/> |
| <mspace id="sup015" height="1em" width="1em" style="background: cyan"/> |
| </mmultiscripts> |
| </math> |
| </p> |
| </body> |
| </html> |