tor-browser

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

palette-values-rule-add.html (1189B)

      1 <!DOCTYPE html>
      2 <html class="reftest-wait">
      3 <head>
      4 <meta charset="utf-8">
      5 <title>Tests that dynamically adding a @font-palette-values rule causes the necessary rendering update</title>
      6 <link rel="help" href="https://drafts.csswg.org/css-fonts/#font-palette-values">
      7 <link rel="author" title="Myles C. Maxfield" href="mailto:mmaxfield@apple.com">
      8 <link rel="mismatch" href="palette-values-rule-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 </style>
     15 </head>
     16 <body>
     17 <div style="font: 48px 'COLR-test-font'; font-palette: --MyPalette;">A</div>
     18 <script>
     19 let count = 0;
     20 function tick() {
     21    if (count > 3) {
     22        let style = document.createElement("style");
     23        document.head.appendChild(style);
     24        style.sheet.insertRule(`
     25            @font-palette-values --MyPalette {
     26                font-family: "COLR-test-font";
     27                base-palette: 1;
     28            }`);
     29        document.documentElement.classList.remove("reftest-wait");
     30    } else {
     31        ++count;
     32        requestAnimationFrame(tick);
     33    }
     34 }
     35 [...document.fonts][0].load().then(tick);
     36 </script>
     37 </body>
     38 </html>