tor-browser

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

test_text_decoration_shorthands.html (3927B)


      1 <!DOCTYPE html>
      2 <html>
      3 <head>
      4  <meta charset=utf-8>
      5  <title>Test parsing of text-decoration shorthands</title>
      6  <script src="/resources/testharness.js"></script>
      7  <script src="/resources/testharnessreport.js"></script>
      8  <link rel='stylesheet' href='/resources/testharness.css'>
      9 </head>
     10 <body>
     11 
     12 <script>
     13 
     14 var initial_values = {
     15    textDecorationColor: "rgb(255, 0, 255)",
     16    textDecorationLine: "none",
     17    textDecorationStyle: "solid",
     18    textDecorationThickness: "auto",
     19 };
     20 
     21 // For various specified values of the text-decoration shorthand,
     22 // test the computed values of the corresponding longhands.
     23 var text_decoration_test_cases = [
     24    {
     25        specified: "none",
     26    },
     27    {
     28        specified: "red",
     29        textDecorationColor: "rgb(255, 0, 0)",
     30    },
     31    {
     32        specified: "line-through",
     33        textDecorationLine: "line-through",
     34    },
     35    {
     36        specified: "dotted",
     37        textDecorationStyle: "dotted",
     38    },
     39    {
     40        specified: "20px",
     41        textDecorationThickness: "20px",
     42    },
     43    {
     44        specified: "auto",
     45        textDecorationThickness: "auto",
     46    },
     47    {
     48        specified: "from-font",
     49        textDecorationThickness: "from-font",
     50    },
     51    {
     52        specified: "#00ff00 underline",
     53        textDecorationColor: "rgb(0, 255, 0)",
     54        textDecorationLine: "underline",
     55    },
     56    {
     57        specified: "#ffff00 wavy",
     58        textDecorationColor: "rgb(255, 255, 0)",
     59        textDecorationStyle: "wavy",
     60    },
     61    {
     62        specified: "overline double",
     63        textDecorationLine: "overline",
     64        textDecorationStyle: "double",
     65    },
     66    {
     67        specified: "red underline solid",
     68        textDecorationColor: "rgb(255, 0, 0)",
     69        textDecorationLine: "underline",
     70        textDecorationStyle: "solid",
     71    },
     72    {
     73        specified: "double overline blue",
     74        textDecorationColor: "rgb(0, 0, 255)",
     75        textDecorationLine: "overline",
     76        textDecorationStyle: "double",
     77    },
     78    {
     79        specified: "solid underline 10px",
     80        textDecorationStyle: "solid",
     81        textDecorationLine: "underline",
     82        textDecorationThickness: "10px",
     83    },
     84    {
     85        specified: "line-through blue 200px",
     86        textDecorationLine: "line-through",
     87        textDecorationColor:  "rgb(0, 0, 255)",
     88        textDecorationThickness: "200px",
     89    },
     90    {
     91        specified: "underline wavy red 0",
     92        textDecorationLine: "underline",
     93        textDecorationStyle: "wavy",
     94        textDecorationColor: "rgb(255, 0, 0)",
     95        textDecorationThickness: "0px",
     96    },
     97    {
     98        specified: "overline -30px",
     99        textDecorationLine: "overline",
    100        textDecorationThickness: "-30px",
    101    },
    102    {
    103        specified: "underline red from-font",
    104        textDecorationLine: "underline",
    105        textDecorationColor: "rgb(255, 0, 0)",
    106        textDecorationThickness: "from-font",
    107    },
    108 ];
    109 
    110 function run_tests(test_cases, shorthand, subproperties) {
    111    test_cases.forEach(function(test_case) {
    112        test(function() {
    113            var element = document.createElement('div');
    114            document.body.appendChild(element);
    115            // Set text color to test initial value of text-decoration-color
    116            // (currentColor).
    117            element.style.color = "#ff00ff";
    118            element.style[shorthand] = test_case.specified;
    119            var computed = window.getComputedStyle(element);
    120            subproperties.forEach(function(longhand) {
    121                assert_equals(
    122                    computed[longhand],
    123                    test_case[longhand] || initial_values[longhand],
    124                    longhand
    125                );
    126            });
    127        }, "test parsing of 'text-decoration: " + test_case.specified + "'");
    128    });
    129 }
    130 
    131 run_tests(text_decoration_test_cases, "textDecoration", [
    132    "textDecorationColor", "textDecorationLine", "textDecorationStyle", "textDecorationThickness"]);
    133 
    134 </script>
    135 </body>
    136 </html>