OLD | NEW |
1 <!doctype html> | 1 <!doctype html> |
| 2 <head><script src="../../js/resources/js-test-pre.js"></script></head> |
2 | 3 |
3 <pre style="var-a: override me; var-a: apple; var-b: banana;"></pre> | 4 <div id="test-target" style="var-a: override me; var-a: apple; var-b: banana;"><
/div> |
4 | 5 |
5 <script> | 6 <script> |
6 if (window.testRunner) { | 7 description('This tests Javascript read access to CSS variables in inline styles
.'); |
7 window.testRunner.dumpAsText(); | |
8 } | |
9 | 8 |
10 var pre = document.querySelector("pre"); | 9 var div = document.querySelector('#test-target'); |
11 | 10 |
12 pre.innerText += "Inline style CSS text: " + pre.style.cssText + "\n"; | 11 shouldBeEqualToString('div.style.var.toString()', '[object CSSVariablesMap]'); |
13 pre.innerText += "\n"; | 12 shouldBe('div.style.var === div.style.var', 'true'); |
14 | 13 shouldBeEqualToString('div.style.cssText', 'var-a: apple; var-b: banana;'); |
15 pre.innerText += "Count vars: " + pre.style.var.size + "\n"; | 14 shouldBe('div.style.var.size', '2'); |
16 pre.innerText += "\n"; | 15 shouldBeEqualToString('div.style.var.get("a")', 'apple'); |
17 | 16 shouldBeEqualToString('div.style.var.get("b")', 'banana'); |
18 pre.innerText += "Access vars directly:\n"; | 17 shouldBeEqualToString('div.style.var.get("nonexistant")', ''); |
19 pre.innerText += "a: " + pre.style.var.get("a") + "\n"; | |
20 pre.innerText += "b: " + pre.style.var.get("b") + "\n"; | |
21 pre.innerText += "\n"; | |
22 | |
23 pre.innerText += "Access non existent var:\n"; | |
24 pre.innerText += "z: " + pre.style.var.get("z") + "\n"; | |
25 pre.innerText += "\n"; | |
26 | |
27 pre.innerText += "Setting c to carrot and d to dog...\n"; | |
28 pre.style.var.set("c", "carrot"); | |
29 pre.style.var.set("d", "dog"); | |
30 pre.innerText += "\n"; | |
31 | |
32 pre.innerText += "Count vars: " + pre.style.var.size + "\n"; | |
33 pre.innerText += "\n"; | |
34 | |
35 pre.innerText += "Access vars directly:\n"; | |
36 pre.innerText += "a: " + pre.style.var.get("a") + "\n"; | |
37 pre.innerText += "b: " + pre.style.var.get("b") + "\n"; | |
38 pre.innerText += "c: " + pre.style.var.get("c") + "\n"; | |
39 pre.innerText += "d: " + pre.style.var.get("d") + "\n"; | |
40 | 18 |
41 </script> | 19 </script> |
| 20 <script src="../../js/resources/js-test-post.js"></script> |
OLD | NEW |