[polymer] preserve order of scripts in deployment

pkg/polymer/lib/src/build/import_inliner.dart

 // Copyright (c) 2013, 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.
 
 /** Transfomer that inlines polymer-element definitions from html imports. */
 library polymer.src.build.import_inliner;
 
 import 'dart:async';
 import 'dart:convert';
 
 import 'package:barback/barback.dart';
 import 'package:path/path.dart' as path;
 import 'package:html5lib/dom.dart' show
     Document, DocumentFragment, Element, Node;
 import 'package:html5lib/dom_parsing.dart' show TreeVisitor;
 import 'package:source_maps/span.dart';
 
 import 'code_extractor.dart'; // import just for documentation.
 import 'common.dart';
 
 class _HtmlInliner extends PolymerTransformer {
   final TransformOptions options;
   final Transform transform;
   final TransformLogger logger;
   final AssetId docId;
   final seen = new Set<AssetId>();
-  final imported = new DocumentFragment();
   final scriptIds = <AssetId>[];
 
+  static const TYPE_DART = 'application/dart';
+  static const TYPE_JS = 'text/javascript';
+
   _HtmlInliner(this.options, Transform transform)
       : transform = transform,
         logger = transform.logger,
         docId = transform.primaryInput.id;
 
   Future apply() {
     seen.add(docId);
 
     Document document;
 
     return readPrimaryAsHtml(transform).then((document) =>
         _visitImports(document, docId).then((importsFound) {
 
+      var output = transform.primaryInput;
       if (importsFound) {
-        document.body.insertBefore(imported, document.body.firstChild);
-        transform.addOutput(new Asset.fromString(docId, document.outerHtml));
-      } else {
-        transform.addOutput(transform.primaryInput);
+        output = new Asset.fromString(docId, document.outerHtml);
       }
+      transform.addOutput(output);
 
       // We produce a secondary asset with extra information for later phases.
       transform.addOutput(new Asset.fromString(
           docId.addExtension('.scriptUrls'),
           JSON.encode(scriptIds, toEncodable: (id) => id.serialize())));
     }));
   }
 
   /**
    * Visits imports in [document] and add the imported documents to documents.
    * Documents are added in the order they appear, transitive imports are added
    * first.
    *
    * Returns `true` if and only if the document was changed and should be
    * written out.
    */
   Future<bool> _visitImports(Document document, AssetId sourceId) {
     bool changed = false;
 
+    _moveHeadToBody(document);
+
     // Note: we need to preserve the import order in the generated output.
     return Future.forEach(document.querySelectorAll('link'), (Element tag) {
       var rel = tag.attributes['rel'];
       if (rel != 'import' && rel != 'stylesheet') return null;
 
       var href = tag.attributes['href'];
       var id = resolve(sourceId, href, transform.logger, tag.sourceSpan,
           allowAbsolute: rel == 'stylesheet');
 
       if (rel == 'import') {
         changed = true;
-        tag.remove();
-        if (id == null || !seen.add(id)) return null;
-        return _inlineImport(id);
+        if (id == null || !seen.add(id)) {
+          tag.remove();
+          return null;
+        }
+        return _inlineImport(id, tag);
 
       } else if (rel == 'stylesheet') {
         if (id == null) return null;
         changed = true;
+
         return _inlineStylesheet(id, tag);
       }
     }).then((_) => changed);
   }
 
+  /**
+   * To preserve the order of scripts with respect to inlined
+   * link rel=import, we move both of those into the body before we do any
+   * inlining.
+   *
+   * Note: we do this for stylesheets as well to preserve ordering with
+   * respect to eachother, because stylesheets can be pulled in transitively
+   * from imports.
+   */
+  // TODO(jmesserly): vulcanizer doesn't need this because they inline JS
+  // scripts, causing them to be naturally moved as part of the inlining.
+  // Should we do the same? Alternatively could we inline head into head and
+  // body into body and avoid this whole thing?
+  void _moveHeadToBody(Document doc) {
+    var insertionPoint = doc.body.firstChild;
+    for (var node in doc.head.nodes.toList(growable: false)) {
+      if (node is! Element) continue;
+      var tag = node.tagName;
+      var type = node.attributes['type'];
+      var rel = node.attributes['rel'];
+      if (tag == 'style' || tag == 'script' &&
+            (type == null || type == TYPE_JS || type == TYPE_DART) ||
+          tag == 'link' && (rel == 'stylesheet' || rel == 'import')) {
+        // Move the node into the body, where its contents will be placed.
+        doc.body.insertBefore(node, insertionPoint);
+      }
+    }
+  }
+
   // Loads an asset identified by [id], visits its imports and collects its
   // html imports. Then inlines it into the main document.
-  Future _inlineImport(AssetId id) =>
+  Future _inlineImport(AssetId id, Element link) =>
       readAsHtml(id, transform).then((doc) => _visitImports(doc, id).then((_) {
 
     new _UrlNormalizer(transform, id).visit(doc);
     _extractScripts(doc);
 
     // TODO(jmesserly): figure out how this is working in vulcanizer.
     // Do they produce a <body> tag with a <head> and <body> inside?
+    var imported = new DocumentFragment();
     imported.nodes..addAll(doc.head.nodes)..addAll(doc.body.nodes);
+    link.replaceWith(imported);
   }));
 
   Future _inlineStylesheet(AssetId id, Element link) {
     return transform.readInputAsString(id).then((css) {
       var url = spanUrlFor(id, transform);
       css = new _UrlNormalizer(transform, id).visitCss(css, url);
       link.replaceWith(new Element.tag('style')..text = css);
     });
   }
 
   /**
    * Split Dart script tags from all the other elements. Now that Dartium
    * only allows a single script tag per page, we can't inline script
    * tags. Instead, we collect the urls of each script tag so we import
    * them directly from the Dart bootstrap code.
    */
   void _extractScripts(Document document) {
     bool first = true;
     for (var script in document.querySelectorAll('script')) {
-      if (script.attributes['type'] == 'application/dart') {
+      if (script.attributes['type'] == TYPE_DART) {
         script.remove();
 
         // only one Dart script per document is supported in Dartium.
         if (first) {
           first = false;
 
           var src = script.attributes['src'];
           if (src == null) {
             logger.warning('unexpected script without a src url. The '
               'ImportInliner transformer should run after running the '
@@ skipping 122 matching lines @@
   'cite',       // in blockquote, del, ins, q
   'data',       // in object
   'formaction', // in button, input
   'href',       // in a, area, link, base, command
   'icon',       // in command
   'manifest',   // in html
   'poster',     // in video
   'src',        // in audio, embed, iframe, img, input, script, source, track,
                 //    video
 ];