[CSS Grid Layout] Content sized tracks must clear the override height

LayoutTests/fast/css-grid-layout/grid-items-should-not-be-stretched-when-height-or-width-or-margin-change.html

Index: LayoutTests/fast/css-grid-layout/grid-items-should-not-be-stretched-when-height-or-width-or-margin-change.html
diff --git a/LayoutTests/fast/css-grid-layout/grid-items-should-not-be-stretched-when-height-or-width-or-margin-change.html b/LayoutTests/fast/css-grid-layout/grid-items-should-not-be-stretched-when-height-or-width-or-margin-change.html
index 439e5d469ea7776c565b93279853d07462a7f636..7cc5fc602c125096ed8470878ba7372c33d94f85 100644
--- a/LayoutTests/fast/css-grid-layout/grid-items-should-not-be-stretched-when-height-or-width-or-margin-change.html
+++ b/LayoutTests/fast/css-grid-layout/grid-items-should-not-be-stretched-when-height-or-width-or-margin-change.html
@@ -3,28 +3,31 @@
 <script src="../../resources/check-layout.js"></script>
 <style>
 .grid {
-    grid-template: 200px 200px / 200px 200px;
     width: -webkit-fit-content;
     position: relative;
 }
+.content {
+    width: 200px;
+    height: 200px;
+}
 #fromFixedWidth { width: 150px; }
 #fromFixedHeight { height: 100px; }
 #fromMarginAuto { margin: auto; }
 </style>
 <p>The grids below had initially 'stretched' items, but we have changed 'height', 'width' and 'margin' to values which don't allow stretch. This test verifies that the layout algorithm properly detects such changes and clear the override height and width accordingly.</p>
-<div class="grid">
+<div class="grid" style="grid-template: 200px 200px / 200px 200px;">
     <div id="toFixedHeight" class="firstRowFirstColumn" data-expected-width="200" data-expected-height="100"></div>
     <div class="firstRowSecondColumn" data-expected-width="200" data-expected-height="200"></div>
     <div class="secondRowFirstColumn" data-expected-width="200" data-expected-height="200"></div>
     <div id="fromFixedHeight" class="secondRowSecondColumn" data-expected-width="200" data-expected-height="200"></div>
 </div>
-<div class="grid">
+<div class="grid" style="grid-template: 200px 200px / 200px 200px;">
     <div id="toFixedWidth" class="firstRowFirstColumn" data-expected-width="150" data-expected-height="200"></div>
     <div class="firstRowSecondColumn" data-expected-width="200" data-expected-height="200"></div>
     <div class="secondRowFirstColumn" data-expected-width="200" data-expected-height="200"></div>
     <div id="fromFixedWidth" class="secondRowSecondColumn" data-expected-width="200" data-expected-height="200"></div>
 </div>
-<div class="grid">
+<div class="grid" style="grid-template: 200px 200px / 200px 200px;">
     <div id="toMarginAuto" class="firstRowFirstColumn" data-expected-width="150" data-expected-height="100">
         <div style="width: 150px; height: 100px"></div>
     </div>
@@ -34,6 +37,28 @@
         <div style="width: 150px; height: 100px"></div>
     </div>
 </div>
+<div class="grid">
+    <div id="contentSized-toFixedHeight" class="firstRowFirstColumn" data-expected-width="200" data-expected-height="100"></div>
+    <div class="firstRowSecondColumn" data-expected-width="200" data-expected-height="200"><div class="content"></div></div>
+    <div class="secondRowFirstColumn" data-expected-width="200" data-expected-height="200"><div class="content"></div></div>
+    <div id="contentSized-fromFixedHeight" class="secondRowSecondColumn" data-expected-width="200" data-expected-height="200"></div>
+</div>
+<div class="grid">
+    <div id="contentSized-toFixedWidth" class="firstRowFirstColumn" data-expected-width="150" data-expected-height="200"></div>
+    <div class="firstRowSecondColumn" data-expected-width="200" data-expected-height="200"><div class="content"></div></div>
+    <div class="secondRowFirstColumn" data-expected-width="200" data-expected-height="200"><div class="content"></div></div>
+    <div id="contentSized-fromFixedWidth" class="secondRowSecondColumn" data-expected-width="200" data-expected-height="200"></div>
+</div>
+<div class="grid">
+    <div id="contentSized-toMarginAuto" class="firstRowFirstColumn" data-expected-width="150" data-expected-height="100">
+        <div style="width: 150px; height: 100px"></div>
+    </div>
+    <div class="firstRowSecondColumn" data-expected-width="200" data-expected-height="200"><div class="content"></div></div>
+    <div class="secondRowFirstColumn" data-expected-width="200" data-expected-height="200"><div class="content"></div></div>
+    <div id="contentSized-fromMarginAuto" class="secondRowSecondColumn" data-expected-width="200" data-expected-height="200">
+        <div style="width: 150px; height: 100px"></div>
+    </div>
+</div>
 <script>
 document.body.offsetLeft;
 document.getElementById("fromFixedHeight").style.height = "auto";
@@ -42,5 +67,11 @@ document.getElementById("fromFixedWidth").style.width = "auto";
 document.getElementById("toFixedWidth").style.width = "150px";
 document.getElementById("fromMarginAuto").style.margin = "0";
 document.getElementById("toMarginAuto").style.margin = "auto";
+document.getElementById("contentSized-fromFixedHeight").style.height = "auto";
+document.getElementById("contentSized-toFixedHeight").style.height = "100px";
+document.getElementById("contentSized-fromFixedWidth").style.width = "auto";
+document.getElementById("contentSized-toFixedWidth").style.width = "150px";
+document.getElementById("contentSized-fromMarginAuto").style.margin = "0";
+document.getElementById("contentSized-toMarginAuto").style.margin = "auto";
 checkLayout(".grid");
 </script>