Update web-platform-tests to revision 716f0ac8e3e016318c301828428ce241a1dd0e08

tests/wpt/web-platform-tests/css/css-writing-modes/available-size-003.html

@@ -7,7 +7,7 @@
 <meta name="assert" content="When an orthogonal flow's parent doesn't have a definite block size and the nearest ancestor scroller does have a fixed height, use that, making sure you stick with the content height.">
 <meta name="flags" content="">
 <style>
-body > div {
+#scroller {
   font-family: monospace; /* to be able to reliably measure things in ch*/
   font-size: 20px;
   height: 8ch;
@@ -15,12 +15,11 @@ body > div {
   overflow: hidden;
   color: transparent;
   position: relative; /* to act as a container of #red */
-  writing-mode: vertical-lr;
   padding: 1ch 0;
 }
 
-div > div { padding-bottom: 2ch; } /* so that the content height of the parent and of the fixed size scrolling ancestor are different */
-div > div > div { writing-mode: vertical-rl; }
+#parent { padding-bottom: 2ch; } /* so that the content height of the parent and of the fixed size scrolling ancestor are different */
+#ortho { writing-mode: vertical-rl; }
 
 span {
   background: green;
@@ -38,9 +37,11 @@ span {
 
 <p>Test passes if there is a <strong>green rectangle</strong> below and <strong>no red</strong>.
 
-<div>
-  <aside id="red">0</aside>
-  <div><div>0 0 0 0 <span>0</span> 0 0 0</div></div> <!-- If this div take its height from
-  the height of its scrollable ancestor, it should wrap just right for the green 0 to
-  overlap with the red one. -->
+<div id=scroller>
+  <aside id=red>0</aside>
+  <div id=parent>
+    <div id=ortho>0 0 0 0 <span>0</span> 0 0 0</div>
+    <!-- If this div take its height from the height of its scrollable ancestor,
+         it should wrap just right for the green 0 to overlap with the red one. -->
+  </div>
 </div>

tests/wpt/web-platform-tests/css/css-writing-modes/available-size-005.html

@@ -7,7 +7,7 @@
 <meta name="assert" content="When an orthogonal flow's parent doesn't have a definite block size and the nearest ancestor scroller does a have fixed height, use that whole height, even if some other content already consumes some of it.">
 <meta name="flags" content="">
 <style>
-body > div {
+#scroller {
   font-family: monospace; /* to be able to reliably measure things in ch*/
   font-size: 20px;
   height: 8ch;
@@ -17,8 +17,8 @@ body > div {
   position: relative; /* to act as a container of #red */
 }
 
-div > div { padding-bottom: 2ch; } /* so that the content height of the parent and of the fixed size scrolling ancestor are different */
-div > div > div { writing-mode: vertical-rl; }
+#parent { padding-bottom: 2ch; } /* so that the content height of the parent and of the fixed size scrolling ancestor are different */
+#ortho { writing-mode: vertical-rl; }
 
 span {
   background: green;
@@ -41,9 +41,12 @@ span {
 
 <p>Test passes if there is a <strong>green rectangle</strong> below and <strong>no red</strong>.
 
-<div>
+<div id=scroller>
   <aside id="red">0</aside>
-  <div><aside id="spacer"></aside><div>0 0 0 0 <span>0</span> 0 0 0</div></div>
+  <div id=parent>
+    <aside id=spacer></aside>
+    <div id=ortho>0 0 0 0 <span>0</span> 0 0 0</div>
+  </div>
   <!-- If the inner div take its height from the height of its scrollable
   ancestor, it should wrap just right for the green 0 to overlap with the red
   one. If instead it takes it size from the remaining height after having

tests/wpt/web-platform-tests/css/css-writing-modes/available-size-009.html

@@ -9,7 +9,7 @@
 <style>
 body { margin-top: 0; margin-bottom: 0; } /* Shouldn't matter, but in some browsers does. -007 tests this aspect specifically. */
 :root { overflow: hidden; }
-div {
+#ortho {
   writing-mode: vertical-rl;
   font-family: monospace;
   font-size: 20px;
@@ -17,7 +17,7 @@ div {
 }
 .spacer { /* using 5 spacers of 20vh each instead of a single large one, so
              that the line would wrap between spacers if it ends up being
-             shorter thatn 100vh*/
+             shorter than 100vh*/
   display: inline-block;
   height: calc(20vh - 0.1px); /*Using this instead of 20vh, to account for accumulation of rounding errors, that might make 5*20vh taller than 100vh in some browsers*/
 }
@@ -38,18 +38,21 @@ span {
   left: 0; top: 0;
 }
 
-section {
+#scroller {
   overflow: hidden;
-  writing-mode: vertical-rl;
+  writing-mode: vertical-lr;
   height: 120vh;
 }
-section > section {
+#parent {
   writing-mode: horizontal-tb;
+  width: 8em; /* avoid triggering intrinsic sizing bugs */
 }
 </style>
 
 <p>Test passes if there is a <strong>green rectangle</strong> below and <strong>no red</strong>.
 
-<section>
-<div><aside id="red">0</aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside> <span>0</span></div>
-</section>
+<div id=scroller>
+  <div id=parent>
+    <div id=ortho><aside id="red">0</aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside> <span>0</span></div>
+  </div>
+</div>

tests/wpt/web-platform-tests/css/css-writing-modes/available-size-013.html

@@ -7,7 +7,7 @@
 <meta name="assert" content="When an orthogonal flow's parent doesn't have a definite block size and the nearest ancestor scroller does have a fixed height, use that, increased by the min-height if it is set and is larger (same as -003, with min-height).">
 <meta name="flags" content="">
 <style>
-body > div {
+#scroller {
   font-family: monospace; /* to be able to reliably measure things in ch*/
   font-size: 20px;
   height: 4ch;
@@ -16,12 +16,11 @@ body > div {
   overflow: hidden;
   color: transparent;
   position: relative; /* to act as a container of #red */
-  writing-mode: vertical-lr;
   padding: 1ch 0;
 }
 
-div > div { padding-bottom: 2ch; } /* so that the content height of the parent and of the fixed size scrolling ancestor are different */
-div > div > div { writing-mode: vertical-rl; }
+#parent { padding-bottom: 2ch; } /* so that the content height of the parent and of the fixed size scrolling ancestor are different */
+#ortho { writing-mode: vertical-rl; }
 
 span {
   background: green;
@@ -39,9 +38,11 @@ span {
 
 <p>Test passes if there is a <strong>green rectangle</strong> below and <strong>no red</strong>.
 
-<div>
-  <aside id="red">0</aside>
-  <div><div>0 0 0 0 <span>0</span> 0 0 0</div></div> <!-- If this div take its height from
-  the height of its scrollable ancestor, it should wrap just right for the green 0 to
-  overlap with the red one. -->
+<div id=scroller>
+  <aside id=red>0</aside>
+  <div id=parent>
+    <div id=ortho>0 0 0 0 <span>0</span> 0 0 0</div>
+    <!-- If this div take its height from the height of its scrollable ancestor,
+         it should wrap just right for the green 0 to overlap with the red one. -->
+  </div>
 </div>

tests/wpt/web-platform-tests/css/css-writing-modes/available-size-014.html

@@ -7,7 +7,7 @@
 <meta name="assert" content="When an orthogonal flow's parent doesn't have a definite block size and the nearest ancestor scroller does a have fixed height, use that whole height increased by min-height if that's larger, even if some other content already consumes some of it (same as -005, with min-height).">
 <meta name="flags" content="">
 <style>
-body > div {
+#scroller {
   font-family: monospace; /* to be able to reliably measure things in ch*/
   font-size: 20px;
   height: 4ch;
@@ -18,8 +18,8 @@ body > div {
   position: relative; /* to act as a container of #red */
 }
 
-div > div { padding-bottom: 2ch; } /* so that the content height of the parent and of the fixed size scrolling ancestor are different */
-div > div > div { writing-mode: vertical-rl; }
+#parent { padding-bottom: 2ch; } /* so that the content height of the parent and of the fixed size scrolling ancestor are different */
+#ortho { writing-mode: vertical-rl; }
 
 span {
   background: green;
@@ -42,9 +42,12 @@ span {
 
 <p>Test passes if there is a <strong>green rectangle</strong> below and <strong>no red</strong>.
 
-<div>
+<div id=scroller>
   <aside id="red">0</aside>
-  <div><aside id="spacer"></aside><div>0 0 0 0 <span>0</span> 0 0 0</div></div>
+  <div id=parent>
+    <aside id=spacer></aside>
+    <div id=ortho>0 0 0 0 <span>0</span> 0 0 0</div>
+  </div>
   <!-- If the inner div take its height from the height of its scrollable
   ancestor, it should wrap just right for the green 0 to overlap with the red
   one. If instead it takes it size from the remaining height after having

tests/wpt/web-platform-tests/css/css-writing-modes/available-size-016.html

@@ -9,7 +9,7 @@
 <style>
 body { margin-top: 0; margin-bottom: 0; } /* Shouldn't matter, but in some browsers does. -007 tests this aspect specifically. */
 :root { overflow: hidden; }
-div {
+#ortho {
   writing-mode: vertical-rl;
   font-family: monospace;
   font-size: 20px;
@@ -38,19 +38,22 @@ span {
   left: 0; top: 0;
 }
 
-section {
+#scroller {
   overflow: hidden;
-  writing-mode: vertical-rl;
+  writing-mode: vertical-lr;
   height: 40vh;
   min-height: 120vh;
 }
-section > section {
+#parent {
   writing-mode: horizontal-tb;
+  width: 8em; /* avoid triggering intrinsic sizing bugs */
 }
 </style>
 
 <p>Test passes if there is a <strong>green rectangle</strong> below and <strong>no red</strong>.
 
-<section>
-<div><aside id="red">0</aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside> <span>0</span></div>
-</section>
+<div id=scroller>
+  <div id=parent>
+    <div id=ortho><aside id="red">0</aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside><aside class="spacer"></aside> <span>0</span></div>
+  </div>
+</div>