diff --git a/tests/framework/flights-app-expected.txt b/tests/framework/flights-app-expected.txt
index 15b64883d8e..bf96d685235 100644
--- a/tests/framework/flights-app-expected.txt
+++ b/tests/framework/flights-app-expected.txt
@@ -1,8 +1,8 @@
-layer at (0,0) size 800x600
+layer at (0,0) size 800x663
   RenderView {#document} at (0,0) size 800x600
-layer at (0,0) size 800x551
-  RenderBlock {sky} at (0,0) size 800x551
-    RenderFlexibleBox {flights-app} at (0,0) size 800x551 [color=#2B2B2B] [bgcolor=#494949]
+layer at (0,0) size 800x663
+  RenderBlock {sky} at (0,0) size 800x663
+    RenderFlexibleBox {flights-app} at (0,0) size 800x663 [color=#2B2B2B] [bgcolor=#494949]
       RenderFlexibleBox {app-header} at (0,0) size 800x47 [color=#FFFFFF] [border: none (1px solid #3E77B7) none]
         RenderFlexibleBox {app-title} at (16,8) size 746x30
           RenderBlock {t} at (0,2) size 69.72x26
@@ -10,19 +10,19 @@ layer at (0,0) size 800x551
               RenderText {#text} at (0,0) size 70x25
                 text run at (0,0) width 70: "Search"
         RenderFlexibleBox {app-menu-button} at (762,8) size 30x30
-          RenderImage {img} at (6,15) size 18x0
+          RenderImage {img} at (6,-0.50) size 18x31
       RenderBlock {app-toolbar} at (0,47) size 800x30 [bgcolor=#F6F6F6]
         RenderFlexibleBox {app-search-input} at (8,0) size 784x30
-          RenderBlock {span} at (4,15) size 16x0
-            RenderImage {img} at (0,0) size 16x0
+          RenderBlock {span} at (4,7) size 16x16
+            RenderImage {img} at (0,0) size 16x16
           RenderBlock {span} at (28,4) size 221.84x22
             RenderBlock {t} at (0,0) size 221.84x22
               RenderParagraph (anonymous) at (0,0) size 221.84x22
                 RenderText {#text} at (0,0) size 222x21
                   text run at (0,0) width 222: "flights today to dc by price"
-layer at (0,77) size 800x474
-  RenderBlock {app-scrollable} at (0,77) size 800x474
-    RenderFlexibleBox {app-panel} at (16,16) size 768x246 [bgcolor=#FFFFFF]
+layer at (0,77) size 800x586
+  RenderBlock {app-scrollable} at (0,77) size 800x586
+    RenderFlexibleBox {app-panel} at (16,16) size 768x310 [bgcolor=#FFFFFF]
       RenderFlexibleBox {app-panel-header} at (0,0) size 768x46 [bgcolor=#DEDEDE]
         RenderBlock {div} at (8,14) size 722x18
           RenderBlock {t} at (0,0) size 722x18
@@ -30,64 +30,64 @@ layer at (0,77) size 800x474
               RenderText {#text} at (0,0) size 89x17
                 text run at (0,0) width 89: "SFO to DCA"
         RenderFlexibleBox {app-menu-button} at (730,8) size 30x30
-          RenderImage {img} at (8,15) size 14x0
-      RenderFlexibleBox {app-panel-content} at (0,46) size 768x50
-        RenderBlock {div} at (8,25) size 50x0
-          RenderImage {img} at (0,0) size 50x0
-        RenderBlock {div} at (58,8) size 650.41x34
+          RenderImage {img} at (8,3) size 14x24
+      RenderFlexibleBox {app-panel-content} at (0,46) size 768x66
+        RenderBlock {div} at (8,8) size 50x50
+          RenderImage {img} at (0,0) size 50x50
+        RenderBlock {div} at (58,16) size 650.41x34
           RenderBlock {t} at (8,8) size 634.41x18
             RenderParagraph (anonymous) at (0,0) size 634.41x18
               RenderText {#text} at (0,0) size 105x17
                 text run at (0,0) width 105: "Virgin America"
-        RenderBlock {div} at (708.41,8) size 51.59x34 [color=#ABB4B6]
+        RenderBlock {div} at (708.41,16) size 51.59x34 [color=#ABB4B6]
           RenderBlock {t} at (8,8) size 35.59x18
             RenderBlock {a} at (0,0) size 35.59x18 [color=#1155CC]
               RenderParagraph (anonymous) at (0,0) size 35.59x18
                 RenderText {#text} at (0,0) size 36x17
                   text run at (0,0) width 36: "$800"
-      RenderFlexibleBox {app-panel-content} at (0,96) size 768x50
-        RenderBlock {div} at (8,25) size 50x0
-          RenderImage {img} at (0,0) size 50x0
-        RenderBlock {div} at (58,8) size 650.41x34
+      RenderFlexibleBox {app-panel-content} at (0,112) size 768x66
+        RenderBlock {div} at (8,8) size 50x50
+          RenderImage {img} at (0,0) size 50x50
+        RenderBlock {div} at (58,16) size 650.41x34
           RenderBlock {t} at (8,8) size 634.41x18
             RenderParagraph (anonymous) at (0,0) size 634.41x18
               RenderText {#text} at (0,0) size 105x17
                 text run at (0,0) width 105: "British Airways"
-        RenderBlock {div} at (708.41,8) size 51.59x34 [color=#ABB4B6]
+        RenderBlock {div} at (708.41,16) size 51.59x34 [color=#ABB4B6]
           RenderBlock {t} at (8,8) size 35.59x18
             RenderBlock {a} at (0,0) size 35.59x18 [color=#1155CC]
               RenderParagraph (anonymous) at (0,0) size 35.59x18
                 RenderText {#text} at (0,0) size 36x17
                   text run at (0,0) width 36: "$700"
-      RenderFlexibleBox {app-panel-content} at (0,146) size 768x50
-        RenderBlock {div} at (8,25) size 50x0
-          RenderImage {img} at (0,0) size 50x0
-        RenderBlock {div} at (58,8) size 650.41x34
+      RenderFlexibleBox {app-panel-content} at (0,178) size 768x66
+        RenderBlock {div} at (8,8) size 50x50
+          RenderImage {img} at (0,0) size 50x50
+        RenderBlock {div} at (58,16) size 650.41x34
           RenderBlock {t} at (8,8) size 634.41x18
             RenderParagraph (anonymous) at (0,0) size 634.41x18
               RenderText {#text} at (0,0) size 47x17
                 text run at (0,0) width 47: "United"
-        RenderBlock {div} at (708.41,8) size 51.59x34 [color=#ABB4B6]
+        RenderBlock {div} at (708.41,16) size 51.59x34 [color=#ABB4B6]
           RenderBlock {t} at (8,8) size 35.59x18
             RenderBlock {a} at (0,0) size 35.59x18 [color=#1155CC]
               RenderParagraph (anonymous) at (0,0) size 35.59x18
                 RenderText {#text} at (0,0) size 36x17
                   text run at (0,0) width 36: "$667"
-      RenderFlexibleBox {app-panel-content} at (0,196) size 768x50
-        RenderBlock {div} at (8,25) size 50x0
-          RenderImage {img} at (0,0) size 50x0
-        RenderBlock {div} at (58,8) size 650.41x34
+      RenderFlexibleBox {app-panel-content} at (0,244) size 768x66
+        RenderBlock {div} at (8,8) size 50x50
+          RenderImage {img} at (0,0) size 50x50
+        RenderBlock {div} at (58,16) size 650.41x34
           RenderBlock {t} at (8,8) size 634.41x18
             RenderParagraph (anonymous) at (0,0) size 634.41x18
               RenderText {#text} at (0,0) size 38x17
                 text run at (0,0) width 38: "Delta"
-        RenderBlock {div} at (708.41,8) size 51.59x34 [color=#ABB4B6]
+        RenderBlock {div} at (708.41,16) size 51.59x34 [color=#ABB4B6]
           RenderBlock {t} at (8,8) size 35.59x18
             RenderBlock {a} at (0,0) size 35.59x18 [color=#1155CC]
               RenderParagraph (anonymous) at (0,0) size 35.59x18
                 RenderText {#text} at (0,0) size 36x17
                   text run at (0,0) width 36: "$450"
-    RenderFlexibleBox {app-panel} at (16,278) size 768x196 [bgcolor=#FFFFFF]
+    RenderFlexibleBox {app-panel} at (16,342) size 768x244 [bgcolor=#FFFFFF]
       RenderFlexibleBox {app-panel-header} at (0,0) size 768x46 [bgcolor=#DEDEDE]
         RenderBlock {div} at (8,14) size 722x18
           RenderBlock {t} at (0,0) size 722x18
@@ -95,44 +95,44 @@ layer at (0,77) size 800x474
               RenderText {#text} at (0,0) size 87x17
                 text run at (0,0) width 87: "SJC to DCA"
         RenderFlexibleBox {app-menu-button} at (730,8) size 30x30
-          RenderImage {img} at (8,15) size 14x0
-      RenderFlexibleBox {app-panel-content} at (0,46) size 768x50
-        RenderBlock {div} at (8,25) size 50x0
-          RenderImage {img} at (0,0) size 50x0
-        RenderBlock {div} at (58,8) size 641.50x34
+          RenderImage {img} at (8,3) size 14x24
+      RenderFlexibleBox {app-panel-content} at (0,46) size 768x66
+        RenderBlock {div} at (8,8) size 50x50
+          RenderImage {img} at (0,0) size 50x50
+        RenderBlock {div} at (58,16) size 641.50x34
           RenderBlock {t} at (8,8) size 625.50x18
             RenderParagraph (anonymous) at (0,0) size 625.50x18
               RenderText {#text} at (0,0) size 105x17
                 text run at (0,0) width 105: "Virgin America"
-        RenderBlock {div} at (699.50,8) size 60.50x34 [color=#ABB4B6]
+        RenderBlock {div} at (699.50,16) size 60.50x34 [color=#ABB4B6]
           RenderBlock {t} at (8,8) size 44.50x18
             RenderBlock {a} at (0,0) size 44.50x18 [color=#1155CC]
               RenderParagraph (anonymous) at (0,0) size 44.50x18
                 RenderText {#text} at (0,0) size 45x17
                   text run at (0,0) width 45: "$1500"
-      RenderFlexibleBox {app-panel-content} at (0,96) size 768x50
-        RenderBlock {div} at (8,25) size 50x0
-          RenderImage {img} at (0,0) size 50x0
-        RenderBlock {div} at (58,8) size 650.41x34
+      RenderFlexibleBox {app-panel-content} at (0,112) size 768x66
+        RenderBlock {div} at (8,8) size 50x50
+          RenderImage {img} at (0,0) size 50x50
+        RenderBlock {div} at (58,16) size 650.41x34
           RenderBlock {t} at (8,8) size 634.41x18
             RenderParagraph (anonymous) at (0,0) size 634.41x18
               RenderText {#text} at (0,0) size 49x17
                 text run at (0,0) width 49: "jetBlue"
-        RenderBlock {div} at (708.41,8) size 51.59x34 [color=#ABB4B6]
+        RenderBlock {div} at (708.41,16) size 51.59x34 [color=#ABB4B6]
           RenderBlock {t} at (8,8) size 35.59x18
             RenderBlock {a} at (0,0) size 35.59x18 [color=#1155CC]
               RenderParagraph (anonymous) at (0,0) size 35.59x18
                 RenderText {#text} at (0,0) size 36x17
                   text run at (0,0) width 36: "$650"
-      RenderFlexibleBox {app-panel-content} at (0,146) size 768x50
-        RenderBlock {div} at (8,25) size 50x0
-          RenderImage {img} at (0,0) size 50x0
-        RenderBlock {div} at (58,8) size 650.41x34
+      RenderFlexibleBox {app-panel-content} at (0,178) size 768x66
+        RenderBlock {div} at (8,8) size 50x50
+          RenderImage {img} at (0,0) size 50x50
+        RenderBlock {div} at (58,16) size 650.41x34
           RenderBlock {t} at (8,8) size 634.41x18
             RenderParagraph (anonymous) at (0,0) size 634.41x18
               RenderText {#text} at (0,0) size 47x17
                 text run at (0,0) width 47: "United"
-        RenderBlock {div} at (708.41,8) size 51.59x34 [color=#ABB4B6]
+        RenderBlock {div} at (708.41,16) size 51.59x34 [color=#ABB4B6]
           RenderBlock {t} at (8,8) size 35.59x18
             RenderBlock {a} at (0,0) size 35.59x18 [color=#1155CC]
               RenderParagraph (anonymous) at (0,0) size 35.59x18
diff --git a/tests/framework/flights-app.sky b/tests/framework/flights-app.sky
index e42ff36e275..826ab772913 100644
--- a/tests/framework/flights-app.sky
+++ b/tests/framework/flights-app.sky
@@ -1,10 +1,32 @@
 <sky>
+  <import src="../resources/run-after-display.sky" as="runAfterDisplay" />
   <import src="/sky/examples/flights-app/flights-app.sky" />
   <script>
+  var app;
+
+  function imagesLoaded() {
+    var images = app.shadowRoot.querySelectorAll('img');
+    for (var i = 0; i < images.length; i++) {
+      if (!images[i].complete)
+        return false;
+    }
+    return true;
+  }
+
+  function checkImagesLoaded() {
+    if (!imagesLoaded()) {
+      setTimeout(checkImagesLoaded, 10);
+      return;
+    }
+    runAfterDisplay(function() {
+      internals.notifyTestComplete(internals.renderTreeAsText());
+    });
+  }
+
   addEventListener("load", function() {
-    var app = document.createElement("flights-app");
+    app = document.createElement("flights-app");
     document.querySelector("sky").appendChild(app);
-    internals.notifyTestComplete(internals.renderTreeAsText());
+    checkImagesLoaded();
   });
   </script>
 </sky>