| 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 css_test; | 5 library css_test; |
| 6 | 6 |
| 7 import 'package:path/path.dart' as path; | 7 import 'package:path/path.dart' as path; |
| 8 import 'package:polymer/src/messages.dart'; | 8 import 'package:polymer/src/messages.dart'; |
| 9 import 'package:polymer/src/utils.dart' as utils; | 9 import 'package:polymer/src/utils.dart' as utils; |
| 10 import 'package:unittest/compact_vm_config.dart'; | 10 import 'package:unittest/compact_vm_config.dart'; |
| (...skipping 32 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 43 compiler.run().then(expectAsync1((e) { | 43 compiler.run().then(expectAsync1((e) { |
| 44 MockFileSystem fs = compiler.fileSystem; | 44 MockFileSystem fs = compiler.fileSystem; |
| 45 expect(fs.readCount, equals({ | 45 expect(fs.readCount, equals({ |
| 46 'index.html': 1, | 46 'index.html': 1, |
| 47 }), reason: 'Actual:\n ${fs.readCount}'); | 47 }), reason: 'Actual:\n ${fs.readCount}'); |
| 48 | 48 |
| 49 var htmlInfo = compiler.info['index.html']; | 49 var htmlInfo = compiler.info['index.html']; |
| 50 expect(htmlInfo.styleSheets.length, 2); | 50 expect(htmlInfo.styleSheets.length, 2); |
| 51 expect(prettyPrintCss(htmlInfo.styleSheets[0]), ''); | 51 expect(prettyPrintCss(htmlInfo.styleSheets[0]), ''); |
| 52 expect(prettyPrintCss(htmlInfo.styleSheets[1]), '.test { color: red; }'); | 52 expect(prettyPrintCss(htmlInfo.styleSheets[1]), '.test { color: red; }'); |
| 53 | |
| 54 var outputs = compiler.output.map((o) => o.path); | |
| 55 expect(outputs, equals([ | |
| 56 'out/index.html.dart', | |
| 57 'out/index.html.dart.map', | |
| 58 'out/index.html_bootstrap.dart', | |
| 59 'out/index.html', | |
| 60 ])); | |
| 61 })); | 53 })); |
| 62 } | 54 } |
| 63 | 55 |
| 64 test_var() { | 56 test_var() { |
| 65 Map createFiles() { | 57 Map createFiles() { |
| 66 return { | 58 return { |
| 67 'index.html': | 59 'index.html': |
| 68 '<!DOCTYPE html>' | 60 '<!DOCTYPE html>' |
| 69 '<html lang="en">' | 61 '<html lang="en">' |
| 70 '<head>' | 62 '<head>' |
| (...skipping 72 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 143 '.test-12 { border: 40px solid blue; } ' | 135 '.test-12 { border: 40px solid blue; } ' |
| 144 '.test-13 { border: 40px solid orange; } ' | 136 '.test-13 { border: 40px solid orange; } ' |
| 145 '.test-14 { border: 40px solid orange; } ' | 137 '.test-14 { border: 40px solid orange; } ' |
| 146 '.test-15 { border: 40px solid blue; } ' | 138 '.test-15 { border: 40px solid blue; } ' |
| 147 '.test-16 { border: 1px 1px 2px 3px solid orange; } ' | 139 '.test-16 { border: 1px 1px 2px 3px solid orange; } ' |
| 148 '.test-17 { border: 1px 1px 2px 3px solid blue; } ' | 140 '.test-17 { border: 1px 1px 2px 3px solid blue; } ' |
| 149 '.test-18 { border: 1px 1px 2px 3px dashed red; } ' | 141 '.test-18 { border: 1px 1px 2px 3px dashed red; } ' |
| 150 '.test-19 { border: 2px 2px 2px 3px dashed red; } ' | 142 '.test-19 { border: 2px 2px 2px 3px dashed red; } ' |
| 151 '.test-20 { border: 3px 2px 2px 2px dashed green; } ' | 143 '.test-20 { border: 3px 2px 2px 2px dashed green; } ' |
| 152 '.test-21 { border: bold 1px 10px blue; }'); | 144 '.test-21 { border: bold 1px 10px blue; }'); |
| 153 var outputs = compiler.output.map((o) => o.path); | |
| 154 expect(outputs, equals([ | |
| 155 'out/index.html.dart', | |
| 156 'out/index.html.dart.map', | |
| 157 'out/index.html_bootstrap.dart', | |
| 158 'out/index.html', | |
| 159 ])); | |
| 160 })); | 145 })); |
| 161 } | 146 } |
| 162 | 147 |
| 163 test_simple_import() { | 148 test_simple_import() { |
| 164 Map createFiles() { | 149 Map createFiles() { |
| 165 return { | 150 return { |
| 166 'foo.css': r'''@main_color: var(b); | 151 'foo.css': r'''@main_color: var(b); |
| 167 @b: var(c); | 152 @b: var(c); |
| 168 @c: red;''', | 153 @c: red;''', |
| 169 'index.html': | 154 'index.html': |
| (...skipping 25 matching lines...) Expand all Loading... |
| 195 }), reason: 'Actual:\n ${fs.readCount}'); | 180 }), reason: 'Actual:\n ${fs.readCount}'); |
| 196 | 181 |
| 197 var cssInfo = compiler.info['foo.css']; | 182 var cssInfo = compiler.info['foo.css']; |
| 198 expect(cssInfo.styleSheets.length, 1); | 183 expect(cssInfo.styleSheets.length, 1); |
| 199 expect(prettyPrintCss(cssInfo.styleSheets[0]), ''); | 184 expect(prettyPrintCss(cssInfo.styleSheets[0]), ''); |
| 200 | 185 |
| 201 var htmlInfo = compiler.info['index.html']; | 186 var htmlInfo = compiler.info['index.html']; |
| 202 expect(htmlInfo.styleSheets.length, 1); | 187 expect(htmlInfo.styleSheets.length, 1); |
| 203 expect(prettyPrintCss(htmlInfo.styleSheets[0]), | 188 expect(prettyPrintCss(htmlInfo.styleSheets[0]), |
| 204 '@import url(foo.css); .test { color: red; }'); | 189 '@import url(foo.css); .test { color: red; }'); |
| 205 | |
| 206 var outputs = compiler.output.map((o) => o.path); | |
| 207 expect(outputs, equals([ | |
| 208 'out/index.html.dart', | |
| 209 'out/index.html.dart.map', | |
| 210 'out/index.html_bootstrap.dart', | |
| 211 'out/foo.css', | |
| 212 'out/index.html', | |
| 213 ])); | |
| 214 })); | 190 })); |
| 215 } | 191 } |
| 216 | 192 |
| 217 test_imports() { | 193 test_imports() { |
| 218 Map createFiles() { | 194 Map createFiles() { |
| 219 return { | 195 return { |
| 220 'first.css': | 196 'first.css': |
| 221 '@import "third.css";' | 197 '@import "third.css";' |
| 222 '@main-width: var(main-width-b);' | 198 '@main-width: var(main-width-b);' |
| 223 '@main-width-b: var(main-width-c);' | 199 '@main-width-b: var(main-width-c);' |
| (...skipping 62 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 286 expect(fourthInfo.styleSheets.length, 1); | 262 expect(fourthInfo.styleSheets.length, 1); |
| 287 expect(prettyPrintCss(fourthInfo.styleSheets[0]), ''); | 263 expect(prettyPrintCss(fourthInfo.styleSheets[0]), ''); |
| 288 | 264 |
| 289 var htmlInfo = compiler.info['index.html']; | 265 var htmlInfo = compiler.info['index.html']; |
| 290 expect(htmlInfo.styleSheets.length, 1); | 266 expect(htmlInfo.styleSheets.length, 1); |
| 291 expect(prettyPrintCss(htmlInfo.styleSheets[0]), | 267 expect(prettyPrintCss(htmlInfo.styleSheets[0]), |
| 292 '@import url(first.css); ' | 268 '@import url(first.css); ' |
| 293 '@import url(second.css); ' | 269 '@import url(second.css); ' |
| 294 '.test-1 { color: red; } ' | 270 '.test-1 { color: red; } ' |
| 295 '.test-2 { width: 100px; }'); | 271 '.test-2 { width: 100px; }'); |
| 296 | |
| 297 var outputs = compiler.output.map((o) => o.path); | |
| 298 expect(outputs, equals([ | |
| 299 'out/index.html.dart', | |
| 300 'out/index.html.dart.map', | |
| 301 'out/index.html_bootstrap.dart', | |
| 302 'out/first.css', | |
| 303 'out/second.css', | |
| 304 'out/third.css', | |
| 305 'out/fourth.css', | |
| 306 'out/index.html', | |
| 307 ])); | |
| 308 })); | 272 })); |
| 309 } | 273 } |
| 310 | 274 |
| 311 test_component_var() { | 275 test_component_var() { |
| 312 Map createFiles() { | 276 Map createFiles() { |
| 313 return { | 277 return { |
| 314 'index.html': '<!DOCTYPE html>' | 278 'index.html': '<!DOCTYPE html>' |
| 315 '<html lang="en">' | 279 '<html lang="en">' |
| 316 '<head>' | 280 '<head>' |
| 317 '<meta charset="utf-8">' | 281 '<meta charset="utf-8">' |
| (...skipping 53 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 371 'foo.css': 1 | 335 'foo.css': 1 |
| 372 }), reason: 'Actual:\n ${fs.readCount}'); | 336 }), reason: 'Actual:\n ${fs.readCount}'); |
| 373 | 337 |
| 374 var cssInfo = compiler.info['foo.css']; | 338 var cssInfo = compiler.info['foo.css']; |
| 375 expect(cssInfo.styleSheets.length, 1); | 339 expect(cssInfo.styleSheets.length, 1); |
| 376 var htmlInfo = compiler.info['foo.html']; | 340 var htmlInfo = compiler.info['foo.html']; |
| 377 expect(htmlInfo.styleSheets.length, 0); | 341 expect(htmlInfo.styleSheets.length, 0); |
| 378 expect(htmlInfo.declaredComponents.length, 1); | 342 expect(htmlInfo.declaredComponents.length, 1); |
| 379 expect(htmlInfo.declaredComponents[0].styleSheets.length, 1); | 343 expect(htmlInfo.declaredComponents[0].styleSheets.length, 1); |
| 380 | 344 |
| 381 var outputs = compiler.output.map((o) => o.path); | 345 // TODO(sigmund,terry): reenable |
| 382 expect(outputs, equals([ | 346 // if (file.path == 'out/index.html.css') { |
| 383 'out/foo.html.dart', | 347 // expect(file.contents, |
| 384 'out/foo.html.dart.map', | 348 // '/* Auto-generated from components style tags. */\n' |
| 385 'out/index.html.dart', | 349 // '/* DO NOT EDIT. */\n\n' |
| 386 'out/index.html.dart.map', | 350 // '/* ==================================================== \n' |
| 387 'out/index.html_bootstrap.dart', | 351 // ' Component x-foo stylesheet \n' |
| 388 'out/foo.css', | 352 // ' ==================================================== */\n' |
| 389 'out/index.html.css', | 353 // '@import "foo.css";\n' |
| 390 'out/index.html', | 354 // '[is="x-foo"] .main {\n' |
| 391 ])); | 355 // ' color: #f00;\n' |
| 392 | 356 // '}\n' |
| 393 for (var file in compiler.output) { | 357 // '[is="x-foo"] .test-background {\n' |
| 394 if (file.path == 'out/index.html.css') { | 358 // ' background: url("http://www.foo.com/bar.png");\n' |
| 395 expect(file.contents, | 359 // '}\n\n'); |
| 396 '/* Auto-generated from components style tags. */\n' | 360 // } else if (file.path == 'out/foo.css') { |
| 397 '/* DO NOT EDIT. */\n\n' | 361 // expect(file.contents, |
| 398 '/* ==================================================== \n' | 362 // '/* Auto-generated from style sheet href = foo.css */\n' |
| 399 ' Component x-foo stylesheet \n' | 363 // '/* DO NOT EDIT. */\n\n\n\n'); |
| 400 ' ==================================================== */\n' | 364 // } |
| 401 '@import "foo.css";\n' | |
| 402 '[is="x-foo"] .main {\n' | |
| 403 ' color: #f00;\n' | |
| 404 '}\n' | |
| 405 '[is="x-foo"] .test-background {\n' | |
| 406 ' background: url("http://www.foo.com/bar.png");\n' | |
| 407 '}\n\n'); | |
| 408 } else if (file.path == 'out/foo.css') { | |
| 409 expect(file.contents, | |
| 410 '/* Auto-generated from style sheet href = foo.css */\n' | |
| 411 '/* DO NOT EDIT. */\n\n\n\n'); | |
| 412 } | |
| 413 } | |
| 414 | 365 |
| 415 // Check for warning messages about var- cycles in no expected order. | 366 // Check for warning messages about var- cycles in no expected order. |
| 416 expect(messages.messages.length, 8); | 367 expect(messages.messages.length, 8); |
| 417 int testBitMap = 0; | 368 int testBitMap = 0; |
| 418 for (var errorMessage in messages.messages) { | 369 for (var errorMessage in messages.messages) { |
| 419 var message = errorMessage.message; | 370 var message = errorMessage.message; |
| 420 if (message.contains('var cycle detected var-def-1')) { | 371 if (message.contains('var cycle detected var-def-1')) { |
| 421 expect(errorMessage.span, isNotNull); | 372 expect(errorMessage.span, isNotNull); |
| 422 expect(errorMessage.span.start.line, 11); | 373 expect(errorMessage.span.start.line, 11); |
| 423 expect(errorMessage.span.start.column, 22); | 374 expect(errorMessage.span.start.column, 22); |
| (...skipping 74 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 498 '</template>', | 449 '</template>', |
| 499 }, messages, scopedCss: true); | 450 }, messages, scopedCss: true); |
| 500 | 451 |
| 501 compiler.run().then(expectAsync1((e) { | 452 compiler.run().then(expectAsync1((e) { |
| 502 MockFileSystem fs = compiler.fileSystem; | 453 MockFileSystem fs = compiler.fileSystem; |
| 503 expect(fs.readCount, equals({ | 454 expect(fs.readCount, equals({ |
| 504 'index.html': 1, | 455 'index.html': 1, |
| 505 'foo.html': 1, | 456 'foo.html': 1, |
| 506 }), reason: 'Actual:\n ${fs.readCount}'); | 457 }), reason: 'Actual:\n ${fs.readCount}'); |
| 507 | 458 |
| 508 var outputs = compiler.output.map((o) => o.path); | 459 // TODO(sigmund, terry): reenable |
| 509 expect(outputs, equals([ | 460 // expect(compiler.output.last.contents, contains( |
| 510 'out/foo.html.dart', | 461 // '<div pseudo="x-foo_0">' |
| 511 'out/foo.html.dart.map', | 462 // '<div>Test</div>' |
| 512 'out/index.html.dart', | 463 // '</div>' |
| 513 'out/index.html.dart.map', | 464 // '<div pseudo="x-foo1_1 x-foo2_2">' |
| 514 'out/index.html_bootstrap.dart', | 465 // '<div>Test</div>' |
| 515 'out/index.html', | 466 // '</div>')); |
| 516 ])); | 467 // expect(compiler.output.last.contents, contains( |
| 517 expect(compiler.output.last.contents, contains( | 468 // '<style>.test > *[pseudo="x-foo_0"] {\n' |
| 518 '<div pseudo="x-foo_0">' | 469 // ' background-color: #f00;\n' |
| 519 '<div>Test</div>' | 470 // '}\n' |
| 520 '</div>' | 471 // '.test > *[pseudo="x-foo1_1"] {\n' |
| 521 '<div pseudo="x-foo1_1 x-foo2_2">' | 472 // ' color: #00f;\n' |
| 522 '<div>Test</div>' | 473 // '}\n' |
| 523 '</div>')); | 474 // '.test > *[pseudo="x-foo2_2"] {\n' |
| 524 expect(compiler.output.last.contents, contains( | 475 // ' color: #008000;\n' |
| 525 '<style>.test > *[pseudo="x-foo_0"] {\n' | 476 // '}' |
| 526 ' background-color: #f00;\n' | 477 // '</style>')); |
| 527 '}\n' | |
| 528 '.test > *[pseudo="x-foo1_1"] {\n' | |
| 529 ' color: #00f;\n' | |
| 530 '}\n' | |
| 531 '.test > *[pseudo="x-foo2_2"] {\n' | |
| 532 ' color: #008000;\n' | |
| 533 '}' | |
| 534 '</style>')); | |
| 535 })); | 478 })); |
| 536 } | 479 } |
| 537 | 480 |
| 538 main() { | 481 main() { |
| 539 useCompactVMConfiguration(); | 482 useCompactVMConfiguration(); |
| 540 | 483 |
| 541 group('css', () { | 484 group('css', () { |
| 542 setUp(() { | 485 setUp(() { |
| 543 utils.path = new path.Builder(style: path.Style.posix); | 486 utils.path = new path.Builder(style: path.Style.posix); |
| 544 }); | 487 }); |
| 545 | 488 |
| 546 tearDown(() { | 489 tearDown(() { |
| 547 utils.path = new path.Builder(); | 490 utils.path = new path.Builder(); |
| 548 }); | 491 }); |
| 549 | 492 |
| 550 test('test_simple_var', test_simple_var); | 493 test('test_simple_var', test_simple_var); |
| 551 test('test_var', test_var); | 494 test('test_var', test_var); |
| 552 test('test_simple_import', test_simple_import); | 495 test('test_simple_import', test_simple_import); |
| 553 test('test_imports', test_imports); | 496 test('test_imports', test_imports); |
| 554 group('test_component_var', test_component_var); | 497 group('test_component_var', test_component_var); |
| 555 test('test_pseudo_element', test_pseudo_element); | 498 test('test_pseudo_element', test_pseudo_element); |
| 556 }); | 499 }); |
| 557 } | 500 } |
| OLD | NEW |