layout/style/test/test_variable_serialization_computed.html

Thu, 15 Jan 2015 21:03:48 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Thu, 15 Jan 2015 21:03:48 +0100
branch
TOR_BUG_9701
changeset 11
deefc01c0e14
permissions
-rw-r--r--

Integrate friendly tips from Tor colleagues to make (or not) 4.5 alpha 3;
This includes removal of overloaded (but unused) methods, and addition of
a overlooked call to DataStruct::SetData(nsISupports, uint32_t, bool.)

michael@0 1 <!DOCTYPE html>
michael@0 2 <title>Test serialization of computed CSS variable values</title>
michael@0 3 <script src="/MochiKit/MochiKit.js"></script>
michael@0 4 <script src="/tests/SimpleTest/SimpleTest.js"></script>
michael@0 5 <link rel="stylesheet" href="/tests/SimpleTest/test.css" type="text/css">
michael@0 6
michael@0 7 <div>
michael@0 8 <span></span>
michael@0 9 </div>
michael@0 10
michael@0 11 <script>
michael@0 12 // Each entry is an entire declaration followed by the property to check and
michael@0 13 // its expected computed value.
michael@0 14 var values = [
michael@0 15 ["", "--z", "an-inherited-value"],
michael@0 16 ["--a: ", "--a", " "],
michael@0 17 ["--a: initial", "--a", ""],
michael@0 18 ["--z: initial", "--z", ""],
michael@0 19 ["--a: inherit", "--a", ""],
michael@0 20 ["--z: inherit", "--z", "an-inherited-value"],
michael@0 21 ["--a: unset", "--a", ""],
michael@0 22 ["--z: unset", "--z", "an-inherited-value"],
michael@0 23 ["--a: 1px", "--a", " 1px"],
michael@0 24 ["--a: var(--a)", "--a", ""],
michael@0 25 ["--a: var(--b)", "--a", ""],
michael@0 26 ["--a: var(--b); --b: 1px", "--a", " 1px"],
michael@0 27 ["--a: var(--b, 1px)", "--a", " 1px"],
michael@0 28 ["--a: var(--a, 1px)", "--a", ""],
michael@0 29 ["--a: something 3px url(whereever) calc(var(--a) + 1px)", "--a", ""],
michael@0 30 ["--a: something 3px url(whereever) calc(var(--b,1em) + 1px)", "--a", " something 3px url(whereever) calc(1em + 1px)"],
michael@0 31 ["--a: var(--b, var(--c, var(--d, Black)))", "--a", " Black"],
michael@0 32 ["--a: a var(--b) c; --b:b", "--a", " a b c"],
michael@0 33 ["--a: a var(--b,b var(--c) d) e; --c:c", "--a", " a b c d e"],
michael@0 34 ["--a: var(--b)red; --b:orange;", "--a", " orange/**/red"],
michael@0 35 ["--a: var(--b)var(--c); --b:orange; --c:red;", "--a", " orange/**/red"],
michael@0 36 ["--a: var(--b)var(--c,red); --b:orange;", "--a", " orange/**/red"],
michael@0 37 ["--a: var(--b,orange)var(--c); --c:red;", "--a", " orange/**/red"],
michael@0 38 ["counter-reset: var(--a)red; --a:orange;", "counter-reset", "orange 0 red 0"],
michael@0 39 ["--a: var(--b)var(--c); --c:[c]; --b:('ab", "--a", " ('ab')[c]"],
michael@0 40 ["--a: '", "--a", " ''"],
michael@0 41 ["--a: '\\", "--a", " ''"],
michael@0 42 ["--a: \\", "--a", " \\\ufffd"],
michael@0 43 ["--a: \"", "--a", " \"\""],
michael@0 44 ["--a: \"\\", "--a", " \"\""],
michael@0 45 ["--a: /* abc ", "--a", " /* abc */"],
michael@0 46 ["--a: /* abc *", "--a", " /* abc */"],
michael@0 47 ["--a: url(http://example.org/", "--a", " url(http://example.org/)"],
michael@0 48 ["--a: url(http://example.org/\\", "--a", " url(http://example.org/\\\ufffd)"],
michael@0 49 ["--a: url('http://example.org/", "--a", " url('http://example.org/')"],
michael@0 50 ["--a: url('http://example.org/\\", "--a", " url('http://example.org/')"],
michael@0 51 ["--a: url(\"http://example.org/", "--a", " url(\"http://example.org/\")"],
michael@0 52 ["--a: url(\"http://example.org/\\", "--a", " url(\"http://example.org/\")"]
michael@0 53 ];
michael@0 54
michael@0 55 function runTest() {
michael@0 56 var div = document.querySelector("div");
michael@0 57 var span = document.querySelector("span");
michael@0 58
michael@0 59 div.setAttribute("style", "--z:an-inherited-value");
michael@0 60
michael@0 61 values.forEach(function(entry, i) {
michael@0 62 var declaration = entry[0];
michael@0 63 var property = entry[1];
michael@0 64 var expected = entry[2];
michael@0 65 span.setAttribute("style", declaration);
michael@0 66 var cs = getComputedStyle(span, "");
michael@0 67 is(cs.getPropertyValue(property), expected, "subtest #" + i);
michael@0 68 });
michael@0 69
michael@0 70 SimpleTest.finish();
michael@0 71 }
michael@0 72
michael@0 73 SimpleTest.waitForExplicitFinish();
michael@0 74 SpecialPowers.pushPrefEnv({ set: [["layout.css.variables.enabled", true]] },
michael@0 75 runTest);
michael@0 76 </script>

mercurial