tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

display-operator-min-height-no-workaround.html (2371B)

      1 <!DOCTYPE html>
      2 <html>
      3  <head>
      4    <meta charset="utf-8" />
      5    <title>DisplayOperatorMinHeight with custom font</title>
      6    <link
      7      rel="help"
      8      href="https://w3c.github.io/mathml-core/#layout-of-operators"
      9    >
     10    <meta
     11      name="assert"
     12      content="Laying out operators should respect the font's DisplayOperatorMinHeight"
     13    >
     14    <script src="/resources/testharness.js"></script>
     15    <script src="/resources/testharnessreport.js"></script>
     16    <script src="/mathml/support/feature-detection.js"></script>
     17    <script src="/mathml/support/fonts.js"></script>
     18 
     19    <style>
     20      /* This font has a DisplayOperatorMinHeight of 1.25em and two variants of the 0x2AFF
     21      character, one with a height of 1.25em and the other with 2em. */
     22      @font-face {
     23        font-family: largeop-displayoperatorminheight1250;
     24        src: url("/fonts/math/largeop-displayoperatorminheight1250.woff");
     25      }
     26      math {
     27        font-family: largeop-displayoperatorminheight1250;
     28        font-size: 32px;
     29        color: green;
     30      }
     31      math > mo:first-child {
     32        color: blue;
     33      }
     34    </style>
     35 
     36    <script>
     37      const font_size = 32;
     38      const small_variant = 1.25 * font_size;
     39      // Needs to be less than the difference between the two variants (2em - 1.25em)
     40      const epsilon = 0.1 * font_size;
     41 
     42      // Some browser engines had a minimum for DisplayOperatorMinHeight of sqrt(2) times
     43      // the base glyph size (~1.41 * 1em in this case).
     44      // This test checks that the constant is not modified and the variant measuring 1.25em
     45      // is picked instead of the bigger one measuring 2em.
     46      var t = async_test("DisplayOperatorMinHeight is not modified");
     47      window.addEventListener("load", () => {
     48        loadAllFonts().then(
     49          t.step_func_done(function () {
     50            const math = document.querySelector("math");
     51            children = math.children;
     52            largeop = children[1].getBoundingClientRect();
     53            assert_approx_equals(
     54              largeop.height,
     55              small_variant,
     56              epsilon,
     57              "Using the small variant",
     58            );
     59          }),
     60        );
     61      });
     62    </script>
     63  </head>
     64 
     65  <body>
     66    <div id="log"></div>
     67    <math display="block">
     68      <mo largeop="false">&#x2AFF;</mo>
     69      <mo largeop="true">&#x2AFF;</mo>
     70    </math>
     71  </body>
     72 </html>