OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <html> | 2 <html> |
3 <head> | 3 <head> |
4 <style type="text/css"> | 4 <style type="text/css"> |
5 /* Valid viewport syntax. */ | 5 /* Valid viewport syntax. */ |
6 @-webkit-viewport { | 6 @viewport { |
7 } | 7 } |
8 | 8 |
9 /* Valid viewport syntax, extras spaces should be ignored. */ | 9 /* Valid viewport syntax, extras spaces should be ignored. */ |
10 @-webkit-viewport { | 10 @viewport { |
11 } | 11 } |
12 | 12 |
13 /* Valid viewport syntax, regular attributes. */ | 13 /* Valid viewport syntax, regular attributes. */ |
14 @-webkit-viewport { | 14 @viewport { |
15 max-height: 200px; | 15 max-height: 200px; |
16 min-height: 200px; | 16 min-height: 200px; |
17 } | 17 } |
18 | 18 |
19 /* Valid viewport syntax, should omit the malformed attribute. */ | 19 /* Valid viewport syntax, should omit the malformed attribute. */ |
20 @-webkit-viewport { | 20 @viewport { |
21 asdasd | 21 asdasd |
22 } | 22 } |
23 | 23 |
24 /* Valid viewport syntax, it is allowed inside media queries. */ | 24 /* Valid viewport syntax, it is allowed inside media queries. */ |
25 @media all { | 25 @media all { |
26 @-webkit-viewport { | 26 @viewport { |
27 } | 27 } |
28 } | 28 } |
29 | 29 |
30 /* Nested viewport rules are not allowed. The inner rule should be ignor
ed. */ | 30 /* Nested viewport rules are not allowed. The inner rule should be ignor
ed. */ |
31 @-webkit-viewport { | 31 @viewport { |
32 max-height: 100px; | 32 max-height: 100px; |
33 min-height: 100px; | 33 min-height: 100px; |
34 | 34 |
35 @-webkit-viewport { | 35 @viewport { |
36 max-height: 200px; | 36 max-height: 200px; |
37 min-height: 200px; | 37 min-height: 200px; |
38 } | 38 } |
39 } | 39 } |
40 | 40 |
41 /* Rules inside a viewport should be ignored. */ | 41 /* Rules inside a viewport should be ignored. */ |
42 @-webkit-viewport { | 42 @viewport { |
43 max-height: 50px; | 43 max-height: 50px; |
44 min-height: 50px; | 44 min-height: 50px; |
45 | 45 |
46 @import url('../../resources/testharness.css'); | 46 @import url('../../resources/testharness.css'); |
47 } | 47 } |
48 | 48 |
49 /* Should ignore unprefixed viewport rule. We need to change this | 49 /* Should ignore unprefixed viewport rule. We need to change this |
50 test if at some point we remove the prefix. */ | 50 test if at some point we remove the prefix. */ |
51 @viewport { | 51 @viewport { |
52 } | 52 } |
53 </style> | 53 </style> |
54 <meta charset="utf-8" /> | 54 <meta charset="utf-8" /> |
55 <link rel="help" href="http://www.w3.org/TR/css-device-adapt/#syntax" /> | 55 <link rel="help" href="http://www.w3.org/TR/css-device-adapt/#syntax" /> |
56 <script src="../../resources/testharness.js"></script> | 56 <script src="../../resources/testharness.js"></script> |
57 <script src="../../resources/testharnessreport.js"></script> | 57 <script src="../../resources/testharnessreport.js"></script> |
58 <script type="text/javascript"> | 58 <script type="text/javascript"> |
59 var rules = document.styleSheets[0].cssRules; | 59 var rules = document.styleSheets[0].cssRules; |
60 | 60 |
61 test(function() { | 61 test(function() { |
62 assert_equals(rules.item(0).cssText, "@-webkit-viewport { }"); | 62 assert_equals(rules.item(0).cssText, "@viewport { }"); |
63 }, "Empty at-rule parsing"); | 63 }, "Empty at-rule parsing"); |
64 | 64 |
65 test(function() { | 65 test(function() { |
66 assert_equals(rules.item(1).cssText, "@-webkit-viewport { }"); | 66 assert_equals(rules.item(1).cssText, "@viewport { }"); |
67 }, "at-rule with extra spaces"); | 67 }, "at-rule with extra spaces"); |
68 | 68 |
69 test(function() { | 69 test(function() { |
70 assert_equals(rules.item(2).cssText, "@-webkit-viewport { max-height
: 200px; min-height: 200px; }"); | 70 assert_equals(rules.item(2).cssText, "@viewport { max-height: 200px;
min-height: 200px; }"); |
71 }, "Rule with attributes"); | 71 }, "Rule with attributes"); |
72 | 72 |
73 test(function() { | 73 test(function() { |
74 assert_equals(rules.item(3).cssText, "@-webkit-viewport { }"); | 74 assert_equals(rules.item(3).cssText, "@viewport { }"); |
75 }, "Rule with malformed attributes"); | 75 }, "Rule with malformed attributes"); |
76 | 76 |
77 test(function() { | 77 test(function() { |
78 assert_equals(rules.item(4).cssText, "@media all { \n @-webkit-view
port { }\n}"); | 78 assert_equals(rules.item(4).cssText, "@media all { \n @viewport { }
\n}"); |
79 }, "Should be accepted inside media queries"); | 79 }, "Should be accepted inside media queries"); |
80 | 80 |
81 test(function() { | 81 test(function() { |
82 assert_equals(rules.item(5).cssText, "@-webkit-viewport { max-height
: 100px; min-height: 100px; }"); | 82 assert_equals(rules.item(5).cssText, "@viewport { max-height: 100px;
min-height: 100px; }"); |
83 }, "Nested viewport rule"); | 83 }, "Nested viewport rule"); |
84 | 84 |
85 test(function() { | 85 test(function() { |
86 assert_equals(rules.item(6).cssText, "@-webkit-viewport { max-height
: 50px; min-height: 50px; }"); | 86 assert_equals(rules.item(6).cssText, "@viewport { max-height: 50px;
min-height: 50px; }"); |
87 }, "Rules inside a viewport rule"); | 87 }, "Rules inside a viewport rule"); |
88 | 88 |
89 // The total number of parsed rules should be 6, meaning that the parser | 89 // The total number of parsed rules should be 6, meaning that the parser |
90 // ignored the last two rules. | 90 // ignored the last two rules. |
91 test(function() { | 91 test(function() { |
92 assert_equals(rules.length, 7) | 92 assert_equals(rules.length, 7) |
93 }, "Should ignore unprefixed at-rule"); | 93 }, "Should ignore unprefixed at-rule"); |
94 </script> | 94 </script> |
95 </head> | 95 </head> |
96 <body> | 96 <body> |
97 <div id="log"></div> | 97 <div id="log"></div> |
98 </body> | 98 </body> |
99 </html> | 99 </html> |
OLD | NEW |