layout/style/test/test_css_supports_variables.html@7e26c7da4463
layout/style/test/test_css_supports_variables.html
Wed, 31 Dec 2014 06:55:50 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Wed, 31 Dec 2014 06:55:50 +0100
- changeset 2
- 7e26c7da4463
- permissions
- -rw-r--r--
Added tag UPSTREAM_283F7C6 for changeset ca08bd8f51b2
1 <!DOCTYPE HTML>
2 <html>
3 <!--
4 https://bugzilla.mozilla.org/show_bug.cgi?id=773296
5 -->
6 <head>
7 <title>Test for Bug 773296</title>
8 <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
9 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
10 </head>
11 <body>
12 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=773296">Mozilla Bug 773296</a>
13 <p id="display"></p>
14 <div id="content" style="display: none">
16 </div>
17 <pre id="test">
18 <script type="application/javascript">
20 /** Test for Bug 773296 **/
22 function runTest()
23 {
24 var passingConditions = [
25 "(color:var(--a))",
26 "(color: var(--a))",
27 "(color: var(--a) )",
28 "(color: var( --a ) )",
29 "(color: var(--a, ))",
30 "(color: var(--))",
31 "(color: var(--a,/**/a))",
32 "(color: 1px var(--a))",
33 "(color: var(--a) 1px)",
34 "(color: something 3px url(whereever) calc(var(--a) + 1px))",
35 "(color: var(--a) !important)",
36 "(color: var(--a)var(--b))",
37 "(color: var(--a, var(--b, var(--c, black))))",
38 "(color: var(--a) <!--)",
39 "(color: --> var(--a))",
40 "(color: { [ var(--a) ] })",
41 "(color: [;] var(--a))",
42 "(color: var(--a,(;)))",
43 "(color: VAR(--a))",
44 "(color: var(--0))",
45 "(color: var(--\\30))",
46 "(color: var(--\\d800))",
47 "(color: var(--\\ffffff))",
48 "(color: var(--",
49 "(color: var(--a",
50 "(color: var(--a , ",
51 "(color: var(--a, ",
52 "(color: var(--a, var(--b",
53 "(color: var(--a /* unclosed comment",
54 "(color: var(--a, '",
55 "(color: var(--a, '\\",
56 "(color: var(--a, \\",
58 "(--a:var(--b))",
59 "(--a: var(--b))",
60 "(--a: var(--b) )",
61 "(--a: var( --b ) )",
62 "(--a: var(--b, ))",
63 "(--a: var(--b,/**/a))",
64 "(--a: 1px var(--b))",
65 "(--a: var(--b) 1px)",
66 "(--a: something 3px url(whereever) calc(var(--b) + 1px))",
67 "(--a: var(--b) !important)",
68 "(--a: var(--b)var(--b))",
69 "(--a: var(--b, var(--c, var(--d, black))))",
70 "(--a: var(--b) <!--)",
71 "(--a: --> var(--b))",
72 "(--a: { [ var(--b) ] })",
73 "(--a: [;] var(--b))",
74 "(--a: )",
75 "(--a:var(--a))",
76 "(--0: a)",
77 "(--\\30: a)",
78 "(--\\61: a)",
79 "(--\\d800: a)",
80 "(--\\ffffff: a)",
81 "(--\0: 1)",
82 "(--a: ",
83 "(--a: /* unclosed comment",
84 "(--a: var(--b",
85 "(--a: var(--b, ",
86 "(--a: var(--b, var(--c",
87 "(--a: [{(((",
88 "(--a: '",
89 "(--a: '\\",
90 "(--a: \\",
91 "(--: a)",
92 ];
94 var failingConditions = [
95 "(color: var(--a,))",
96 "(color: var(--a,/**/))",
97 "(color: var(--a,!))",
98 "(color: var(--a,!important))",
99 "(color: var(--a) !important !important)",
100 "(color: var(--a,;))",
101 "(color: var(--a);)",
102 "(color: var(1px))",
103 "(color: var(--a)))",
104 "(color: var(--a) \"\n",
105 "(color: var(--a) url(\"\n",
106 "(color: var(a))",
108 "(--a: var(--b,))",
109 "(--a: var(--b,/**/))",
110 "(--a: var(--b,!))",
111 "(--a: var(--b,!important))",
112 "((--a: var(--b) !important !important))",
113 "(--a: var(--b,;))",
114 "(--a: var(--b);)",
115 "(--a:)",
116 "(--a: var(1px))",
117 "(--a: a))",
118 "(--a: \"\n",
119 "(--a: url(\"\n",
120 "(--a: var(a))",
121 ];
123 var passingDeclarations = [
124 ["color", "var(--a)"],
125 ["color", " var(--a)"],
126 ["color", "var(--a) "],
127 ["color", "var( --a ) "],
128 ["color", "var(--a, )"],
129 ["color", "var(--a,/**/a)"],
130 ["color", "1px var(--a)"],
131 ["color", "var(--a) 1px"],
132 ["color", "something 3px url(whereever) calc(var(--a) + 1px)"],
133 ["color", "var(--a)var(--b)"],
134 ["color", "var(--a, var(--b, var(--c, black)))"],
135 ["color", "var(--a) <!--"],
136 ["color", "--> var(--a)"],
137 ["color", "{ [ var(--a) ] }"],
138 ["color", "[;] var(--a)"],
139 ["color", "var(--a,(;))"],
140 ["color", "VAR(--a)"],
141 ["color", "var(--0)"],
142 ["color", "var(--\\30)"],
143 ["color", "var(--\\d800)"],
144 ["color", "var(--\\ffffff)"],
145 ["color", "var(--a"],
146 ["color", "var(--a , "],
147 ["color", "var(--a, "],
148 ["color", "var(--a, var(--b"],
149 ["color", "var(--a /* unclosed comment"],
150 ["color", "var(--a, '"],
151 ["color", "var(--a, '\\"],
152 ["color", "var(--a, \\"],
153 ["color", "var(--"],
155 ["--a", " var(--b)"],
156 ["--a", "var(--b)"],
157 ["--a", "var(--b) "],
158 ["--a", "var( --b ) "],
159 ["--a", "var(--b, )"],
160 ["--a", "var(--b,/**/a)"],
161 ["--a", "1px var(--b)"],
162 ["--a", "var(--b) 1px"],
163 ["--a", "something 3px url(whereever) calc(var(--b) + 1px)"],
164 ["--a", "var(--b)var(--b)"],
165 ["--a", "var(--b, var(--c, var(--d, black)))"],
166 ["--a", "var(--b) <!--"],
167 ["--a", "--> var(--b)"],
168 ["--a", "{ [ var(--b) ] }"],
169 ["--a", "[;] var(--b)"],
170 ["--a", " "],
171 ["--a", "var(--a)"],
172 ["--0", "a"],
173 ["--\\30", "a"],
174 ["--\\61", "a"],
175 ["--\\d800", "a"],
176 ["--\\ffffff", "a"],
177 ["--\0", "a"],
178 ["--\ud800", "a"],
179 ["--a", "a /* unclosed comment"],
180 ["--a", "var(--b"],
181 ["--a", "var(--b, "],
182 ["--a", "var(--b, var(--c"],
183 ["--a", "[{((("],
184 ["--a ", "a"],
185 ["--a ", "'"],
186 ["--a ", "'\\"],
187 ["--a ", "\\"],
188 ["--", "a"],
189 ];
191 var failingDeclarations = [
192 ["color", "var(--a,)"],
193 ["color", "var(--a,/**/)"],
194 ["color", "var(--a,!)"],
195 ["color", "var(--a,!important)"],
196 ["color", "var(--a,;)"],
197 ["color", "var(--a);"],
198 ["color", "var(1px)"],
199 ["color", "var(--a))"],
200 ["color", "var(--a) \"\n"],
201 ["color", "var(--a) url(\"\n"],
202 ["color", "var(--a) !important"],
203 ["color", "var(--a) !important !important"],
204 ["color", "var(a)"],
206 ["--a", "var(--b,)"],
207 ["--a", "var(--b,/**/)"],
208 ["--a", "var(--b,!)"],
209 ["--a", "var(--b,!important)"],
210 ["--a", "var(--b) !important !important"],
211 ["--a", "var(--b,;)"],
212 ["--a", "var(--b);"],
213 ["--a", ""],
214 ["--a", "var(1px)"],
215 ["(VAR-a", "a"],
216 ["--a", "a)"],
217 ["--a", "\"\n"],
218 ["--a", "url(\"\n"],
219 ["--a", "var(--b))"],
220 ["--a", "var(b)"],
221 ];
223 passingConditions.forEach(function(aCondition) {
224 is(CSS.supports(aCondition), true, "CSS.supports returns true for passing condition \"" + aCondition + "\"");
225 });
227 failingConditions.forEach(function(aCondition) {
228 is(CSS.supports(aCondition), false, "CSS.supports returns false for failing condition \"" + aCondition + "\"");
229 });
231 passingDeclarations.forEach(function(aDeclaration) {
232 is(CSS.supports(aDeclaration[0], aDeclaration[1]), true, "CSS.supports returns true for supported declaration \"" + aDeclaration.join(":") + "\"");
233 });
235 failingDeclarations.forEach(function(aDeclaration) {
236 is(CSS.supports(aDeclaration[0], aDeclaration[1]), false, "CSS.supports returns false for unsupported declaration \"" + aDeclaration.join(":") + "\"");
237 });
239 SimpleTest.finish();
240 }
242 SimpleTest.waitForExplicitFinish();
243 SpecialPowers.pushPrefEnv({ "set": [["layout.css.supports-rule.enabled", true],
244 ["layout.css.variables.enabled", true]] }, runTest);
245 </script>
246 </pre>
247 </body>
248 </html>
