OLD | NEW |
1 // Copyright (c) 2013, the Dart project authors. Please see the AUTHORS file | 1 // Copyright (c) 2013, the Dart project authors. Please see the AUTHORS file |
2 // for details. All rights reserved. Use of this source code is governed by a | 2 // for details. All rights reserved. Use of this source code is governed by a |
3 // BSD-style license that can be found in the LICENSE file. | 3 // BSD-style license that can be found in the LICENSE file. |
4 | 4 |
5 library mixin_test; | 5 library mixin_test; |
6 | 6 |
| 7 import 'package:csslib/src/messages.dart'; |
7 import 'package:test/test.dart'; | 8 import 'package:test/test.dart'; |
8 | 9 |
9 import 'testing.dart'; | 10 import 'testing.dart'; |
10 | 11 |
11 compileAndValidate(String input, String generated) { | 12 compileAndValidate(String input, String generated) { |
12 var errors = []; | 13 var errors = <Message>[]; |
13 var stylesheet = compileCss(input, errors: errors, opts: options); | 14 var stylesheet = compileCss(input, errors: errors, opts: options); |
14 expect(stylesheet != null, true); | 15 expect(stylesheet != null, true); |
15 expect(errors.isEmpty, true, reason: errors.toString()); | 16 expect(errors.isEmpty, true, reason: errors.toString()); |
16 expect(prettyPrint(stylesheet), generated); | 17 expect(prettyPrint(stylesheet), generated); |
17 } | 18 } |
18 | 19 |
19 compilePolyfillAndValidate(String input, String generated) { | 20 compilePolyfillAndValidate(String input, String generated) { |
20 var errors = []; | 21 var errors = <Message>[]; |
21 var stylesheet = polyFillCompileCss(input, errors: errors, opts: options); | 22 var stylesheet = polyFillCompileCss(input, errors: errors, opts: options); |
22 expect(stylesheet != null, true); | 23 expect(stylesheet != null, true); |
23 expect(errors.isEmpty, true, reason: errors.toString()); | 24 expect(errors.isEmpty, true, reason: errors.toString()); |
24 expect(prettyPrint(stylesheet), generated); | 25 expect(prettyPrint(stylesheet), generated); |
25 } | 26 } |
26 | 27 |
27 void topLevelMixin() { | 28 void topLevelMixin() { |
28 compileAndValidate(r''' | 29 compileAndValidate( |
| 30 r''' |
29 @mixin silly-links { | 31 @mixin silly-links { |
30 a { | 32 a { |
31 color: blue; | 33 color: blue; |
32 background-color: red; | 34 background-color: red; |
33 } | 35 } |
34 } | 36 } |
35 | 37 |
36 @include silly-links; | 38 @include silly-links; |
37 ''', r'''a { | 39 ''', |
| 40 r''' |
| 41 a { |
38 color: #00f; | 42 color: #00f; |
39 background-color: #f00; | 43 background-color: #f00; |
40 }'''); | 44 }'''); |
41 } | 45 } |
42 | 46 |
43 void topLevelMixinTwoIncludes() { | 47 void topLevelMixinTwoIncludes() { |
44 compileAndValidate(r''' | 48 compileAndValidate( |
| 49 r''' |
45 @mixin a { | 50 @mixin a { |
46 a { | 51 a { |
47 color: blue; | 52 color: blue; |
48 background-color: red; | 53 background-color: red; |
49 } | 54 } |
50 } | 55 } |
51 @mixin b { | 56 @mixin b { |
52 span { | 57 span { |
53 color: black; | 58 color: black; |
54 background-color: orange; | 59 background-color: orange; |
55 } | 60 } |
56 } | 61 } |
57 @include a; | 62 @include a; |
58 @include b; | 63 @include b; |
59 ''', r'''a { | 64 ''', |
| 65 r''' |
| 66 a { |
60 color: #00f; | 67 color: #00f; |
61 background-color: #f00; | 68 background-color: #f00; |
62 } | 69 } |
63 span { | 70 span { |
64 color: #000; | 71 color: #000; |
65 background-color: #ffa500; | 72 background-color: #ffa500; |
66 }'''); | 73 }'''); |
67 } | 74 } |
68 | 75 |
69 /** Tests top-level mixins that includes another mixin. */ | 76 /** Tests top-level mixins that includes another mixin. */ |
70 void topLevelMixinMultiRulesets() { | 77 void topLevelMixinMultiRulesets() { |
71 compileAndValidate(r''' | 78 compileAndValidate( |
| 79 r''' |
72 @mixin a { | 80 @mixin a { |
73 a { | 81 a { |
74 color: blue; | 82 color: blue; |
75 background-color: red; | 83 background-color: red; |
76 } | 84 } |
77 } | 85 } |
78 @mixin b { | 86 @mixin b { |
79 #foo-id { | 87 #foo-id { |
80 border-top: 1px solid red; | 88 border-top: 1px solid red; |
81 border-bottom: 2px solid green; | 89 border-bottom: 2px solid green; |
82 } | 90 } |
83 } | 91 } |
84 @mixin c { | 92 @mixin c { |
85 span { | 93 span { |
86 color: black; | 94 color: black; |
87 background-color: orange; | 95 background-color: orange; |
88 } | 96 } |
89 @include b; | 97 @include b; |
90 } | 98 } |
91 @include a; | 99 @include a; |
92 @include c; | 100 @include c; |
93 ''', r'''a { | 101 ''', |
| 102 r''' |
| 103 a { |
94 color: #00f; | 104 color: #00f; |
95 background-color: #f00; | 105 background-color: #f00; |
96 } | 106 } |
97 span { | 107 span { |
98 color: #000; | 108 color: #000; |
99 background-color: #ffa500; | 109 background-color: #ffa500; |
100 } | 110 } |
101 #foo-id { | 111 #foo-id { |
102 border-top: 1px solid #f00; | 112 border-top: 1px solid #f00; |
103 border-bottom: 2px solid #008000; | 113 border-bottom: 2px solid #008000; |
104 }'''); | 114 }'''); |
105 } | 115 } |
106 | 116 |
107 void topLevelMixinDeeplyNestedRulesets() { | 117 void topLevelMixinDeeplyNestedRulesets() { |
108 compileAndValidate(r''' | 118 compileAndValidate( |
| 119 r''' |
109 @mixin a { | 120 @mixin a { |
110 a { | 121 a { |
111 color: blue; | 122 color: blue; |
112 background-color: red; | 123 background-color: red; |
113 } | 124 } |
114 } | 125 } |
115 @mixin b { | 126 @mixin b { |
116 #foo-id { | 127 #foo-id { |
117 border-top: 1px solid red; | 128 border-top: 1px solid red; |
118 border-bottom: 2px solid green; | 129 border-bottom: 2px solid green; |
(...skipping 19 matching lines...) Expand all Loading... |
138 @mixin c { | 149 @mixin c { |
139 @include a; | 150 @include a; |
140 span { | 151 span { |
141 color: black; | 152 color: black; |
142 background-color: orange; | 153 background-color: orange; |
143 } | 154 } |
144 @include b; | 155 @include b; |
145 @include d; | 156 @include d; |
146 } | 157 } |
147 @include c; | 158 @include c; |
148 ''', r'''a { | 159 ''', |
| 160 r''' |
| 161 a { |
149 color: #00f; | 162 color: #00f; |
150 background-color: #f00; | 163 background-color: #f00; |
151 } | 164 } |
152 span { | 165 span { |
153 color: #000; | 166 color: #000; |
154 background-color: #ffa500; | 167 background-color: #ffa500; |
155 } | 168 } |
156 #foo-id { | 169 #foo-id { |
157 border-top: 1px solid #f00; | 170 border-top: 1px solid #f00; |
158 border-bottom: 2px solid #008000; | 171 border-bottom: 2px solid #008000; |
159 } | 172 } |
160 a:hover { | 173 a:hover { |
161 cursor: arrow; | 174 cursor: arrow; |
162 } | 175 } |
163 #split-bar:visited { | 176 #split-bar:visited { |
164 color: #808080; | 177 color: #808080; |
165 } | 178 } |
166 #split-bar div { | 179 #split-bar div { |
167 border: 1px solid #d3d3d3; | 180 border: 1px solid #d3d3d3; |
168 }'''); | 181 }'''); |
169 } | 182 } |
170 | 183 |
171 /** Tests selector groups and other combinators. */ | 184 /** Tests selector groups and other combinators. */ |
172 void topLevelMixinSelectors() { | 185 void topLevelMixinSelectors() { |
173 compileAndValidate(r''' | 186 compileAndValidate( |
| 187 r''' |
174 @mixin a { | 188 @mixin a { |
175 a, b { | 189 a, b { |
176 color: blue; | 190 color: blue; |
177 background-color: red; | 191 background-color: red; |
178 } | 192 } |
179 div > span { | 193 div > span { |
180 color: black; | 194 color: black; |
181 background-color: orange; | 195 background-color: orange; |
182 } | 196 } |
183 } | 197 } |
184 | 198 |
185 @include a; | 199 @include a; |
186 ''', r'''a, b { | 200 ''', |
| 201 r''' |
| 202 a, b { |
187 color: #00f; | 203 color: #00f; |
188 background-color: #f00; | 204 background-color: #f00; |
189 } | 205 } |
190 div > span { | 206 div > span { |
191 color: #000; | 207 color: #000; |
192 background-color: #ffa500; | 208 background-color: #ffa500; |
193 }'''); | 209 }'''); |
194 } | 210 } |
195 | 211 |
196 void declSimpleMixin() { | 212 void declSimpleMixin() { |
197 compileAndValidate(r''' | 213 compileAndValidate( |
| 214 r''' |
198 @mixin div-border { | 215 @mixin div-border { |
199 border: 2px dashed red; | 216 border: 2px dashed red; |
200 } | 217 } |
201 div { | 218 div { |
202 @include div-border; | 219 @include div-border; |
203 } | 220 } |
204 ''', r'''div { | 221 ''', |
| 222 r''' |
| 223 div { |
205 border: 2px dashed #f00; | 224 border: 2px dashed #f00; |
206 }'''); | 225 }'''); |
207 } | 226 } |
208 | 227 |
209 void declMixinTwoIncludes() { | 228 void declMixinTwoIncludes() { |
210 compileAndValidate(r''' | 229 compileAndValidate( |
| 230 r''' |
211 @mixin div-border { | 231 @mixin div-border { |
212 border: 2px dashed red; | 232 border: 2px dashed red; |
213 } | 233 } |
214 @mixin div-color { | 234 @mixin div-color { |
215 color: blue; | 235 color: blue; |
216 } | 236 } |
217 div { | 237 div { |
218 @include div-border; | 238 @include div-border; |
219 @include div-color; | 239 @include div-color; |
220 } | 240 } |
221 ''', r'''div { | 241 ''', |
| 242 r''' |
| 243 div { |
222 border: 2px dashed #f00; | 244 border: 2px dashed #f00; |
223 color: #00f; | 245 color: #00f; |
224 }'''); | 246 }'''); |
225 } | 247 } |
226 | 248 |
227 void declMixinNestedIncludes() { | 249 void declMixinNestedIncludes() { |
228 compileAndValidate(r''' | 250 compileAndValidate( |
| 251 r''' |
229 @mixin div-border { | 252 @mixin div-border { |
230 border: 2px dashed red; | 253 border: 2px dashed red; |
231 } | 254 } |
232 @mixin div-padding { | 255 @mixin div-padding { |
233 padding: .5em; | 256 padding: .5em; |
234 } | 257 } |
235 @mixin div-margin { | 258 @mixin div-margin { |
236 margin: 5px; | 259 margin: 5px; |
237 } | 260 } |
238 @mixin div-color { | 261 @mixin div-color { |
239 @include div-padding; | 262 @include div-padding; |
240 color: blue; | 263 color: blue; |
241 @include div-margin; | 264 @include div-margin; |
242 } | 265 } |
243 div { | 266 div { |
244 @include div-border; | 267 @include div-border; |
245 @include div-color; | 268 @include div-color; |
246 } | 269 } |
247 ''', r'''div { | 270 ''', |
| 271 r''' |
| 272 div { |
248 border: 2px dashed #f00; | 273 border: 2px dashed #f00; |
249 padding: .5em; | 274 padding: .5em; |
250 color: #00f; | 275 color: #00f; |
251 margin: 5px; | 276 margin: 5px; |
252 }'''); | 277 }'''); |
253 } | 278 } |
254 | 279 |
255 void declMixinDeeperNestedIncludes() { | 280 void declMixinDeeperNestedIncludes() { |
256 compileAndValidate(r''' | 281 compileAndValidate( |
| 282 r''' |
257 @mixin div-border { | 283 @mixin div-border { |
258 border: 2px dashed red; | 284 border: 2px dashed red; |
259 } | 285 } |
260 @mixin div-padding { | 286 @mixin div-padding { |
261 padding: .5em; | 287 padding: .5em; |
262 } | 288 } |
263 @mixin div-margin { | 289 @mixin div-margin { |
264 margin: 5px; | 290 margin: 5px; |
265 } | 291 } |
266 @mixin div-color { | 292 @mixin div-color { |
267 @include div-padding; | 293 @include div-padding; |
268 @include div-margin; | 294 @include div-margin; |
269 } | 295 } |
270 div { | 296 div { |
271 @include div-border; | 297 @include div-border; |
272 @include div-color; | 298 @include div-color; |
273 } | 299 } |
274 ''', r'''div { | 300 ''', |
| 301 r''' |
| 302 div { |
275 border: 2px dashed #f00; | 303 border: 2px dashed #f00; |
276 padding: .5em; | 304 padding: .5em; |
277 margin: 5px; | 305 margin: 5px; |
278 }'''); | 306 }'''); |
279 } | 307 } |
280 | 308 |
281 void mixinArg() { | 309 void mixinArg() { |
282 compileAndValidate(r''' | 310 compileAndValidate( |
| 311 r''' |
283 @mixin div-border-1 { | 312 @mixin div-border-1 { |
284 border: 2px dashed red; | 313 border: 2px dashed red; |
285 } | 314 } |
286 @mixin div-border-2() { | 315 @mixin div-border-2() { |
287 border: 22px solid blue; | 316 border: 22px solid blue; |
288 } | 317 } |
289 @mixin div-left(@dist) { | 318 @mixin div-left(@dist) { |
290 margin-left: @dist; | 319 margin-left: @dist; |
291 } | 320 } |
292 @mixin div-right(var-margin) { | 321 @mixin div-right(var-margin) { |
293 margin-right: var(margin); | 322 margin-right: var(margin); |
294 } | 323 } |
295 div-1 { | 324 div-1 { |
296 @include div-left(10px); | 325 @include div-left(10px); |
297 @include div-right(100px); | 326 @include div-right(100px); |
298 @include div-border-1; | 327 @include div-border-1; |
299 } | 328 } |
300 div-2 { | 329 div-2 { |
301 @include div-left(20em); | 330 @include div-left(20em); |
302 @include div-right(5in); | 331 @include div-right(5in); |
303 @include div-border-2(); | 332 @include div-border-2(); |
304 } | 333 } |
305 div-3 { | 334 div-3 { |
306 @include div-border-1(); | 335 @include div-border-1(); |
307 } | 336 } |
308 div-4 { | 337 div-4 { |
309 @include div-border-2; | 338 @include div-border-2; |
310 } | 339 } |
311 ''', r'''div-1 { | 340 ''', |
| 341 r''' |
| 342 div-1 { |
312 margin-left: 10px; | 343 margin-left: 10px; |
313 margin-right: 100px; | 344 margin-right: 100px; |
314 border: 2px dashed #f00; | 345 border: 2px dashed #f00; |
315 } | 346 } |
316 div-2 { | 347 div-2 { |
317 margin-left: 20em; | 348 margin-left: 20em; |
318 margin-right: 5in; | 349 margin-right: 5in; |
319 border: 22px solid #00f; | 350 border: 22px solid #00f; |
320 } | 351 } |
321 div-3 { | 352 div-3 { |
322 border: 2px dashed #f00; | 353 border: 2px dashed #f00; |
323 } | 354 } |
324 div-4 { | 355 div-4 { |
325 border: 22px solid #00f; | 356 border: 22px solid #00f; |
326 }'''); | 357 }'''); |
327 } | 358 } |
328 | 359 |
329 void mixinArgs() { | 360 void mixinArgs() { |
330 compileAndValidate(r''' | 361 compileAndValidate( |
| 362 r''' |
331 @mixin box-shadow(@shadows...) { | 363 @mixin box-shadow(@shadows...) { |
332 -moz-box-shadow: @shadows; | 364 -moz-box-shadow: @shadows; |
333 -webkit-box-shadow: @shadows; | 365 -webkit-box-shadow: @shadows; |
334 box-shadow: var(shadows); | 366 box-shadow: var(shadows); |
335 } | 367 } |
336 | 368 |
337 .shadows { | 369 .shadows { |
338 @include box-shadow(0px 4px 5px #666, 2px 6px 10px #999); | 370 @include box-shadow(0px 4px 5px #666, 2px 6px 10px #999); |
339 }''', r''' | 371 }''', |
| 372 r''' |
340 .shadowed { | 373 .shadowed { |
341 -moz-box-shadow: 0px 4px 5px #666, 2px 6px 10px #999; | 374 -moz-box-shadow: 0px 4px 5px #666, 2px 6px 10px #999; |
342 -webkit-box-shadow: 0px 4px 5px #666, 2px 6px 10px #999; | 375 -webkit-box-shadow: 0px 4px 5px #666, 2px 6px 10px #999; |
343 box-shadow: 0px 4px 5px #666, 2px 6px 10px #999; | 376 box-shadow: 0px 4px 5px #666, 2px 6px 10px #999; |
344 } | 377 } |
345 '''); | 378 '''); |
346 } | 379 } |
347 | 380 |
348 void mixinManyArgs() { | 381 void mixinManyArgs() { |
349 compileAndValidate(r''' | 382 compileAndValidate( |
| 383 r''' |
350 @mixin border(@border-values) { | 384 @mixin border(@border-values) { |
351 border: @border-values | 385 border: @border-values |
352 } | 386 } |
353 | 387 |
354 .primary { | 388 .primary { |
355 @include border(3px solid green); | 389 @include border(3px solid green); |
356 } | 390 } |
357 ''', r''' | 391 ''', |
| 392 r''' |
358 .primary { | 393 .primary { |
359 border: 3px solid #008000; | 394 border: 3px solid #008000; |
360 }'''); | 395 }'''); |
361 | 396 |
362 compileAndValidate(r''' | 397 compileAndValidate( |
| 398 r''' |
363 @mixin setup(@border-color, @border-style, @border-size, @color) { | 399 @mixin setup(@border-color, @border-style, @border-size, @color) { |
364 border: @border-size @border-style @border-color; | 400 border: @border-size @border-style @border-color; |
365 color: @color; | 401 color: @color; |
366 } | 402 } |
367 | 403 |
368 .primary { | 404 .primary { |
369 @include setup(red, solid, 5px, blue); | 405 @include setup(red, solid, 5px, blue); |
370 } | 406 } |
371 ''', r''' | 407 ''', |
| 408 r''' |
372 .primary { | 409 .primary { |
373 border: 5px solid #f00; | 410 border: 5px solid #f00; |
374 color: #00f; | 411 color: #00f; |
375 }'''); | 412 }'''); |
376 | 413 |
377 // Test passing a declaration that is multiple parameters. | 414 // Test passing a declaration that is multiple parameters. |
378 compileAndValidate(r''' | 415 compileAndValidate( |
| 416 r''' |
379 @mixin colors(@text, @background, @border) { | 417 @mixin colors(@text, @background, @border) { |
380 color: @text; | 418 color: @text; |
381 background-color: @background; | 419 background-color: @background; |
382 border-color: @border; | 420 border-color: @border; |
383 } | 421 } |
384 | 422 |
385 @values: #ff0000, #00ff00, #0000ff; | 423 @values: #ff0000, #00ff00, #0000ff; |
386 .primary { | 424 .primary { |
387 @include colors(@values); | 425 @include colors(@values); |
388 } | 426 } |
389 ''', r'''var-values: #f00, #0f0, #00f; | 427 ''', |
| 428 r''' |
| 429 var-values: #f00, #0f0, #00f; |
390 | 430 |
391 .primary { | 431 .primary { |
392 color: #f00; | 432 color: #f00; |
393 background-color: #0f0; | 433 background-color: #0f0; |
394 border-color: #00f; | 434 border-color: #00f; |
395 }'''); | 435 }'''); |
396 | 436 |
397 compilePolyfillAndValidate(r''' | 437 compilePolyfillAndValidate( |
| 438 r''' |
398 @mixin colors(@text, @background, @border) { | 439 @mixin colors(@text, @background, @border) { |
399 color: @text; | 440 color: @text; |
400 background-color: @background; | 441 background-color: @background; |
401 border-color: @border; | 442 border-color: @border; |
402 } | 443 } |
403 | 444 |
404 @values: #ff0000, #00ff00, #0000ff; | 445 @values: #ff0000, #00ff00, #0000ff; |
405 .primary { | 446 .primary { |
406 @include colors(@values); | 447 @include colors(@values); |
407 } | 448 } |
408 ''', r'''.primary { | 449 ''', |
| 450 r''' |
| 451 .primary { |
409 color: #f00; | 452 color: #f00; |
410 background-color: #0f0; | 453 background-color: #0f0; |
411 border-color: #00f; | 454 border-color: #00f; |
412 }'''); | 455 }'''); |
413 } | 456 } |
414 | 457 |
415 void badDeclarationInclude() { | 458 void badDeclarationInclude() { |
416 final errors = []; | 459 final errors = <Message>[]; |
417 final input = r''' | 460 final input = r''' |
418 @mixin a { | 461 @mixin a { |
419 #foo-id { | 462 #foo-id { |
420 color: red; | 463 color: red; |
421 } | 464 } |
422 } | 465 } |
423 @mixin b { | 466 @mixin b { |
424 span { | 467 span { |
425 border: 2px dashed red; | 468 border: 2px dashed red; |
426 @include a; | 469 @include a; |
427 } | 470 } |
428 } | 471 } |
429 @include b; | 472 @include b; |
430 '''; | 473 '''; |
431 | 474 |
432 var stylesheet = compileCss(input, errors: errors, opts: options); | 475 var stylesheet = compileCss(input, errors: errors, opts: options); |
433 | 476 |
434 expect(stylesheet != null, true); | 477 expect(stylesheet != null, true); |
435 expect(errors.isNotEmpty, true); | 478 expect(errors.isNotEmpty, true); |
436 expect(errors.length, 1, reason: errors.toString()); | 479 expect(errors.length, 1, reason: errors.toString()); |
437 var error = errors[0]; | 480 var error = errors[0]; |
438 expect(error.message, 'Using top-level mixin a as a declaration'); | 481 expect(error.message, 'Using top-level mixin a as a declaration'); |
439 expect(error.span.start.line, 8); | 482 expect(error.span.start.line, 8); |
440 expect(error.span.end.offset, 105); | 483 expect(error.span.end.offset, 105); |
441 } | 484 } |
442 | 485 |
443 void badTopInclude() { | 486 void badTopInclude() { |
444 final errors = []; | 487 final errors = <Message>[]; |
445 final input = r''' | 488 final input = r''' |
446 @mixin b { | 489 @mixin b { |
447 color: red; | 490 color: red; |
448 } | 491 } |
449 | 492 |
450 @mixin a { | 493 @mixin a { |
451 span { | 494 span { |
452 border: 2px dashed red; | 495 border: 2px dashed red; |
453 } | 496 } |
454 @include b; | 497 @include b; |
455 } | 498 } |
456 | 499 |
457 @include a; | 500 @include a; |
458 '''; | 501 '''; |
459 | 502 |
460 var stylesheet = compileCss(input, errors: errors, opts: options); | 503 var stylesheet = compileCss(input, errors: errors, opts: options); |
461 expect(stylesheet != null, true); | 504 expect(stylesheet != null, true); |
462 expect(errors.length, 1, reason: errors.toString()); | 505 expect(errors.length, 1, reason: errors.toString()); |
463 var error = errors[0]; | 506 var error = errors[0]; |
464 expect(error.message, 'Using declaration mixin b as top-level mixin'); | 507 expect(error.message, 'Using declaration mixin b as top-level mixin'); |
465 expect(error.span.start.line, 8); | 508 expect(error.span.start.line, 8); |
466 expect(error.span.end.offset, 90); | 509 expect(error.span.end.offset, 90); |
467 } | 510 } |
468 | 511 |
469 void emptyMixin() { | 512 void emptyMixin() { |
470 final errors = []; | 513 final errors = <Message>[]; |
471 final input = r''' | 514 final input = r''' |
472 @mixin a { | 515 @mixin a { |
473 } | 516 } |
474 @mixin b { | 517 @mixin b { |
475 border: 2px dashed red; | 518 border: 2px dashed red; |
476 @include a; | 519 @include a; |
477 } | 520 } |
478 div { | 521 div { |
479 @include b; | 522 @include b; |
480 } | 523 } |
481 '''; | 524 '''; |
482 | 525 |
483 var generated = r'''div { | 526 var generated = r''' |
| 527 div { |
484 border: 2px dashed #f00; | 528 border: 2px dashed #f00; |
485 }'''; | 529 }'''; |
486 | 530 |
487 var stylesheet = compileCss(input, errors: errors, opts: options); | 531 var stylesheet = compileCss(input, errors: errors, opts: options); |
488 | 532 |
489 expect(stylesheet != null, true); | 533 expect(stylesheet != null, true); |
490 expect(errors.isEmpty, true, reason: errors.toString()); | 534 expect(errors.isEmpty, true, reason: errors.toString()); |
491 expect(prettyPrint(stylesheet), generated); | 535 expect(prettyPrint(stylesheet), generated); |
492 } | 536 } |
493 | 537 |
494 void undefinedTopLevel() { | 538 void undefinedTopLevel() { |
495 final errors = []; | 539 final errors = <Message>[]; |
496 final input = r''' | 540 final input = r''' |
497 @mixin a { | 541 @mixin a { |
498 @include b; | 542 @include b; |
499 } | 543 } |
500 @mixin b { | 544 @mixin b { |
501 span { | 545 span { |
502 border: 2px dashed red; | 546 border: 2px dashed red; |
503 } | 547 } |
504 @include a; | 548 @include a; |
505 } | 549 } |
506 | 550 |
507 @include b; | 551 @include b; |
508 | 552 |
509 '''; | 553 '''; |
510 | 554 |
511 var stylesheet = compileCss(input, errors: errors, opts: options); | 555 var stylesheet = compileCss(input, errors: errors, opts: options); |
512 | 556 |
513 expect(stylesheet != null, true); | 557 expect(stylesheet != null, true); |
514 expect(errors.isNotEmpty, true); | 558 expect(errors.isNotEmpty, true); |
515 expect(errors.length, 1, reason: errors.toString()); | 559 expect(errors.length, 1, reason: errors.toString()); |
516 var error = errors[0]; | 560 var error = errors[0]; |
517 expect(error.message, 'Undefined mixin b'); | 561 expect(error.message, 'Undefined mixin b'); |
518 expect(error.span.start.line, 1); | 562 expect(error.span.start.line, 1); |
519 expect(error.span.start.offset, 14); | 563 expect(error.span.start.offset, 14); |
520 } | 564 } |
521 | 565 |
522 void undefinedDeclaration() { | 566 void undefinedDeclaration() { |
523 final errors = []; | 567 final errors = <Message>[]; |
524 final input = r''' | 568 final input = r''' |
525 @mixin a { | 569 @mixin a { |
526 @include b; | 570 @include b; |
527 } | 571 } |
528 @mixin b { | 572 @mixin b { |
529 border: 2px dashed red; | 573 border: 2px dashed red; |
530 @include a; | 574 @include a; |
531 } | 575 } |
532 div { | 576 div { |
533 @include b; | 577 @include b; |
534 } | 578 } |
535 '''; | 579 '''; |
536 | 580 |
537 var stylesheet = compileCss(input, errors: errors, opts: options); | 581 var stylesheet = compileCss(input, errors: errors, opts: options); |
538 | 582 |
539 expect(stylesheet != null, true); | 583 expect(stylesheet != null, true); |
540 expect(errors.isNotEmpty, true); | 584 expect(errors.isNotEmpty, true); |
541 expect(errors.length, 1, reason: errors.toString()); | 585 expect(errors.length, 1, reason: errors.toString()); |
542 var error = errors[0]; | 586 var error = errors[0]; |
543 expect(error.message, 'Undefined mixin b'); | 587 expect(error.message, 'Undefined mixin b'); |
544 expect(error.span.start.line, 1); | 588 expect(error.span.start.line, 1); |
545 expect(error.span.start.offset, 14); | 589 expect(error.span.start.offset, 14); |
546 } | 590 } |
547 | 591 |
548 void includeGrammar() { | 592 void includeGrammar() { |
549 compileAndValidate(r''' | 593 compileAndValidate( |
| 594 r''' |
550 @mixin a { | 595 @mixin a { |
551 foo { color: red } | 596 foo { color: red } |
552 } | 597 } |
553 | 598 |
554 @mixin b { | 599 @mixin b { |
555 @include a; | 600 @include a; |
556 @include a; | 601 @include a; |
557 } | 602 } |
558 | 603 |
559 @include b; | 604 @include b; |
560 ''', r'''foo { | 605 ''', |
| 606 r''' |
| 607 foo { |
561 color: #f00; | 608 color: #f00; |
562 } | 609 } |
563 foo { | 610 foo { |
564 color: #f00; | 611 color: #f00; |
565 }'''); | 612 }'''); |
566 | 613 |
567 compileAndValidate(r''' | 614 compileAndValidate( |
| 615 r''' |
568 @mixin a { | 616 @mixin a { |
569 color: red | 617 color: red |
570 } | 618 } |
571 | 619 |
572 foo { | 620 foo { |
573 @include a; | 621 @include a; |
574 @include a | 622 @include a |
575 } | 623 } |
576 ''', r'''foo { | 624 ''', |
| 625 r''' |
| 626 foo { |
577 color: #f00; | 627 color: #f00; |
578 color: #f00; | 628 color: #f00; |
579 }'''); | 629 }'''); |
580 | 630 |
581 var errors = []; | 631 var errors = <Message>[]; |
582 var input = r''' | 632 var input = r''' |
583 @mixin a { | 633 @mixin a { |
584 foo { color: red } | 634 foo { color: red } |
585 } | 635 } |
586 | 636 |
587 @mixin b { | 637 @mixin b { |
588 @include a | 638 @include a |
589 @include a | 639 @include a |
590 } | 640 } |
591 | 641 |
(...skipping 58 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
650 test('multiple args and var decls as args', mixinManyArgs); | 700 test('multiple args and var decls as args', mixinManyArgs); |
651 }); | 701 }); |
652 | 702 |
653 group('Mixin warnings', () { | 703 group('Mixin warnings', () { |
654 test('undefined top-level', undefinedTopLevel); | 704 test('undefined top-level', undefinedTopLevel); |
655 test('undefined declaration', undefinedDeclaration); | 705 test('undefined declaration', undefinedDeclaration); |
656 test('detect bad top-level as declaration', badDeclarationInclude); | 706 test('detect bad top-level as declaration', badDeclarationInclude); |
657 test('detect bad declaration as top-level', badTopInclude); | 707 test('detect bad declaration as top-level', badTopInclude); |
658 }); | 708 }); |
659 } | 709 } |
OLD | NEW |