tor-browser

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

syntax.tentative.html (2768B)

      1 <!DOCTYPE html>
      2 <html>
      3  <head>
      4    <link rel="help" href="https://drafts.csswg.org/css-env-1/">
      5    <title>Test env() syntax</title>
      6    <script src="/resources/testharness.js"></script>
      7    <script src="/resources/testharnessreport.js"></script>
      8    <style>
      9      div { background-color: rgb(0, 128, 0); }
     10    </style>
     11  </head>
     12  <body>
     13    <script>
     14    // This value is expected if the syntax is valid.
     15    const envWorkingValue = "rgba(0, 0, 0, 0)";
     16 
     17    // This value is expected if the syntax is invalid.
     18    const pageDefaultValue = "rgb(0, 128, 0)";
     19 
     20    // This value is used to test fallback values.
     21    const blueValue = "rgb(0, 0, 255)";
     22 
     23    const testCases = [
     24      { style: "", expectedPropertyValue: pageDefaultValue },
     25      { style: "background-color: env(test)", expectedPropertyValue: envWorkingValue },
     26      { style: "background-color: ENV(test)", expectedPropertyValue: envWorkingValue },
     27      { style: "background-color: env(test) !important", expectedPropertyValue: envWorkingValue },
     28      { style: "background-color: env(test, 10px)", expectedPropertyValue: envWorkingValue },
     29      { style: "background-color: env(test, blue)", expectedPropertyValue: blueValue },
     30      { style: "background-color: env(test, env(another))", expectedPropertyValue: envWorkingValue },
     31      { style: "background-color: env(test, env(another, blue))", expectedPropertyValue: blueValue },
     32      { style: "background-color: env(-test)", expectedPropertyValue: envWorkingValue },
     33      { style: "background-color: env(--test)", expectedPropertyValue: envWorkingValue },
     34      { style: "background-color: env(10px)", expectedPropertyValue: pageDefaultValue },
     35      { style: "background-color: env(env(test))", expectedPropertyValue: pageDefaultValue },
     36      { style: "background-color: env( test)", expectedPropertyValue: envWorkingValue },
     37      { style: "background-color: env(test )", expectedPropertyValue: envWorkingValue },
     38      { style: "background-color: env( test )", expectedPropertyValue: envWorkingValue },
     39      { style: "background-color: env(test /**/, blue)", expectedPropertyValue: blueValue },
     40      { style: "background-color: env(test, {})", expectedPropertyValue: envWorkingValue },
     41      { style: "background-color: env(test, {)", expectedPropertyValue: pageDefaultValue },
     42    ];
     43 
     44    testCases.forEach((testcase) => {
     45      test(() => {
     46        const elem = document.createElement("div");
     47        const style = window.getComputedStyle(elem);
     48 
     49        document.body.appendChild(elem);
     50        elem.style.cssText = testcase.style;
     51 
     52        assert_equals(style.getPropertyValue("background-color"), testcase.expectedPropertyValue);
     53      }, testcase.style + " " + testcase.expectedPropertyValue);
     54    });
     55    </script>
     56  </body>
     57 </html>