tor-browser

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

font-palette-add.html (1064B)


      1 <!DOCTYPE html>
      2 <html class="reftest-wait">
      3 <head>
      4 <meta charset="utf-8">
      5 <title>Tests that dynamically adding font-palette causes the necessary rendering update</title>
      6 <link rel="help" href="https://drafts.csswg.org/css-fonts/#font-palette-prop">
      7 <link rel="author" title="Myles C. Maxfield" href="mailto:mmaxfield@apple.com">
      8 <link rel="mismatch" href="font-palette-add-notref.html">
      9 <style>
     10 @font-face {
     11    font-family: "COLR-test-font";
     12    src: url("resources/COLR-palettes-test-font.ttf") format("truetype");
     13 }
     14 
     15 @font-palette-values --MyPalette {
     16    font-family: "COLR-test-font";
     17    base-palette: 1;
     18 }
     19 </style>
     20 </head>
     21 <body>
     22 <div id="target" style="font: 48px 'COLR-test-font';">A</div>
     23 <script>
     24 let count = 0;
     25 function tick() {
     26    if (count > 3) {
     27        document.getElementById("target").style.setProperty("font-palette", "--MyPalette");
     28        document.documentElement.classList.remove("reftest-wait");
     29    } else {
     30        ++count;
     31        requestAnimationFrame(tick);
     32    }
     33 }
     34 [...document.fonts][0].load().then(tick);
     35 </script>
     36 </body>
     37 </html>