tor-browser

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

shorthand-serialization-001.html (3296B)

      1 <!DOCTYPE html>
      2 <html>
      3 <head>
      4  <meta charset=utf-8>
      5  <title>Test serialization of CSS Align shorthand properties</title>
      6  <link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
      7  <link rel="help" href="https://drafts.csswg.org/css-align/">
      8  <script src="/resources/testharness.js"></script>
      9  <script src="/resources/testharnessreport.js"></script>
     10 </head>
     11 <body>
     12 
     13 <script>
     14 
     15 var initial_values = {
     16    alignContent: "normal",
     17    alignItems: "normal",
     18    alignSelf: "auto",
     19    justifyContent: "normal",
     20    justifyItems: "legacy",
     21    justifySelf: "auto",
     22 };
     23 
     24 var place_content_test_cases = [
     25    {
     26        alignContent: "center",
     27        shorthand: "center normal",
     28    },
     29    {
     30        alignContent: "baseline safe right",
     31        shorthand: "",
     32    },
     33    {
     34        justifyContent: "safe start",
     35        shorthand: "normal safe start",
     36    },
     37    {
     38        justifyContent: "unsafe start",
     39        shorthand: ["normal unsafe start"],
     40    },
     41    {
     42        justifyContent: "space-evenly start",
     43        shorthand: "",
     44    },
     45    {
     46        alignContent: "start",
     47        justifyContent: "end",
     48        shorthand: "start end",
     49    },
     50 ];
     51 
     52 var place_items_test_cases = [
     53    {
     54        alignItems: "center",
     55        shorthand: "center legacy",
     56    },
     57    {
     58        alignItems: "baseline",
     59        shorthand: "baseline legacy",
     60    },
     61    {
     62        justifyItems: "safe start",
     63        shorthand: "normal safe start",
     64    },
     65    {
     66        justifyItems: "unsafe start",
     67        shorthand: ["normal unsafe start"],
     68    },
     69    {
     70        justifyItems: "stretch",
     71        shorthand: "normal stretch",
     72    },
     73    {
     74        justifyItems: "left legacy",
     75        shorthand: "normal legacy left",
     76    },
     77    {
     78        alignItems: "stretch",
     79        justifyItems: "end",
     80        shorthand: "stretch end",
     81    },
     82 ];
     83 
     84 var place_self_test_cases = [
     85    {
     86        alignSelf: "self-end safe",
     87        shorthand: "",
     88    },
     89    {
     90        justifySelf: "unsafe start",
     91        shorthand: ["auto start", "auto unsafe start"],
     92    },
     93    {
     94        justifySelf: "last baseline start",
     95        shorthand: "",
     96    },
     97    {
     98        alignSelf: "baseline",
     99        justifySelf: "last baseline",
    100        shorthand: "baseline last baseline",
    101    },
    102 ];
    103 
    104 function run_tests(test_cases, shorthand, subproperties) {
    105    test_cases.forEach(function(test_case) {
    106        test(function() {
    107            var element = document.createElement('div');
    108            document.body.appendChild(element);
    109            subproperties.forEach(function(longhand) {
    110                element.style[longhand] = test_case[longhand] ||
    111                                          initial_values[longhand];
    112            });
    113            if (Array.isArray(test_case.shorthand)) {
    114              assert_in_array(element.style[shorthand], test_case.shorthand);
    115            } else {
    116              assert_equals(element.style[shorthand], test_case.shorthand);
    117            }
    118        }, "test shorthand serialization " + JSON.stringify(test_case));
    119    });
    120 }
    121 
    122 run_tests(place_content_test_cases, "placeContent", [
    123    "alignContent", "justifyContent"]);
    124 run_tests(place_items_test_cases, "placeItems", [
    125    "alignItems", "justifyItems"]);
    126 run_tests(place_self_test_cases, "placeSelf", [
    127    "alignSelf", "justifySelf"]);
    128 
    129 </script>
    130 </body>
    131 </html>