Support for parsing all CSS and producing one CSS file

lib/src/emitters.dart

 // Copyright (c) 2012, the Dart project authors.  Please see the AUTHORS file
 // for details. All rights reserved. Use of this source code is governed by a
 // BSD-style license that can be found in the LICENSE file.
 
 /** Collects several code emitters for the template tool. */
 library emitters;
 
 import 'package:csslib/parser.dart' as css;
 import 'package:csslib/visitor.dart';
 import 'package:html5lib/dom.dart';
@@ skipping 395 matching lines @@
 
     if (info.element.attributes['apply-author-styles'] != null) {
       _context.printer.addLine('if (_root is autogenerated.ShadowRoot) '
           '_root.applyAuthorStyles = true;');
       // TODO(jmesserly): warn at runtime if apply-author-styles was not set,
       // and we don't have Shadow DOM support? In that case, styles won't have
       // proper encapsulation.
     }
 
     if (info.template != null && !elemInfo.childrenCreatedInCode) {
-      // TODO(jmesserly): scoped styles probably don't work when
-      // childrenCreatedInCode is true.
-      if (info.styleSheet != null) {
-        var tag = cssPolyfill ? info.tagName : null;
-        // TODO(jmesserly): csslib+html5lib should work together.  We shouldn't
-        //                  need to call a different function to serialize CSS.
-        //                  Calling innerHTML on a StyleElement should be
-        //                  enought - like a real browser.  CSSOM and DOM
-        //                  should work together in the same tree.
-        // TODO(terry): Consider not emitting <style> tag inside of component.
-        //              Maybe we can generate a .css file that has all the CSS
-        //              polyfill.  The style tag can change the rendering a bit.
-        var styleSheet =
-            '<style>\n'
-            '${emitStyleSheet(info.styleSheet, tag)}'
-            '\n</style>';
-        var template = elemInfo.node;
-        template.insertBefore(new Element.html(styleSheet),
-            template.children[0]);
-      }
-
       _context.statics.add('final', '__shadowTemplate',
           elemInfo.node.sourceSpan,
           "new autogenerated.DocumentFragment.html('''"
           "${escapeDartString(elemInfo.node.innerHtml, triple: true)}"
           "''')");
       _context.printer.addLine(
           "_root.nodes.add(__shadowTemplate.clone(true));");
     }
 
     visit(elemInfo);
@@ skipping 97 matching lines @@
     document.queryAll('script').forEach((tag) {
       var src = tag.attributes["src"];
       if (tag.attributes['type'] == 'application/dart') {
         tag.remove();
       } else if (src != null && rewriteUrls) {
         tag.attributes["src"] = pathInfo.transformUrl(_fileInfo.path, src);
       }
     });
     document.queryAll('link').forEach((tag) {
       var href = tag.attributes['href'];
-      if (tag.attributes['rel'] == 'components') {
+      var rel = tag.attributes['rel'];
+      if (rel == 'components') {

[Siggi Cherem (dart-lang), 2013/03/07 22:14:20]

do you mind adding rel == 'component' too, I think we had fixed the analyzer,
but we didn't fix it here.

[terry, 2013/03/08 20:11:24]

Done.

        tag.remove();
+      } else if (rel == 'stylesheet' && !href.startsWith('http')) {

[Siggi Cherem (dart-lang), 2013/03/07 22:14:20]

let's check also that && cssPolyfill is true, otherwise we don't want to modify
this either.

[terry, 2013/03/08 20:11:24]

I didn't think of this as polyfill but more of how to get the Uri's fixed up but
now that you mention it I think it makes since to make this a part polyfill for
now it's easier to remember that nothing happens if cssPolyfill is off.
On 2013/03/07 22:14:20, Siggi Cherem (dart-lang) wrote:

+        tag.remove();
       } else if (href != null && rewriteUrls) {
        tag.attributes['href'] = pathInfo.transformUrl(_fileInfo.path, href);
       }
     });
 
+    var linkElem = new Element.html('<link rel="stylesheet" type="text/css"'

[Siggi Cherem (dart-lang), 2013/03/07 22:14:20]

likewise - we should only add this new link if cssPolyfill is true.

[terry, 2013/03/08 20:11:24]

Done.

+        ' href="${_fileInfo.path.filename}.css">');
+    document.head.insertBefore(linkElem, null);

[Siggi Cherem (dart-lang), 2013/03/07 22:14:20]

should this be done as the first child so that the css is downloaded as soon as
possible? For instance:
head.insertBefore(linkElem, head.hasChildNodes() ?  head.nodes.first : null);

[terry, 2013/03/08 20:11:24]

Good idea to make it first.
On 2013/03/07 22:14:20, Siggi Cherem (dart-lang) wrote:

 
     var codeInfo = _fileInfo.userCode;
     if (codeInfo == null) {
       assert(transaction == null);
       codeInfo = new DartCodeInfo(null, null, [], 'main(){\n}', null);
     }
 
     if (transaction == null) {
       transaction = new TextEditTransaction(codeInfo.code, codeInfo.sourceFile);
     }
@@ skipping 120 matching lines @@
     }
     typeName = htmlElementExtends[typeName];
   }
   // If we didn't find a DOM setter, and this is a component, set a property on
   // the component.
   if (info.component != null && !name.startsWith('data-')) {
     return 'xtag.${toCamelCase(name)}';
   }
   return "attributes['$name']";
 }