コメントをもらって改めて該当箇所の解説を読み直したら自分の解釈間違いがわかって解決した。
HTML5 Weekly でこの記事をみつけた。 Introduction to HTML Imports — WebComponents.org
Execution order の説明の、この箇所がわからなかった。
Script inside an html import behave just like a script tag with a defer attribute. In the example code below, index.html will execute script1.js and script2.js inside component.html before executing script3.js.
defer 属性と同じように振る舞うのなら、 html import の中の script タグはメインドキュメントの script タグよりも後に実行されるはずでは？
defer の振る舞いは理解できる。
https://dl.dropboxusercontent.com/u/4289117/htmlimports/02.html
実行に時間のかかる script タグがあると、ブラウザのレンダリングはそこで一旦止まるので、最初に出現した script 要素のあとにある DIV 要素はしばらく表示されない。 JavaScript コンソールには、 a -> b の順に出力される。 Google Chrome より Firefox のほうが、表示のされ方が期待したものに近い。
https://dl.dropboxusercontent.com/u/4289117/htmlimports/03.html
defer 属性つきの script の実行は遅延されるため、最初に出現した defer 属性つきの script タグの直後にある DIV 要素は即座にレンダリングされる。 JavaScript コンソールには、 b -> a の順に出力される。
https://dl.dropboxusercontent.com/u/4289117/htmlimports/01.html
defer と同じ振る舞いになるんだとしたら、 JavaScript コンソールには b -> a の順に出力されるだろう、と期待したが、実際には a -> b の順に出力された。
Google Chrome バージョン 39.0.2171.95 (64-bit)
