blob: 3490cbf61f34e59d744cd542c4b9a7d22f878f2e [file] [log] [blame]
commit-queue@webkit.org42da6162012-11-05 12:47:46 +00001<!DOCTYPE html>
2<html>
3<head>
4 <style type="text/css">
5 /* Valid viewport syntax with no properties. */
6 @-webkit-viewport {
7 }
8
9 /* Shorthands should be evaluated to the respective attributes. */
10 @-webkit-viewport {
11 width: 400px 500px;
12 height: 200px 300px;
13 }
14
15 /* Shorthands with single value should assume this value for min and max. */
16 @-webkit-viewport {
17 width: 500px;
18 height: 300px;
19 }
20
21 /* Shorthands should override properties if defined later. */
22 @-webkit-viewport {
23 min-width: 100px;
24 min-width: 100px;
25 max-height: 100px;
26 max-height: 100px;
27 width: 500px;
28 height: 300px;
29 }
30
31 /* All valid properties with valid initial values. */
32 @-webkit-viewport {
33 min-width: auto;
34 max-width: auto;
35 min-height: auto;
36 max-height: auto;
37 min-zoom: auto;
38 max-zoom: auto;
39 orientation: auto;
40 user-zoom: zoom;
41 zoom: auto;
42 }
43
44 /* All valid properties with valid values. */
45 @-webkit-viewport {
46 min-width: 50%;
47 max-width: 100px;
48 min-height: device-width;
49 max-height: device-height;
50 min-zoom: 50%;
51 max-zoom: 0.5;
52 orientation: landscape;
53 user-zoom: fixed;
54 zoom: 0.6;
55 }
56
57 /* All valid properties with invalid initial values. Should be empty. */
58 @-webkit-viewport {
59 min-width: zoom;
60 max-width: fixed;
61 min-height: landscape;
62 max-height: portrait;
63 min-zoom: 10px;
64 max-zoom: 50px;
65 orientation: 50%;
66 user-zoom: auto;
67 zoom: device-height;
68 }
69
70 /* Negative numbers should be dropped on zoom. */
71 @-webkit-viewport {
72 min-zoom: -1;
73 max-zoom: -0.5;
74 zoom: -0.6;
75 }
76
77 /* Viewport attributes inside selectors should be dropped. */
78 .foo {
79 min-zoom: auto;
80 max-zoom: auto;
81 orientation: auto;
82 user-zoom: zoom;
83 zoom: auto;
84 }
85
86 /* Invalid attributes among valid should be dropped. */
87 @-webkit-viewport {
88 font-family: sans-serif;
89 min-width: device-width;
90 max-width: device-height;
91 foo: auto;
92 min-height: 500px;
93 max-height: 50%;
94 text-indent: 0;
95 min-zoom: 0.5;
96 max-zoom: 50%;
97 orientation: portrait;
98 color: red;
99 user-zoom: zoom;
100 zoom: 60%;
101 letter-spacing: 0.5em;
102 }
103 </style>
104 <meta charset="utf-8" />
105 <link rel="help" href="http://www.w3.org/TR/css-device-adapt/#syntax" />
106 <script src="../../resources/testharness.js"></script>
107 <script src="../../resources/testharnessreport.js"></script>
108 <script type="text/javascript">
109 var rules = document.styleSheets[0].cssRules;
110
111 test(function() {
112 assert_equals(rules.item(0).cssText, "@-webkit-viewport { }");
113 }, "Rule with no attributes");
114
115 test(function() {
116 assert_equals(rules.item(1).cssText,
117 "@-webkit-viewport {" +
118 " min-width: 400px;" +
119 " max-width: 500px;" +
120 " min-height: 200px;" +
121 " max-height: 300px; }");
122 }, "Shorthands with double value");
123
124 test(function() {
125 assert_equals(rules.item(2).cssText,
126 "@-webkit-viewport {" +
127 " min-width: 500px;" +
128 " max-width: 500px;" +
129 " min-height: 300px;" +
130 " max-height: 300px; }");
131 }, "Shorthands with single value");
132
133 test(function() {
134 assert_equals(rules.item(3).cssText,
135 "@-webkit-viewport {" +
136 " min-width: 500px;" +
137 " max-width: 500px;" +
138 " min-height: 300px;" +
139 " max-height: 300px; }");
140 }, "Shorthands should override properties if defined later");
141
142 test(function() {
143 assert_equals(rules.item(4).cssText,
144 "@-webkit-viewport {" +
145 " min-width: auto;" +
146 " max-width: auto;" +
147 " min-height: auto;" +
148 " max-height: auto;" +
149 " min-zoom: auto;" +
150 " max-zoom: auto;" +
151 " orientation: auto;" +
152 " user-zoom: zoom;" +
153 " zoom: auto; }");
154 }, "All valid properties with valid intial values");
155
156 test(function() {
157 assert_equals(rules.item(5).cssText,
158 "@-webkit-viewport {" +
159 " min-width: 50%;" +
160 " max-width: 100px;" +
161 " min-height: device-width;" +
162 " max-height: device-height;" +
163 " min-zoom: 50%;" +
164 " max-zoom: 0.5;" +
165 " orientation: landscape;" +
166 " user-zoom: fixed;" +
167 " zoom: 0.6; }");
168 }, "All valid properties with valid values");
169
170 test(function() {
171 assert_equals(rules.item(6).cssText, "@-webkit-viewport { }");
172 }, "All valid properties with invalid intial values");
173
174 test(function() {
175 assert_equals(rules.item(7).cssText, "@-webkit-viewport { }");
176 }, "Negative numbers should be dropped on zoom attribute");
177
178 test(function() {
179 assert_equals(rules.item(8).cssText, ".foo { }");
180 }, "Viewport attributes inside selectors should be dropped");
181
182 test(function() {
183 assert_equals(rules.item(9).cssText,
184 "@-webkit-viewport {" +
185 " min-width: device-width;" +
186 " max-width: device-height;" +
187 " min-height: 500px;" +
188 " max-height: 50%;" +
189 " min-zoom: 0.5;" +
190 " max-zoom: 50%;" +
191 " orientation: portrait;" +
192 " user-zoom: zoom;" +
193 " zoom: 60%; }");
194 }, "Invalid attributes among valid should be dropped");
195 </script>
196</head>
197<body>
198 <div id="log"></div>
199</body>
200</html>