tor-browser

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

test_getRegisteredCustomProperty.html (3607B)


      1 <!DOCTYPE HTML>
      2 <html>
      3 
      4 <head>
      5  <title>Test InspectorUtils.getCSSRegisteredProperty</title>
      6  <script src="/tests/SimpleTest/SimpleTest.js"></script>
      7  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
      8  <style>
      9    @property --color-1 {
     10      syntax: "<color>";
     11      inherits: true;
     12      initial-value: blue;
     13    }
     14 
     15    @property --color-2 {
     16      syntax: "*";
     17      inherits: false;
     18    }
     19  </style>
     20 </head>
     21 
     22 <body>
     23  <code>InspectorUtils.getCSSRegisteredProperty</code>
     24 
     25  <script>
     26    "use strict";
     27 
     28    /** Test for InspectorUtils.getCSSRegisteredProperty */
     29 
     30    const { Assert } = SpecialPowers.ChromeUtils.importESModule(
     31      "resource://testing-common/Assert.sys.mjs"
     32    );
     33    const InspectorUtils = SpecialPowers.InspectorUtils;
     34 
     35    CSS.registerProperty({
     36      name: "--length-1",
     37      syntax: "<length>",
     38      initialValue: "10px",
     39      inherits: true,
     40    });
     41    CSS.registerProperty({
     42      name: "--length-2",
     43      syntax: "foo | <integer>+ | <percentage> | <length># | auto",
     44      initialValue: "100vw",
     45      inherits: true
     46    });
     47    CSS.registerProperty({
     48      name: "--length-3",
     49      syntax: "*",
     50      inherits: false
     51    });
     52    CSS.registerProperty({
     53      name: "--length-4",
     54      syntax: "*",
     55      initialValue: "",
     56      inherits: false
     57    });
     58 
     59    is(
     60      InspectorUtils.getCSSRegisteredProperty(document, "--unknown"),
     61      null,
     62      "Returns null when the name does not match a registered property"
     63    );
     64    is(
     65      InspectorUtils.getCSSRegisteredProperty(document, ""),
     66      null,
     67      "Returns null when passed an empty string"
     68    );
     69    is(
     70      InspectorUtils.getCSSRegisteredProperty(document, "color-1"),
     71      null,
     72      "Returns null when passed a property name without leading --"
     73    );
     74 
     75    Assert.deepEqual(
     76      InspectorUtils.getCSSRegisteredProperty(document, "--color-1"), {
     77      name: "--color-1",
     78      syntax: "<color>",
     79      inherits: true,
     80      initialValue: "blue",
     81      fromJS: false,
     82    }, `Got expected registered property definition for "${"--color-1"}"`);
     83 
     84    Assert.deepEqual(
     85      InspectorUtils.getCSSRegisteredProperty(document, "--color-2"), {
     86      name: "--color-2",
     87      syntax: "*",
     88      inherits: false,
     89      initialValue: null,
     90      fromJS: false,
     91    }, `Got expected registered property definition for "${"--color-2"}"`);
     92 
     93    Assert.deepEqual(
     94      InspectorUtils.getCSSRegisteredProperty(document, "--length-1"), {
     95      name: "--length-1",
     96      syntax: "<length>",
     97      inherits: true,
     98      initialValue: "10px",
     99      fromJS: true,
    100    }, `Got expected registered property definition for "${"--length-1"}"`);
    101 
    102    Assert.deepEqual(
    103      InspectorUtils.getCSSRegisteredProperty(document, "--length-2"), {
    104      name: "--length-2",
    105      syntax: "foo | <integer>+ | <percentage> | <length># | auto",
    106      inherits: true,
    107      initialValue: "100vw",
    108      fromJS: true,
    109    }, `Got expected registered property definition for "${"--length-2"}"`);
    110 
    111    Assert.deepEqual(
    112      InspectorUtils.getCSSRegisteredProperty(document, "--length-3"), {
    113      name: "--length-3",
    114      syntax: "*",
    115      inherits: false,
    116      initialValue: null,
    117      fromJS: true,
    118    }, `Got expected registered property definition for "${"--length-3"}"`);
    119 
    120    Assert.deepEqual(
    121      InspectorUtils.getCSSRegisteredProperty(document, "--length-4"), {
    122      name: "--length-4",
    123      syntax: "*",
    124      inherits: false,
    125      initialValue: "",
    126      fromJS: true,
    127    }, `Got expected registered property definition for "${"--length-4"}"`);
    128 
    129  </script>
    130  </pre>
    131 </body>
    132 
    133 </html>