tor-browser

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

font-variant-shorthand-serialization.html (5013B)

      1 <!doctype html>
      2 <html>
      3 <meta charset="utf-8">
      4 <title>Serialization of font-variant shorthand</title>
      5 <link rel="author" title="Tim Nguyen" href="https://github.com/nt1m">
      6 <link rel="help" href="https://drafts.csswg.org/cssom-1/#serialize-a-css-declaration-block">
      7 <script src="/resources/testharness.js"></script>
      8 <script src="/resources/testharnessreport.js"></script>
      9 <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
     10 <div id="target"></div>
     11 <script>
     12    const cssWideKeywords = ["initial", "inherit", "unset", "revert", "revert-layer"];
     13    function test_serialization_set(expected) {
     14        for (const [property, value] of Object.entries(expected)) {
     15            if (!CSS.supports(`${property}: initial`))
     16                continue;
     17            assert_equals(target.style[property], value, `${property} was set`);
     18        }
     19    }
     20    function setWithValue(value) {
     21        return {
     22            "font-variant-ligatures": value,
     23            "font-variant-caps": value,
     24            "font-variant-alternates": value,
     25            "font-variant-numeric": value,
     26            "font-variant-east-asian": value,
     27            "font-variant-position": value,
     28            "font-variant-emoji": value,
     29            "font-variant": value
     30        };
     31    }
     32    const emptySet = setWithValue("");
     33    const normalSet = setWithValue("normal");
     34    const nonDefaultValues = {
     35        "font-variant-ligatures": "common-ligatures discretionary-ligatures",
     36        "font-variant-caps": "small-caps",
     37        "font-variant-alternates": "historical-forms",
     38        "font-variant-numeric": "oldstyle-nums stacked-fractions",
     39        "font-variant-east-asian": "ruby",
     40        "font-variant-position": "sub",
     41        "font-variant-emoji": "emoji",
     42    };
     43    test(function(t) {
     44        target.style.fontVariant = "normal";
     45        t.add_cleanup(() => target.removeAttribute("style"));
     46 
     47        test_serialization_set(normalSet);
     48    }, "font-variant: normal serialization");
     49 
     50    test(function(t) {
     51        target.style.fontVariant = "normal";
     52        target.style.fontVariantLigatures = "none";
     53        t.add_cleanup(() => target.removeAttribute("style"));
     54 
     55        const expected = Object.assign({}, normalSet);
     56        expected["font-variant-ligatures"] = "none";
     57        expected["font-variant"] = "none";
     58 
     59        test_serialization_set(expected);
     60    }, "font-variant: none serialization");
     61 
     62    test(function(t) {
     63        t.add_cleanup(() => target.removeAttribute("style"));
     64        for (const [property, value] of Object.entries(nonDefaultValues)) {
     65            if (property == "font-variant-ligatures" || !CSS.supports(`${property}: initial`))
     66                continue;
     67            target.style.fontVariant = "normal";
     68            target.style.fontVariantLigatures = "none";
     69            target.style[property] = value;
     70 
     71            const expected = Object.assign({}, normalSet);
     72            expected["font-variant-ligatures"] = "none";
     73            expected["font-variant"] = "";
     74            expected[property] = value;
     75 
     76            test_serialization_set(expected);
     77            target.removeAttribute("style");
     78        }
     79    }, "font-variant-ligatures: none serialization with non-default value for another longhand");
     80 
     81    test(function(t) {
     82        t.add_cleanup(() => target.removeAttribute("style"));
     83 
     84        for (const [property, value] of Object.entries(nonDefaultValues)) {
     85            if (!CSS.supports(`${property}: initial`))
     86                continue;
     87            target.style.fontVariant = "normal";
     88            target.style[property] = value;
     89 
     90            const expected = Object.assign({}, normalSet);
     91            expected[property] = value;
     92            expected["font-variant"] = value;
     93            test_serialization_set(expected);
     94 
     95            target.removeAttribute("style");
     96        }
     97    }, "font-variant: normal with non-default longhands");
     98 
     99    test(function(t) {
    100        t.add_cleanup(() => target.removeAttribute("style"));
    101        for (const keyword of cssWideKeywords) {
    102            target.style.fontVariant = "normal";
    103            target.style.fontVariantLigatures = keyword;
    104 
    105            const expected = Object.assign({}, normalSet);
    106            expected["font-variant-ligatures"] = keyword;
    107            expected["font-variant"] = "";
    108            test_serialization_set(expected);
    109            target.removeAttribute("style");
    110        }
    111    }, "CSS-wide keyword in one longhand");
    112 
    113    test(function(t) {
    114        t.add_cleanup(() => target.removeAttribute("style"));
    115 
    116        for (const keyword of cssWideKeywords) {
    117            target.style.fontVariant = keyword;
    118            test_serialization_set(setWithValue(keyword));
    119            target.removeAttribute("style");
    120        }
    121    }, "CSS-wide keyword in shorthand");
    122 
    123    test(function(t) {
    124        target.style.fontVariant = "normal";
    125        target.style.font = "menu";
    126        t.add_cleanup(() => target.removeAttribute("style"));
    127 
    128        test_serialization_set(emptySet);
    129    }, "font: menu serialization");
    130 </script>
    131 </html>