Wed, 31 Dec 2014 06:55:50 +0100
Added tag UPSTREAM_283F7C6 for changeset ca08bd8f51b2
1 <!DOCTYPE type>
2 <title>Assorted CSS variable tests</title>
3 <script src="/MochiKit/MochiKit.js"></script>
4 <script src="/tests/SimpleTest/SimpleTest.js"></script>
5 <link rel="stylesheet" href="/tests/SimpleTest/test.css" type="text/css">
7 <style id="test1">
8 </style>
10 <style id="test2">
11 </style>
13 <style id="test3">
14 </style>
16 <style id="test4">
17 </style>
19 <div id="t4"></div>
21 <script>
22 var tests = [
23 function() {
24 // https://bugzilla.mozilla.org/show_bug.cgi?id=773296#c121
25 var test1 = document.getElementById("test1");
26 test1.textContent = "p { --a:123!important; }";
27 var declaration = test1.sheet.cssRules[0].style;
28 declaration.cssText;
29 declaration.setProperty("color", "black");
30 is(declaration.getPropertyValue("--a"), "123");
31 },
33 function() {
34 // https://bugzilla.mozilla.org/show_bug.cgi?id=773296#c121
35 var test2 = document.getElementById("test2");
36 test2.textContent = "p { --a: a !important; }";
37 var declaration = test2.sheet.cssRules[0].style;
38 is(declaration.getPropertyPriority("--a"), "important");
39 },
41 function() {
42 // https://bugzilla.mozilla.org/show_bug.cgi?id=955913
43 var test3 = document.getElementById("test3");
44 test3.textContent = "p { border-left-style: inset; padding: 1px; --decoration: line-through; }";
45 var declaration = test3.sheet.cssRules[0].style;
46 is(declaration[declaration.length - 1], "--decoration");
47 },
49 function() {
50 // https://bugzilla.mozilla.org/show_bug.cgi?id=959973
51 var test4 = document.getElementById("test4");
52 test4.textContent = "#t4 { background-image: var(--a); }";
54 var element = document.getElementById("t4");
55 var path = window.location.pathname;
56 var currentDir = path.substring(0, path.lastIndexOf('/'));
57 var imageURL = "http://mochi.test:8888" + currentDir + "/image.png";
59 is(window.getComputedStyle(element).getPropertyValue("background-image"), "url(\"" + imageURL +"\")");
60 },
61 ];
63 function prepareTest() {
64 // Load an external style sheet for test 4.
65 var e = document.createElement("link");
66 e.addEventListener("load", runTest);
67 e.setAttribute("rel", "stylesheet");
68 e.setAttribute("href", "support/external-variable-url.css");
69 document.head.appendChild(e);
70 }
72 function runTest() {
73 tests.forEach(function(fn) { fn(); });
74 SimpleTest.finish();
75 }
77 SimpleTest.waitForExplicitFinish();
78 SpecialPowers.pushPrefEnv({ set: [["layout.css.variables.enabled", true ]] },
79 prepareTest);
80 </script>