getPropertyValue for -webkit-column-rule returns null, should compute the shorthand...
[WebKit-https.git] / LayoutTests / fast / css / getPropertyValue-column-rule.html
1 <!DOCTYPE html>
2 <html>
3   <head>
4     <style>
5       .test {
6         width: 100px;
7         height: 100px;
8         display: inline-block;
9       }
10     </style>
11     <script src="../js/resources/js-test-pre.js"></script>
12     <script>
13       if (window.testRunner)
14         testRunner.dumpAsText();
15     </script>
16   </head>
17   <body>
18     <div id="-webkit-column-rule1" class="test" style="-webkit-column-rule: 10px solid black;"></div>
19     <div id="-webkit-column-rule2" class="test" style="-webkit-column-rule: 10px solid;"></div>
20     <div id="-webkit-column-rule3" class="test" style="-webkit-column-rule: 20px red;"></div>
21     <div id="-webkit-column-rule4" class="test" style="-webkit-column-rule: 10px;"></div>
22     <div id="-webkit-column-rule5" class="test" style="-webkit-column-rule: solid black;"></div>
23     <div id="-webkit-column-rule6" class="test" style="-webkit-column-rule: dashed;"></div>
24     <div id="-webkit-column-rule7" class="test" style="-webkit-column-rule: green;"></div>
25     <div id="-webkit-column-rule8" class="test" style="-webkit-column-rule: foo;"></div>
26     <div id="-webkit-column-rule9" class="test" style="-webkit-column-rule-style: dotted; -webkit-column-rule-width: 10px; -webkit-column-rule-color: black;"></div>
27     <div id="-webkit-column-rule10" class="test" style="-webkit-column-rule-style: dashed; -webkit-column-rule-width: 10px;"></div>
28     <div id="-webkit-column-rule11" class="test" style="-webkit-column-rule-style: dotted; -webkit-column-rule-color: black;"></div>
29     <div id="-webkit-column-rule12" class="test" style="-webkit-column-rule-width: 10px;"></div>
30     <p id="description"></p>
31     <div id="console"></div>
32     <script>
33       description("<a href=\"https://bugs.webkit.org/show_bug.cgi?id=110698\">Bug 110698: getPropertyValue for -webkit-column-rule returns null, should compute the shorthand value</a>");
34       var div1 = document.getElementById("-webkit-column-rule1");
35       shouldBe('div1.style.getPropertyValue("-webkit-column-rule")', "'10px solid black'");
36
37       var div2 = document.getElementById("-webkit-column-rule2");
38       shouldBe('div2.style.getPropertyValue("-webkit-column-rule")', "'10px solid'");
39
40       var div3 = document.getElementById("-webkit-column-rule3");
41       shouldBe('div3.style.getPropertyValue("-webkit-column-rule")', "'20px red'");
42
43       var div4 = document.getElementById("-webkit-column-rule4");
44       shouldBe('div4.style.getPropertyValue("-webkit-column-rule")', "'10px'");
45
46       var div5 = document.getElementById("-webkit-column-rule5");
47       shouldBe('div5.style.getPropertyValue("-webkit-column-rule")', "'solid black'");
48
49       var div6 = document.getElementById("-webkit-column-rule6");
50       shouldBe('div6.style.getPropertyValue("-webkit-column-rule")', "'dashed'");
51
52       var div7 = document.getElementById("-webkit-column-rule7");
53       shouldBe('div7.style.getPropertyValue("-webkit-column-rule")', "'green'");
54
55       var div8 = document.getElementById("-webkit-column-rule8");
56       shouldBe('div8.style.getPropertyValue("-webkit-column-rule")', "null");
57       debug("NOTE: 'foo' is an illegal CSS value for '-webkit-column-rule'.");
58
59       var div9 = document.getElementById("-webkit-column-rule9");
60       shouldBe('div9.style.getPropertyValue("-webkit-column-rule")', "'10px dotted black'");
61
62       debug("NOTE: If only few longhand properties are specified, getPropertyValue for shorthand property returns null.");
63       var div10 = document.getElementById("-webkit-column-rule10");
64       shouldBe('div10.style.getPropertyValue("-webkit-column-rule")', "null");
65
66       var div11 = document.getElementById("-webkit-column-rule11");
67       shouldBe('div11.style.getPropertyValue("-webkit-column-rule")', "null");
68
69       var div12 = document.getElementById("-webkit-column-rule12");
70       shouldBe('div12.style.getPropertyValue("-webkit-column-rule")', "null");
71     </script>
72     <script src="../js/resources/js-test-post.js"></script>
73   </body>
74 </html>