[css-grid] Implementing the grid's first line baseline.

third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-baseline-expected.html

Index: third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-baseline-expected.html
diff --git a/third_party/WebKit/LayoutTests/css3/flexbox/flexbox-baseline.html b/third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-baseline-expected.html
similarity index 92%
copy from third_party/WebKit/LayoutTests/css3/flexbox/flexbox-baseline.html
copy to third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-baseline-expected.html
index 32994260b7918fedf87e367d2d24125c1c7c0786..3adccb073d1f88ab2b0e9445e321f03e09521708 100644
--- a/third_party/WebKit/LayoutTests/css3/flexbox/flexbox-baseline.html
+++ b/third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-baseline-expected.html
@@ -75,7 +75,7 @@ should align with the middle
 <div class="inline-flexbox" style="width: 40px; height: 40px">
     <div style="writing-mode: vertical-rl; height: 20px; width: 40px; border-bottom: 1px solid black"></div>
 </div>
-of the grey flexbox
+of the grey box
 </div>
 
 <!-- If there are no flexitems, align to the bottom of the box. -->
@@ -83,10 +83,9 @@ of the grey flexbox
 should align with the bottom
 <div class="inline-flexbox" style="width: 30px; height: 30px">
 </div>
-of the grey flexbox
+of the grey box
 </div>
 
-
 <!-- cross-axis (column) test cases. -->
 <div>
 before text
@@ -97,6 +96,9 @@ before text
 after text
 </div>
 
+<!-- TODO: Grid spec does not allow block-axis baseline alignment, which is what apparently flexbox does.
+See https://github.com/w3c/csswg-drafts/issues/197 for details. -->
+<!--
 <div>
 before text
 <div class="inline-flexbox column-reverse">
@@ -105,6 +107,7 @@ before text
 </div>
 after text
 </div>
+-->
 
 <!-- If the first flex item has an orthogonal baseline, use the synthesized
 baseline (bottom of the content box of the first item). -->
@@ -112,9 +115,9 @@ baseline (bottom of the content box of the first item). -->
 should align with the middle
 <div class="inline-flexbox column" style="width: 40px; height: 40px;">
     <div style="writing-mode: vertical-rl; width: 40px; height: 20px; border-bottom: 1px solid black"></div>
-    <div style="writing-mode: vertical-rl; width: 40px; height: 20px"></div>
+    <div style="writing-mode: vertical-rl; width: 40px; height: 19px"></div>
 </div>
-of the grey flexbox
+of the grey box
 </div>
 
 <!-- If there are no flexitems, align to the bottom of the box. -->
@@ -122,7 +125,7 @@ of the grey flexbox
 should align with the bottom
 <div class="inline-flexbox column" style="width: 30px; height: 30px">
 </div>
-of the grey flexbox
+of the grey box
 </div>
 
 <!-- More tests on the right side of the page. -->
@@ -173,6 +176,9 @@ before text
 after text
 </div>
 
+<!-- TODO: Grid spec does not allow block-axis baseline alignment, which is what apparently flexbox does.
+See https://github.com/w3c/csswg-drafts/issues/197 for details. -->
+<!--
 <table style="background-color: lightgrey; margin-top: 5px">
 <tr style="height: 50px">
   <td style="vertical-align: bottom">bottom</td>
@@ -188,6 +194,7 @@ after text
   </div></td>
 </tr>
 </table>
+-->
 
 <table style="background-color: lightgrey; margin-top: 5px">
 <tr style="height: 50px">