From 42897806629b8a22ec00c62db8d14d856a544d83 Mon Sep 17 00:00:00 2001
From: Ojan Vafai <ojan@chromium.org>
Date: Thu, 9 Apr 2015 11:40:03 -0700
Subject: [PATCH] Stop rendering text inside flex boxes.

Text can only only inside paragraphs and inlines. This patch makes it
so we stop putting such text nodes in the render tree at all if their
parent is not a paragraph or an inline.

This is the final step in making it so that we don't create anonymous
renderers, which fixes a crash in the new custom layout code.

R=eseidel@chromium.org

Review URL: https://codereview.chromium.org/1077473002
---
 engine/src/flutter/examples/home.sky          |  1 +
 ...ound-opaque-clipped-gradients-expected.txt |  2 +-
 .../background-opaque-clipped-gradients.sky   |  2 +-
 .../src/flutter/tests/editing/backspace.sky   |  3 +-
 engine/src/flutter/tests/editing/replace.sky  |  3 +-
 .../src/flutter/tests/editing/selection.sky   |  3 +-
 engine/src/flutter/tests/editing/typing.sky   |  3 +-
 .../tests/harness/reftest-mismatch.sky        |  2 +-
 .../layout/borderbox-percent-padding.sky      |  9 ++--
 .../tests/layout/continuations-expected.txt   | 12 ------
 .../flutter/tests/layout/continuations.sky    |  4 --
 .../layout/custom-dirty-bits-expected.txt     |  4 ++
 .../tests/layout/custom-dirty-bits.sky        | 16 ++++++++
 .../layout/document-elementFromPoint.sky      |  2 +-
 .../tests/layout/ellipsis-expected.txt        | 27 ++++++------
 engine/src/flutter/tests/layout/ellipsis.sky  | 10 +----
 .../layout/position-absolute-expected.txt     |  2 +-
 .../tests/layout/position-absolute-pixels.sky |  9 ++--
 .../tests/layout/position-absolute.sky        |  9 ++--
 engine/src/flutter/tests/lowlevel/filters.sky |  2 +-
 .../tests/lowlevel/hello-world-expected.txt   |  2 +-
 .../flutter/tests/lowlevel/hello-world.sky    |  2 +-
 .../flutter/tests/lowlevel/home-expected.txt  | 14 +++----
 engine/src/flutter/tests/lowlevel/home.sky    | 10 ++---
 .../tests/lowlevel/iframe-expected.txt        | 41 ++++++++-----------
 engine/src/flutter/tests/lowlevel/iframe.sky  |  6 +--
 .../flutter/tests/lowlevel/style-basic.sky    |  6 +--
 engine/src/flutter/tests/lowlevel/text.sky    |  4 +-
 engine/src/flutter/tests/modules/basic.sky    |  2 +-
 .../tests/modules/import-syntax-error.sky     |  2 +-
 .../tests/modules/import-without-export.sky   |  2 +-
 .../tests/modules/imports-can-import.sky      |  2 +-
 .../tests/modules/imports-can-load-404s.sky   |  2 +-
 engine/src/flutter/tests/parser/comments.sky  |  4 +-
 34 files changed, 101 insertions(+), 123 deletions(-)
 delete mode 100644 engine/src/flutter/tests/layout/continuations-expected.txt
 delete mode 100644 engine/src/flutter/tests/layout/continuations.sky
 create mode 100644 engine/src/flutter/tests/layout/custom-dirty-bits-expected.txt
 create mode 100644 engine/src/flutter/tests/layout/custom-dirty-bits.sky

diff --git a/engine/src/flutter/examples/home.sky b/engine/src/flutter/examples/home.sky
index df8866ada6..95c4b55355 100644
--- a/engine/src/flutter/examples/home.sky
+++ b/engine/src/flutter/examples/home.sky
@@ -1,5 +1,6 @@
 #!mojo mojo:sky_viewer
 <style>
+ div { display: paragraph; }
  .h1 { font-size: 2em; margin: 1em; }
  .p { margin: 0.5em 1em; color: #bcd8f5; font-weight: 900; }
 </style>
diff --git a/engine/src/flutter/tests/clipping/background-opaque-clipped-gradients-expected.txt b/engine/src/flutter/tests/clipping/background-opaque-clipped-gradients-expected.txt
index d9a7f68bc2..354bedfcd8 100644
--- a/engine/src/flutter/tests/clipping/background-opaque-clipped-gradients-expected.txt
+++ b/engine/src/flutter/tests/clipping/background-opaque-clipped-gradients-expected.txt
@@ -1,7 +1,7 @@
 layer at (0,0) size 800x600
   RenderView {#document} at (0,0) size 800x600
     RenderFlexibleBox {sky} at (0,0) size 800x238
-      RenderParagraph (anonymous) at (0,0) size 800x38
+      RenderParagraph {p} at (0,0) size 800x38
         RenderText {#text} at (0,0) size 778x38
           text run at (0,0) width 778: "Test passes if the image below shows nested green, blue and yellow squares with a dotted black"
           text run at (0,19) width 59: "border."
diff --git a/engine/src/flutter/tests/clipping/background-opaque-clipped-gradients.sky b/engine/src/flutter/tests/clipping/background-opaque-clipped-gradients.sky
index d14870f2bc..61c373c6e2 100644
--- a/engine/src/flutter/tests/clipping/background-opaque-clipped-gradients.sky
+++ b/engine/src/flutter/tests/clipping/background-opaque-clipped-gradients.sky
@@ -12,6 +12,6 @@ div {
 }
 </style>
 <!-- TODO(ojan): Make this a reftest once we support them. -->
-Test passes if the image below shows nested green, blue and yellow squares with a dotted black border.
+<p>Test passes if the image below shows nested green, blue and yellow squares with a dotted black border.</p>
 <div></div>
 </sky>
diff --git a/engine/src/flutter/tests/editing/backspace.sky b/engine/src/flutter/tests/editing/backspace.sky
index ff3d63b320..e63591e0cb 100644
--- a/engine/src/flutter/tests/editing/backspace.sky
+++ b/engine/src/flutter/tests/editing/backspace.sky
@@ -2,10 +2,9 @@
 <style>
 .blue {
   border: 2px solid blue;
-  display: paragraph;
 }
 </style>
-<div class="blue" contenteditable></div>
+<p class="blue" contenteditable></p>
 <script>
 import "../resources/event-sender.dart" as eventSender;
 import "dart:sky";
diff --git a/engine/src/flutter/tests/editing/replace.sky b/engine/src/flutter/tests/editing/replace.sky
index 2085605348..5d21f88dc3 100644
--- a/engine/src/flutter/tests/editing/replace.sky
+++ b/engine/src/flutter/tests/editing/replace.sky
@@ -2,10 +2,9 @@
 <style>
 .blue {
   border: 2px solid blue;
-  display: paragraph;
 }
 </style>
-<div class="blue" contenteditable></div>
+<p class="blue" contenteditable></p>
 <script>
 import "../resources/event-sender.dart" as eventSender;
 import "dart:sky";
diff --git a/engine/src/flutter/tests/editing/selection.sky b/engine/src/flutter/tests/editing/selection.sky
index 726f931761..25deeb39ae 100644
--- a/engine/src/flutter/tests/editing/selection.sky
+++ b/engine/src/flutter/tests/editing/selection.sky
@@ -2,10 +2,9 @@
 <style>
 .blue {
   border: 2px solid blue;
-  display: paragraph;
 }
 </style>
-<div class="blue" contenteditable></div>
+<p class="blue" contenteditable></p>
 <script>
 import "../resources/event-sender.dart" as eventSender;
 import "dart:sky";
diff --git a/engine/src/flutter/tests/editing/typing.sky b/engine/src/flutter/tests/editing/typing.sky
index a4ed821b35..65ca6b1215 100644
--- a/engine/src/flutter/tests/editing/typing.sky
+++ b/engine/src/flutter/tests/editing/typing.sky
@@ -2,10 +2,9 @@
 <style>
 .blue {
   border: 2px solid blue;
-  display: paragraph;
 }
 </style>
-<div class="blue" contenteditable></div>
+<p class="blue" contenteditable></p>
 <script>
 import "../resources/event-sender.dart" as eventSender;
 import "dart:sky";
diff --git a/engine/src/flutter/tests/harness/reftest-mismatch.sky b/engine/src/flutter/tests/harness/reftest-mismatch.sky
index bb02aeeb76..2afe0fb4be 100644
--- a/engine/src/flutter/tests/harness/reftest-mismatch.sky
+++ b/engine/src/flutter/tests/harness/reftest-mismatch.sky
@@ -1,6 +1,6 @@
 <foo>
 <import src="../resources/run-after-display.sky" />
-This is a mismatch reftest. Should not match.
+<p>This is a mismatch reftest. Should not match.</p>
 <script>
 import "dart:sky.internals" as internals;
 
diff --git a/engine/src/flutter/tests/layout/borderbox-percent-padding.sky b/engine/src/flutter/tests/layout/borderbox-percent-padding.sky
index adb9a4883a..2a6d4263ac 100644
--- a/engine/src/flutter/tests/layout/borderbox-percent-padding.sky
+++ b/engine/src/flutter/tests/layout/borderbox-percent-padding.sky
@@ -5,13 +5,10 @@
     max-width: 300px;
     padding: 0 5%;
   }
-  paragraph {
-    display: paragraph;
-  }
 </style>
 <container style="width: 400px">
   <border-box>
-    <paragraph>Even though the width of 'border-box' stays the same after it reaches 300px, the width available to its children decreases as its padding continues to expand. Because the padding is based off the width before it's constrained by min/max. This tests that we continue to layout the contents of border-box even when its own width remains the same.</paragraph>
+    <p>Even though the width of 'border-box' stays the same after it reaches 300px, the width available to its children decreases as its padding continues to expand. Because the padding is based off the width before it's constrained by min/max. This tests that we continue to layout the contents of border-box even when its own width remains the same.</p>
   </div>
 </container>
 
@@ -25,9 +22,9 @@ void main() {
   initUnit();
 
   test("paragraph width should shrink", () {
-    expect(document.querySelector("paragraph").offsetWidth, equals(260));
+    expect(document.querySelector("p").offsetWidth, equals(260));
     document.querySelector("container").style["width"] = "800px";
-    expect(document.querySelector("paragraph").offsetWidth, equals(220));
+    expect(document.querySelector("p").offsetWidth, equals(220));
   });
 }
 </script>
diff --git a/engine/src/flutter/tests/layout/continuations-expected.txt b/engine/src/flutter/tests/layout/continuations-expected.txt
deleted file mode 100644
index b2000b6c4e..0000000000
--- a/engine/src/flutter/tests/layout/continuations-expected.txt
+++ /dev/null
@@ -1,12 +0,0 @@
-layer at (0,0) size 800x600
-  RenderView {#document} at (0,0) size 800x600
-    RenderFlexibleBox {sky} at (0,0) size 800x19
-      RenderFlexibleBox {div} at (0,0) size 800x19
-        RenderParagraph {span} at (0,0) size 800x19
-          RenderFlexibleBox {div} at (0,0) size 25.22x19
-            RenderParagraph (anonymous) at (0,0) size 25.22x19
-              RenderText {#text} at (0,0) size 26x19
-                text run at (0,0) width 26: "foo"
-          RenderText {#text} at (25,0) size 27x19
-            text run at (25,0) width 27: "bar"
-
diff --git a/engine/src/flutter/tests/layout/continuations.sky b/engine/src/flutter/tests/layout/continuations.sky
deleted file mode 100644
index 2c04baa0f3..0000000000
--- a/engine/src/flutter/tests/layout/continuations.sky
+++ /dev/null
@@ -1,4 +0,0 @@
-<sky>
-    <import src="../resources/dump-as-render-tree.sky" />
-    <div><span style="display: paragraph"><div>foo</div>bar</span></div>
-</sky>
diff --git a/engine/src/flutter/tests/layout/custom-dirty-bits-expected.txt b/engine/src/flutter/tests/layout/custom-dirty-bits-expected.txt
new file mode 100644
index 0000000000..73a6e0ab37
--- /dev/null
+++ b/engine/src/flutter/tests/layout/custom-dirty-bits-expected.txt
@@ -0,0 +1,4 @@
+layer at (0,0) size 800x600
+  RenderView {#document} at (0,0) size 800x600
+    RenderCustomLayout {block} at (0,0) size 0x0
+
diff --git a/engine/src/flutter/tests/layout/custom-dirty-bits.sky b/engine/src/flutter/tests/layout/custom-dirty-bits.sky
new file mode 100644
index 0000000000..ec5b750956
--- /dev/null
+++ b/engine/src/flutter/tests/layout/custom-dirty-bits.sky
@@ -0,0 +1,16 @@
+<import src="../resources/dump-as-render-tree.sky" />
+
+<block>hello</block>
+
+<script>
+import 'dart:sky';
+
+void main() {
+  // This tests custom layout of text nodes inside non-paragraphs.
+  // They shouldn't show up in the render tree at all, so they
+  // don't need laying out.
+  // This test passes if it doesn't crash and the render tree
+  // has no RenderTexts.
+  document.querySelector('block').setLayoutManager(() => {});
+}
+</script>
diff --git a/engine/src/flutter/tests/layout/document-elementFromPoint.sky b/engine/src/flutter/tests/layout/document-elementFromPoint.sky
index eac408e357..130e1c158b 100644
--- a/engine/src/flutter/tests/layout/document-elementFromPoint.sky
+++ b/engine/src/flutter/tests/layout/document-elementFromPoint.sky
@@ -3,7 +3,7 @@
 foo, parent { width: 100px; height: 100px; background: blue; }
 bar { width: 100px; height: 100px; background: purple; }
 parent { display: paragraph; }
-child { background: salmon; }
+child { background: salmon; display: paragraph; }
 canvas { height: 50px; background-color: pink; }
 inline-flex { display: inline-flex; width: 50px; height: 50px; background: green; }
 grand-child { width: 50px; height: 50px; transform: translate3d(100px, 0, 0); background: papayawhip; }
diff --git a/engine/src/flutter/tests/layout/ellipsis-expected.txt b/engine/src/flutter/tests/layout/ellipsis-expected.txt
index 27a0b36487..8ff4f38386 100644
--- a/engine/src/flutter/tests/layout/ellipsis-expected.txt
+++ b/engine/src/flutter/tests/layout/ellipsis-expected.txt
@@ -1,20 +1,17 @@
 layer at (0,0) size 800x600
   RenderView {#document} at (0,0) size 800x600
-    RenderFlexibleBox {sky} at (0,0) size 800x94
-layer at (0,0) size 56x69
-  RenderFlexibleBox {div} at (0,0) size 56x69 [border: (3px solid #0000FF)]
-    RenderParagraph (anonymous) at (3,3) size 50x19
-      RenderText {#text} at (0,0) size 91x19
-        text run at (0,0) width 91: "These lines"
-    RenderParagraph (anonymous) at (3,47) size 50x19
-      RenderText {#text} at (0,0) size 94x19
-        text run at (0,0) width 94: "all ellipsize."
-layer at (3,22) size 56x25 backgroundClip at (3,22) size 50x25
-  RenderParagraph {p} at (3,22) size 56x25 [border: (3px solid #FF0000)]
-    RenderText {#text} at (3,3) size 54x19
-      text run at (3,3) width 54: "should"
-layer at (0,69) size 56x25
-  RenderParagraph {p} at (0,69) size 56x25 [border: (3px solid #FF0000)]
+    RenderFlexibleBox {sky} at (0,0) size 800x50
+layer at (0,0) size 56x25
+  RenderParagraph {p} at (0,0) size 56x25 [border: (3px solid #FF0000)]
+    RenderText {#text} at (3,3) size 96x19
+      text run at (3,3) width 96: "These lines "
+    RenderInline {p} at (0,0) size 54x19 [border: (3px solid #FF0000)]
+      RenderText {#text} at (98,3) size 54x19
+        text run at (98,3) width 54: "should"
+    RenderText {#text} at (151,3) size 99x19
+      text run at (151,3) width 99: " all ellipsize."
+layer at (0,25) size 56x25
+  RenderParagraph {p} at (0,25) size 56x25 [border: (3px solid #FF0000)]
     RenderInline {span} at (0,0) size 117x19
       RenderText {#text} at (3,3) size 117x19
         text run at (3,3) width 117: "As should this."
diff --git a/engine/src/flutter/tests/layout/ellipsis.sky b/engine/src/flutter/tests/layout/ellipsis.sky
index 08288a42a0..96f9918311 100644
--- a/engine/src/flutter/tests/layout/ellipsis.sky
+++ b/engine/src/flutter/tests/layout/ellipsis.sky
@@ -1,16 +1,8 @@
 <sky>
     <import src="../resources/dump-as-render-tree.sky" />
     <style>
-        div {
-            width: 50px;
-            text-overflow: ellipsis;
-            overflow: hidden;
-            white-space: nowrap;
-            border: 3px solid blue;
-        }
         p {
             width: 50px;
-            display: paragraph;
             text-overflow: ellipsis;
             overflow: hidden;
             white-space: nowrap;
@@ -20,6 +12,6 @@
             display: inline;
         }
     </style>
-    <div>These lines <p>should</p> all ellipsize. </div>
+    <p>These lines <p>should</p> all ellipsize. </p>
     <p><span>As should this.</span></p>
 </sky>
diff --git a/engine/src/flutter/tests/layout/position-absolute-expected.txt b/engine/src/flutter/tests/layout/position-absolute-expected.txt
index 49104d7b25..3769d04d04 100644
--- a/engine/src/flutter/tests/layout/position-absolute-expected.txt
+++ b/engine/src/flutter/tests/layout/position-absolute-expected.txt
@@ -7,7 +7,7 @@ layer at (0,0) size 100x100
 layer at (0,0) size 20x20
   RenderFlexibleBox {absolute} at (0,0) size 20x20 [bgcolor=#008000]
 layer at (0,150) size 100x100
-  RenderParagraph {paragraph} at (0,150) size 100x100 [bgcolor=#FFA500]
+  RenderParagraph {p} at (0,150) size 100x100 [bgcolor=#FFA500]
     RenderFlexibleBox {spacer} at (0,0) size 40x40 [bgcolor=#FFEFD5] [border: (5px solid #800080)]
     RenderFlexibleBox {spacer} at (40,0) size 40x40 [bgcolor=#FFEFD5] [border: (5px solid #800080)]
 layer at (0,150) size 20x20
diff --git a/engine/src/flutter/tests/layout/position-absolute-pixels.sky b/engine/src/flutter/tests/layout/position-absolute-pixels.sky
index bf55b3fee0..622c9666a1 100644
--- a/engine/src/flutter/tests/layout/position-absolute-pixels.sky
+++ b/engine/src/flutter/tests/layout/position-absolute-pixels.sky
@@ -1,7 +1,7 @@
 <import src="../resources/run-after-display.sky" />
 
 <style>
-  block, paragraph, flex {
+  block, p, flex {
     width: 100px;
     height: 100px;
     margin-bottom: 50px;
@@ -9,9 +9,8 @@
     transform: translate3d(0, 0, 0);
   }
   block { background: pink; }
-  paragraph {
+  p {
     background: orange;
-    display: paragraph;
   }
   flex {
     background: salmon;
@@ -37,11 +36,11 @@
   <spacer />
 </block>
 
-<paragraph>
+<p>
   <spacer />
   <absolute />
   <spacer />
-</paragraph>
+</p>
 
 <flex>
   <spacer />
diff --git a/engine/src/flutter/tests/layout/position-absolute.sky b/engine/src/flutter/tests/layout/position-absolute.sky
index 3436d32d72..82217a04e7 100644
--- a/engine/src/flutter/tests/layout/position-absolute.sky
+++ b/engine/src/flutter/tests/layout/position-absolute.sky
@@ -1,7 +1,7 @@
 <import src="../resources/dump-as-render-tree.sky" />
 
 <style>
-  block, paragraph, flex {
+  block, p, flex {
     width: 100px;
     height: 100px;
     margin-bottom: 50px;
@@ -9,9 +9,8 @@
     transform: translate3d(0, 0, 0);
   }
   block { background: pink; }
-  paragraph {
+  p {
     background: orange;
-    display: paragraph;
   }
   flex {
     background: salmon;
@@ -37,11 +36,11 @@
   <spacer />
 </block>
 
-<paragraph>
+<p>
   <spacer />
   <absolute />
   <spacer />
-</paragraph>
+</p>
 
 <flex>
   <spacer />
diff --git a/engine/src/flutter/tests/lowlevel/filters.sky b/engine/src/flutter/tests/lowlevel/filters.sky
index 7640a2a866..ff08675a27 100644
--- a/engine/src/flutter/tests/lowlevel/filters.sky
+++ b/engine/src/flutter/tests/lowlevel/filters.sky
@@ -1,7 +1,7 @@
 <foo>
 <import src="../resources/run-after-display.sky" />
 
-<div style="filter: grayscale(1) blur(2px); color: green;">This should be gray and blurred</div>
+<p style="filter: grayscale(1) blur(2px); color: green;">This should be gray and blurred</p>
 
 <script>
 import "dart:sky.internals" as internals;
diff --git a/engine/src/flutter/tests/lowlevel/hello-world-expected.txt b/engine/src/flutter/tests/lowlevel/hello-world-expected.txt
index 291b17840d..0e0843da9a 100644
--- a/engine/src/flutter/tests/lowlevel/hello-world-expected.txt
+++ b/engine/src/flutter/tests/lowlevel/hello-world-expected.txt
@@ -1,7 +1,7 @@
 layer at (0,0) size 800x600
   RenderView {#document} at (0,0) size 800x600
     RenderFlexibleBox {foo} at (0,0) size 800x19
-      RenderParagraph (anonymous) at (0,0) size 800x19
+      RenderParagraph {p} at (0,0) size 800x19
         RenderText {#text} at (0,0) size 99x19
           text run at (0,0) width 99: "Hello World!"
 
diff --git a/engine/src/flutter/tests/lowlevel/hello-world.sky b/engine/src/flutter/tests/lowlevel/hello-world.sky
index 472440db8f..ef051c536a 100644
--- a/engine/src/flutter/tests/lowlevel/hello-world.sky
+++ b/engine/src/flutter/tests/lowlevel/hello-world.sky
@@ -1,4 +1,4 @@
 <foo>
 <import src="../resources/dump-as-render-tree.sky" />
-Hello World!
+<p>Hello World!</p>
 </foo>
diff --git a/engine/src/flutter/tests/lowlevel/home-expected.txt b/engine/src/flutter/tests/lowlevel/home-expected.txt
index 9aa85590f9..a1176fe469 100644
--- a/engine/src/flutter/tests/lowlevel/home-expected.txt
+++ b/engine/src/flutter/tests/lowlevel/home-expected.txt
@@ -1,12 +1,10 @@
 layer at (0,0) size 800x600
   RenderView {#document} at (0,0) size 800x600
     RenderFlexibleBox {div} at (0,0) size 800x137
-      RenderFlexibleBox {div} at (32,32) size 736x38
-        RenderParagraph (anonymous) at (0,0) size 736x38
-          RenderText {#text} at (0,0) size 191x38
-            text run at (0,0) width 191: "about:blank"
-      RenderFlexibleBox {div} at (16,110) size 768x19 [color=#BCD8F5]
-        RenderParagraph (anonymous) at (0,0) size 768x19
-          RenderText {#text} at (0,0) size 152x19
-            text run at (0,0) width 152: "Welcome to Sky!"
+      RenderParagraph {p} at (32,32) size 736x38
+        RenderText {#text} at (0,0) size 191x38
+          text run at (0,0) width 191: "about:blank"
+      RenderParagraph {p} at (16,110) size 768x19 [color=#BCD8F5]
+        RenderText {#text} at (0,0) size 152x19
+          text run at (0,0) width 152: "Welcome to Sky!"
 
diff --git a/engine/src/flutter/tests/lowlevel/home.sky b/engine/src/flutter/tests/lowlevel/home.sky
index c89f9d3dce..ae2da51407 100644
--- a/engine/src/flutter/tests/lowlevel/home.sky
+++ b/engine/src/flutter/tests/lowlevel/home.sky
@@ -1,10 +1,10 @@
 <div>
 <style>
- .h1 { font-size: 2em; margin: 1em; }
- .p { margin: 0.5em 1em; color: #bcd8f5; font-weight: 900; }
+  .h1 { font-size: 2em; margin: 1em; }
+  .p { margin: 0.5em 1em; color: #bcd8f5; font-weight: 900; }
 </style>
-<div class="h1">about:blank</div>
-<div class="p">Welcome to Sky!</div>
+<p class="h1">about:blank</p>
+<p class="p">Welcome to Sky!</p>
 <script>
 import "dart:sky" as sky;
 import "dart:sky.internals" as internals;
@@ -12,7 +12,7 @@ import "dart:sky.internals" as internals;
 // Don't use dump-as-render-tree.sky, we want a test with no imports.
 void main() {
   sky.window.addEventListener('load', (_) =>
-    internals.notifyTestComplete(internals.renderTreeAsText()));  
+    internals.notifyTestComplete(internals.renderTreeAsText()));
 }
 </script>
 </div>
\ No newline at end of file
diff --git a/engine/src/flutter/tests/lowlevel/iframe-expected.txt b/engine/src/flutter/tests/lowlevel/iframe-expected.txt
index d900db41b9..0bf0008e29 100644
--- a/engine/src/flutter/tests/lowlevel/iframe-expected.txt
+++ b/engine/src/flutter/tests/lowlevel/iframe-expected.txt
@@ -1,26 +1,21 @@
 layer at (0,0) size 800x600
   RenderView {#document} at (0,0) size 800x600
-    RenderFlexibleBox {sky} at (0,0) size 800x506
-      RenderFlexibleBox {div} at (0,0) size 800x228
-        RenderParagraph (anonymous) at (0,0) size 800x19
-          RenderText {#text} at (0,0) size 76x19
-            text run at (0,0) width 76: "This is an"
-        RenderParagraph (anonymous) at (0,209) size 800x19
-          RenderText {#text} at (0,0) size 72x19
-            text run at (0,0) width 72: "element."
-      RenderFlexibleBox {div} at (0,228) size 800x200
-        RenderParagraph (anonymous) at (0,0) size 800x19
-          RenderText {#text} at (0,0) size 99x19
-            text run at (0,0) width 99: "Placeholder."
-      RenderFlexibleBox {div} at (0,428) size 800x78
-        RenderParagraph (anonymous) at (0,0) size 800x19
-          RenderText {#text} at (0,0) size 218x19
-            text run at (0,0) width 218: "Small iframe should render"
-        RenderParagraph (anonymous) at (0,59) size 800x19
-          RenderText {#text} at (0,0) size 76x19
-            text run at (0,0) width 76: "correctly."
-layer at (0,19) size 800x190
-  RenderReplaced {iframe} at (0,19) size 800x190 [border: (20px solid #000000)]
-layer at (0,447) size 800x40
-  RenderReplaced {iframe} at (0,19) size 800x40
+    RenderFlexibleBox {sky} at (0,0) size 800x438
+      RenderParagraph {p} at (0,0) size 800x194
+        RenderText {#text} at (0,175) size 81x19
+          text run at (0,175) width 81: "This is an "
+        RenderText {#text} at (420,175) size 77x19
+          text run at (420,175) width 77: " element."
+      RenderParagraph {p} at (0,194) size 800x200
+        RenderText {#text} at (0,0) size 99x19
+          text run at (0,0) width 99: "Placeholder."
+      RenderParagraph {p} at (0,394) size 800x44
+        RenderText {#text} at (0,25) size 223x19
+          text run at (0,25) width 223: "Small iframe should render "
+        RenderText {#text} at (522,25) size 82x19
+          text run at (522,25) width 82: " correctly."
+layer at (81,0) size 340x190
+  RenderReplaced {iframe} at (80.67,0) size 340x190 [border: (20px solid #000000)]
+layer at (223,394) size 300x40
+  RenderReplaced {iframe} at (222.81,0) size 300x40
 
diff --git a/engine/src/flutter/tests/lowlevel/iframe.sky b/engine/src/flutter/tests/lowlevel/iframe.sky
index b9d75546f5..85c98cf138 100644
--- a/engine/src/flutter/tests/lowlevel/iframe.sky
+++ b/engine/src/flutter/tests/lowlevel/iframe.sky
@@ -1,9 +1,9 @@
 <sky>
     <import src="../resources/dump-as-render-tree.sky"/>
     <iframe id="removeMe" src="text.sky">Should not render</iframe>
-    <div>This is an <iframe style="border-style: solid; border-width: 20px" src="abarth.sky">iframe</iframe> element.</div>
-    <div style="height: 200px">Placeholder.</div>
-    <div>Small iframe should render <iframe style="height: 40px" src="abarth.sky">iframe</iframe> correctly.</div>
+    <p>This is an <iframe style="border-style: solid; border-width: 20px" src="abarth.sky">iframe</iframe> element.</p>
+    <p style="height: 200px">Placeholder.</p>
+    <p>Small iframe should render <iframe style="height: 40px" src="abarth.sky">iframe</iframe> correctly.</p>
 
     <script>
     import "dart:sky";
diff --git a/engine/src/flutter/tests/lowlevel/style-basic.sky b/engine/src/flutter/tests/lowlevel/style-basic.sky
index 9c08c714d9..1ae280304c 100644
--- a/engine/src/flutter/tests/lowlevel/style-basic.sky
+++ b/engine/src/flutter/tests/lowlevel/style-basic.sky
@@ -28,7 +28,7 @@
         var i = 1;
         for (Element element = tests.firstElementChild; element != null; element = element.nextElementSibling) {
             var order = int.parse(window.getComputedStyle(element)["order"]);
-            var div = document.createElement("div");
+            var p = document.createElement("p");
             var text = (order == i) ? "PASS" : "FAIL";
             text += ": <"
                 + element.tagName
@@ -39,8 +39,8 @@
                 + order.toString();
             if (order != i)
                 text += " expected " + i;
-            div.textContent = text;
-            log.appendChild(div);
+            p.textContent = text;
+            log.appendChild(p);
             ++i;
         }
     }
diff --git a/engine/src/flutter/tests/lowlevel/text.sky b/engine/src/flutter/tests/lowlevel/text.sky
index b0a4834265..d8866aec8e 100644
--- a/engine/src/flutter/tests/lowlevel/text.sky
+++ b/engine/src/flutter/tests/lowlevel/text.sky
@@ -1,6 +1,6 @@
 <html>
 <import src="../resources/dump-as-text.sky" />
-<body>
+<p>
 This is a dump-as-text test.
-</body>
+</p>
 </html>
diff --git a/engine/src/flutter/tests/modules/basic.sky b/engine/src/flutter/tests/modules/basic.sky
index 97a538f817..2e63df8125 100644
--- a/engine/src/flutter/tests/modules/basic.sky
+++ b/engine/src/flutter/tests/modules/basic.sky
@@ -1,7 +1,7 @@
 <html>
 <import src="../resources/dump-as-text.sky" />
 <import src="resources/pass.sky" as="hello" />
-<div id="result">FAIL</div>
+<p id="result">FAIL</p>
 <script>
 import "dart:sky";
 
diff --git a/engine/src/flutter/tests/modules/import-syntax-error.sky b/engine/src/flutter/tests/modules/import-syntax-error.sky
index 1fbce0416d..91e4f814ea 100644
--- a/engine/src/flutter/tests/modules/import-syntax-error.sky
+++ b/engine/src/flutter/tests/modules/import-syntax-error.sky
@@ -1,7 +1,7 @@
 <html>
 <import src="../resources/dump-as-text.sky" />
 <import src="resources/syntax-error.sky" as="hello" />
-<div id="result">PASS</div>
+<p id="result">PASS</p>
 <script>
 import "dart:sky";
 
diff --git a/engine/src/flutter/tests/modules/import-without-export.sky b/engine/src/flutter/tests/modules/import-without-export.sky
index 93a694fca3..76e7ee3842 100644
--- a/engine/src/flutter/tests/modules/import-without-export.sky
+++ b/engine/src/flutter/tests/modules/import-without-export.sky
@@ -1,7 +1,7 @@
 <html>
 <import src="resources/does-not-export.sky" as="hello" />
 <import src="../resources/dump-as-text.sky" />
-<div id="result">FAIL - Script did not execute</div>
+<p id="result">FAIL - Script did not execute</p>
 <script>
 import "dart:sky";
 
diff --git a/engine/src/flutter/tests/modules/imports-can-import.sky b/engine/src/flutter/tests/modules/imports-can-import.sky
index 34483266cf..4ba52bc6f3 100644
--- a/engine/src/flutter/tests/modules/imports-can-import.sky
+++ b/engine/src/flutter/tests/modules/imports-can-import.sky
@@ -1,6 +1,6 @@
 <html>
 <import src="resources/intermediate.sky" as="chocolate" />
-<div id="result">FAIL</div>
+<p id="result">FAIL</p>
 <script>
 import "dart:sky";
 
diff --git a/engine/src/flutter/tests/modules/imports-can-load-404s.sky b/engine/src/flutter/tests/modules/imports-can-load-404s.sky
index 1a31f2123d..3edd010f92 100644
--- a/engine/src/flutter/tests/modules/imports-can-load-404s.sky
+++ b/engine/src/flutter/tests/modules/imports-can-load-404s.sky
@@ -1,7 +1,7 @@
 <html>
 <import src="resources/does-not-exist.sky" as="hello" />
 <import src="../resources/dump-as-text.sky" />
-<div id="result">FAIL - Script did not execute</div>
+<p id="result">FAIL - Script did not execute</p>
 <script>
 import "dart:sky";
 
diff --git a/engine/src/flutter/tests/parser/comments.sky b/engine/src/flutter/tests/parser/comments.sky
index 7a8d70f79b..a2ce02430c 100644
--- a/engine/src/flutter/tests/parser/comments.sky
+++ b/engine/src/flutter/tests/parser/comments.sky
@@ -1,6 +1,6 @@
 <html>
 <import src="../resources/dump-as-text.sky" />
-<body>
+<p>
 <
 <!
 <!-
@@ -11,5 +11,5 @@
 >
 </
 </>
-</body>
+</p>
 </html>