khronosschoty
/
palemoon-dev


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
							<!DOCTYPE html>
<html>
<head>
  <meta charset=utf-8>
  <title>Test serialization of CSS Align shorthand properties</title>
  <link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
  <script src="/resources/testharness.js"></script>
  <script src="/resources/testharnessreport.js"></script>
  <link rel='stylesheet' href='/resources/testharness.css'>
</head>
<body>

<script>

var initial_values = {
    alignContent: "normal",
    alignItems: "normal",
    alignSelf: "auto",
    justifyContent: "normal",
    justifyItems: "auto",
    justifySelf: "auto",
};

var place_content_test_cases = [
    {
        alignContent: "center",
        shorthand: "center normal",
    },
    {
        alignContent: "baseline right safe",
        shorthand: "",
    },
    {
        justifyContent: "start safe",
        shorthand: "",
    },
    {
        justifyContent: "space-evenly start",
        shorthand: "",
    },
    {
        alignContent: "start",
        justifyContent: "end",
        shorthand: "start end",
    },
];

var place_items_test_cases = [
    {
        alignItems: "center",
        shorthand: "center auto",
    },
    {
        alignItems: "baseline",
        shorthand: "baseline auto",
    },
    {
        justifyItems: "start safe",
        shorthand: "",
    },
    {
        justifyItems: "stretch",
        shorthand: "normal stretch",
    },
    {
        justifyItems: "left legacy",
        shorthand: "",
    },
    {
        alignItems: "stretch",
        justifyItems: "end",
        shorthand: "stretch end",
    },
];

var place_self_test_cases = [
    {
        alignSelf: "right",
        shorthand: "right auto",
    },
    {
        alignSelf: "self-end safe",
        shorthand: "",
    },
    {
        justifySelf: "unsafe start",
        shorthand: "",
    },
    {
        justifySelf: "last baseline start",
        shorthand: "",
    },
    {
        alignSelf: "baseline",
        justifySelf: "last baseline",
        shorthand: "baseline last baseline",
    },
];

function run_tests(test_cases, shorthand, subproperties) {
    test_cases.forEach(function(test_case) {
        test(function() {
            var element = document.createElement('div');
            document.body.appendChild(element);
            subproperties.forEach(function(longhand) {
                element.style[longhand] = test_case[longhand] ||
                                          initial_values[longhand];
            });
            assert_equals(element.style[shorthand], test_case.shorthand);
        }, "test shorthand serialization " + JSON.stringify(test_case));
    });
}

run_tests(place_content_test_cases, "placeContent", [
    "alignContent", "justifyContent"]);
run_tests(place_items_test_cases, "placeItems", [
    "alignItems", "justifyItems"]);
run_tests(place_self_test_cases, "placeSelf", [
    "alignSelf", "justifySelf"]);

</script>
</body>
</html>