feat(transformers): inline styleUrls to view directive

While creating the ng_deps.dart file for a view inline the styleUrls attribute.
This copies the pattern used for templateUrl, aleviating the need to make an
XHR request for those resources.

closes #2566

modules/angular2/src/transform/directive_processor/visitors.dart

@@ -259,13 +259,31 @@ class AnnotationsTransformVisitor extends ToSourceVisitor {
     }
     var keyString = '${node.name.label}';
     if (keyString == 'templateUrl') {
+      // Inline the templateUrl
       var url = node.expression.accept(_evaluator);
       if (url is String) {
         writer.print("template: r'''");
         writer.asyncPrint(_xhr.get(url));
         writer.print("'''");
         return null;
+      } else {
+        logger.warning('template url is not a String $url');
       }
+    } else if (keyString == 'styleUrls') {
+      // Inline the styleUrls
+      var urls = node.expression.accept(_evaluator);
+      writer.print('styles: const [');
+      for (var url in urls) {
+        if (url is String) {
+          writer.print("r'''");
+          writer.asyncPrint(_xhr.get(url));
+          writer.print("''', ");
+        } else {
+          logger.warning('style url is not a String ${url}');
+        }
+      }
+      writer.print(']');
+      return null;
     }
     return super.visitNamedExpression(node);
   }

modules/angular2/test/transform/directive_processor/absolute_url_expression_files/expected/hello.ng_deps.dart

@@ -14,7 +14,9 @@ void initReflector(reflector) {
       'parameters': const [],
       'annotations': const [
         const Component(selector: 'hello-app'),
-        const View(template: r'''{{greeting}}''')
+        const View(
+            template: r'''{{greeting}}''',
+            styles: const [r'''.greeting { .color: blue; }''',])
       ]
     });
 }

modules/angular2/test/transform/directive_processor/absolute_url_expression_files/hello.dart

@@ -4,5 +4,7 @@ import 'package:angular2/angular2.dart'
     show bootstrap, Component, Directive, View, NgElement;
 
 @Component(selector: 'hello-app')
-@View(templateUrl: 'package:other_package/template.html')
+@View(
+    templateUrl: 'package:other_package/template.html',
+    styleUrls: const ['package:other_package/template.css'])
 class HelloCmp {}

modules/angular2/test/transform/directive_processor/absolute_url_expression_files/template.css

@@ -0,0 +1 @@
+.greeting { .color: blue; }

modules/angular2/test/transform/directive_processor/all_tests.dart

@@ -45,9 +45,17 @@ void allTests() {
   absoluteReader.addAsset(new AssetId('other_package', 'lib/template.html'),
       readFile(
           'directive_processor/absolute_url_expression_files/template.html'));
-  _testNgDeps('should inline `templateUrl` values expressed as absolute urls.',
+  absoluteReader.addAsset(new AssetId('other_package', 'lib/template.css'),
+      readFile(
+          'directive_processor/absolute_url_expression_files/template.css'));
+  _testNgDeps('should inline `templateUrl` and `styleUrls` values expressed as'
+      ' absolute urls.',
       'absolute_url_expression_files/hello.dart', reader: absoluteReader);
 
+  _testNgDeps(
+      'should inline multiple `styleUrls` values expressed as absolute urls.',
+      'multiple_style_urls_files/hello.dart');
+
   _testNgDeps('should inline `templateUrl`s expressed as adjacent strings.',
       'split_url_expression_files/hello.dart');
 

modules/angular2/test/transform/directive_processor/multiple_style_urls_files/expected/hello.ng_deps.dart

@@ -0,0 +1,25 @@
+library examples.src.hello_world.index_common_dart.ng_deps.dart;
+
+import 'hello.dart';
+import 'package:angular2/angular2.dart'
+    show bootstrap, Component, Directive, View, NgElement;
+
+var _visited = false;
+void initReflector(reflector) {
+  if (_visited) return;
+  _visited = true;
+  reflector
+    ..registerType(HelloCmp, {
+      'factory': () => new HelloCmp(),
+      'parameters': const [],
+      'annotations': const [
+        const Component(selector: 'hello-app'),
+        const View(
+            template: r'''{{greeting}}''',
+            styles: const [
+          r'''.greeting { .color: blue; }''',
+          r'''.hello { .color: red; }''',
+        ])
+      ]
+    });
+}

modules/angular2/test/transform/directive_processor/multiple_style_urls_files/hello.dart

@@ -0,0 +1,10 @@
+library examples.src.hello_world.index_common_dart;
+
+import 'package:angular2/angular2.dart'
+    show bootstrap, Component, Directive, View, NgElement;
+
+@Component(selector: 'hello-app')
+@View(
+    templateUrl: 'template.html',
+    styleUrls: const ['template.css', 'template_other.css'])
+class HelloCmp {}

modules/angular2/test/transform/directive_processor/multiple_style_urls_files/template.css

@@ -0,0 +1 @@
+.greeting { .color: blue; }

modules/angular2/test/transform/directive_processor/multiple_style_urls_files/template.html

@@ -0,0 +1 @@
+{{greeting}}

modules/angular2/test/transform/directive_processor/multiple_style_urls_files/template_other.css

@@ -0,0 +1 @@
+.hello { .color: red; }