feat(view factory): Each css file has its own <style> tag

Author: jbdeboer

lib/core_dom/view_factory.dart

@@ -197,9 +197,12 @@ class _ComponentFactory implements Function {
     TemplateLoader templateLoader = new TemplateLoader(
         async.Future.wait(cssFutures).then((Iterable<String> cssList) {
           if (cssList != null) {
-            var filteredCssList = cssList.where((css) => css != null );
-            shadowDom.setInnerHtml('<style>${filteredCssList.join('')}</style>',
-            treeSanitizer: treeSanitizer);
+            shadowDom.setInnerHtml(
+              cssList
+                .where((css) => css != null)
+                .map((css) => '<style>$css</style>')
+                .join(''),
+              treeSanitizer: treeSanitizer);
           }
           if (viewFuture != null) {
             return viewFuture.then((ViewFactory viewFactory) {

test/core/templateurl_spec.dart

@@ -227,7 +227,7 @@ void main() {
 
         expect(element).toHaveText('.hello{}.world{}Simple!');
         expect(element.children[0].shadowRoot).toHaveHtml(
-            '<style>.hello{}.world{}</style><div log="SIMPLE">Simple!</div>'
+            '<style>.hello{}</style><style>.world{}</style><div log="SIMPLE">Simple!</div>'
         );
         rootScope.apply();
         // Note: There is no ordering.  It is who ever comes off the wire first!