[CSS Grid Layout] Using automatic (instead of min-content) minimums for 'auto' tracks
authorsvillar@igalia.com <svillar@igalia.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 17 Sep 2015 12:13:30 +0000 (12:13 +0000)
committersvillar@igalia.com <svillar@igalia.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 17 Sep 2015 12:13:30 +0000 (12:13 +0000)
https://bugs.webkit.org/show_bug.cgi?id=142329

Reviewed by Darin Adler.

Based on Blink's r198697 by <svillar@igalia.com> and r200478 by <jfernandez@igalia.com>

Source/WebCore:

More precisely (syntax-wise), this would allow 'auto' to be used within the
minmax() function (it's currently forbidden) and have the 'auto' keyword map
to minmax(auto, auto) instead of minmax(min-content, max-content).
- As a minimum, 'auto' would mean "use the specified minimum size, or if
that is auto, treat as 0 or min-content per Flexbox rules".
- As a maximum, 'auto' would mean "use the max-content size".

Regarding the implementation, a new phase is added to the track sizing
algorithm called ResolveIntrinsicMinimums (the former ResolveIntrinsicMinimums
is now called ResolveContentBasedMinimums which does not include 'auto'
resolution) which will be run before any other. This phase uses the minimum
size of grid items (as specified by min-width/height).

Tests: fast/css-grid-layout/grid-automatic-minimum-for-auto-columns.html
       fast/css-grid-layout/grid-automatic-minimum-for-auto-rows.html

* css/CSSParser.cpp:
(WebCore::CSSParser::parseGridBreadth):
* rendering/RenderGrid.cpp:
(WebCore::RenderGrid::computeUsedBreadthOfMinLength):
(WebCore::RenderGrid::computeUsedBreadthOfMaxLength):
(WebCore::RenderGrid::minSizeForChild):
(WebCore::RenderGrid::resolveContentBasedTrackSizingFunctions):
(WebCore::RenderGrid::resolveContentBasedTrackSizingFunctionsForNonSpanningItems):
(WebCore::RenderGrid::trackSizeForTrackSizeComputationPhase):
(WebCore::RenderGrid::shouldProcessTrackForTrackSizeComputationPhase):
(WebCore::RenderGrid::trackShouldGrowBeyondGrowthLimitsForTrackSizeComputationPhase):
(WebCore::RenderGrid::markAsInfinitelyGrowableForTrackSizeComputationPhase):
(WebCore::RenderGrid::updateTrackSizeForTrackSizeComputationPhase):
(WebCore::RenderGrid::currentItemSizeForTrackSizeComputationPhase):
* rendering/RenderGrid.h:
* rendering/style/GridTrackSize.h:
(WebCore::GridTrackSize::minTrackBreadth):
(WebCore::GridTrackSize::maxTrackBreadth):
(WebCore::GridTrackSize::cacheMinMaxTrackBreadthTypes):
(WebCore::GridTrackSize::hasIntrinsicMinTrackBreadth):
(WebCore::GridTrackSize::hasAutoMinTrackBreadth):
(WebCore::GridTrackSize::hasAutoMaxTrackBreadth):
(WebCore::GridTrackSize::hasMaxContentOrAutoMaxTrackBreadth):
(WebCore::GridTrackSize::hasAutoOrMinContentMinTrackBreadthAndIntrinsicMaxTrackBreadth):
(WebCore::GridTrackSize::hasMinContentMinTrackBreadthAndMinOrMaxContentMaxTrackBreadth): Deleted.

LayoutTests:

New tests to verify that auto is a valid keyword inside
minmax. Updated the expectations of existing tests to
reflect the new status of auto.

* fast/css-grid-layout/grid-auto-columns-rows-get-set-expected.txt:
* fast/css-grid-layout/grid-auto-columns-rows-get-set.html:
* fast/css-grid-layout/grid-automatic-minimum-for-auto-columns-expected.txt: Added.
* fast/css-grid-layout/grid-automatic-minimum-for-auto-columns.html: Added.
* fast/css-grid-layout/grid-automatic-minimum-for-auto-rows-expected.txt: Added.
* fast/css-grid-layout/grid-automatic-minimum-for-auto-rows.html: Added.
* fast/css-grid-layout/grid-columns-rows-get-set-expected.txt:
* fast/css-grid-layout/grid-columns-rows-get-set-multiple-expected.txt:
* fast/css-grid-layout/grid-columns-rows-get-set-multiple.html:
* fast/css-grid-layout/grid-columns-rows-get-set.html:
* fast/css-grid-layout/non-grid-columns-rows-get-set-expected.txt:
* fast/css-grid-layout/non-grid-columns-rows-get-set-multiple-expected.txt:
* fast/css-grid-layout/non-grid-columns-rows-get-set-multiple.html:
* fast/css-grid-layout/non-grid-columns-rows-get-set.html:
* fast/css-grid-layout/resources/grid-columns-rows-get-set-multiple.js:
* fast/css-grid-layout/resources/grid-columns-rows-get-set.js:
* fast/css-grid-layout/resources/non-grid-columns-rows-get-set-multiple.js:
* fast/css-grid-layout/resources/non-grid-columns-rows-get-set.js:

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@189911 268f45cc-cd09-0410-ab3c-d52691b4dbfc

24 files changed:
LayoutTests/ChangeLog
LayoutTests/fast/css-grid-layout/grid-auto-columns-rows-get-set-expected.txt
LayoutTests/fast/css-grid-layout/grid-auto-columns-rows-get-set.html
LayoutTests/fast/css-grid-layout/grid-automatic-minimum-for-auto-columns-expected.txt [new file with mode: 0644]
LayoutTests/fast/css-grid-layout/grid-automatic-minimum-for-auto-columns.html [new file with mode: 0644]
LayoutTests/fast/css-grid-layout/grid-automatic-minimum-for-auto-rows-expected.txt [new file with mode: 0644]
LayoutTests/fast/css-grid-layout/grid-automatic-minimum-for-auto-rows.html [new file with mode: 0644]
LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-expected.txt
LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-multiple-expected.txt
LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set-multiple.html
LayoutTests/fast/css-grid-layout/grid-columns-rows-get-set.html
LayoutTests/fast/css-grid-layout/non-grid-columns-rows-get-set-expected.txt
LayoutTests/fast/css-grid-layout/non-grid-columns-rows-get-set-multiple-expected.txt
LayoutTests/fast/css-grid-layout/non-grid-columns-rows-get-set-multiple.html
LayoutTests/fast/css-grid-layout/non-grid-columns-rows-get-set.html
LayoutTests/fast/css-grid-layout/resources/grid-columns-rows-get-set-multiple.js
LayoutTests/fast/css-grid-layout/resources/grid-columns-rows-get-set.js
LayoutTests/fast/css-grid-layout/resources/non-grid-columns-rows-get-set-multiple.js
LayoutTests/fast/css-grid-layout/resources/non-grid-columns-rows-get-set.js
Source/WebCore/ChangeLog
Source/WebCore/css/CSSParser.cpp
Source/WebCore/rendering/RenderGrid.cpp
Source/WebCore/rendering/RenderGrid.h
Source/WebCore/rendering/style/GridTrackSize.h

index eb1dd45..90a0186 100644 (file)
@@ -1,3 +1,35 @@
+2015-09-15  Sergio Villar Senin  <svillar@igalia.com>
+
+        [CSS Grid Layout]  Using automatic (instead of min-content) minimums for 'auto' tracks
+        https://bugs.webkit.org/show_bug.cgi?id=142329
+
+        Reviewed by Darin Adler.
+
+        Based on Blink's r198697 by <svillar@igalia.com> and r200478 by <jfernandez@igalia.com>
+
+        New tests to verify that auto is a valid keyword inside
+        minmax. Updated the expectations of existing tests to
+        reflect the new status of auto.
+
+        * fast/css-grid-layout/grid-auto-columns-rows-get-set-expected.txt:
+        * fast/css-grid-layout/grid-auto-columns-rows-get-set.html:
+        * fast/css-grid-layout/grid-automatic-minimum-for-auto-columns-expected.txt: Added.
+        * fast/css-grid-layout/grid-automatic-minimum-for-auto-columns.html: Added.
+        * fast/css-grid-layout/grid-automatic-minimum-for-auto-rows-expected.txt: Added.
+        * fast/css-grid-layout/grid-automatic-minimum-for-auto-rows.html: Added.
+        * fast/css-grid-layout/grid-columns-rows-get-set-expected.txt:
+        * fast/css-grid-layout/grid-columns-rows-get-set-multiple-expected.txt:
+        * fast/css-grid-layout/grid-columns-rows-get-set-multiple.html:
+        * fast/css-grid-layout/grid-columns-rows-get-set.html:
+        * fast/css-grid-layout/non-grid-columns-rows-get-set-expected.txt:
+        * fast/css-grid-layout/non-grid-columns-rows-get-set-multiple-expected.txt:
+        * fast/css-grid-layout/non-grid-columns-rows-get-set-multiple.html:
+        * fast/css-grid-layout/non-grid-columns-rows-get-set.html:
+        * fast/css-grid-layout/resources/grid-columns-rows-get-set-multiple.js:
+        * fast/css-grid-layout/resources/grid-columns-rows-get-set.js:
+        * fast/css-grid-layout/resources/non-grid-columns-rows-get-set-multiple.js:
+        * fast/css-grid-layout/resources/non-grid-columns-rows-get-set.js:
+
 2015-09-17  Javier Fernandez  <jfernandez@igalia.com>
 
         [CSS Grid Layout] Relayout whenever Box Alignment properties change
index 52a2df1..2736cb3 100644 (file)
@@ -10,6 +10,8 @@ PASS window.getComputedStyle(gridAutoMinMax, '').getPropertyValue('-webkit-grid-
 PASS window.getComputedStyle(gridAutoMinMax, '').getPropertyValue('-webkit-grid-auto-columns') is "minmax(30%, 100px)"
 PASS window.getComputedStyle(gridAutoMinMaxContent, '').getPropertyValue('-webkit-grid-auto-rows') is "-webkit-min-content"
 PASS window.getComputedStyle(gridAutoMinMaxContent, '').getPropertyValue('-webkit-grid-auto-columns') is "-webkit-max-content"
+PASS window.getComputedStyle(gridAutoAutoInMinMax, '').getPropertyValue('-webkit-grid-auto-rows') is "minmax(auto, 48px)"
+PASS window.getComputedStyle(gridAutoAutoInMinMax, '').getPropertyValue('-webkit-grid-auto-columns') is "minmax(80px, auto)"
 
 Test that getting grid-template-columns and grid-template-rows set through CSS lists every track listed whether implicitly or explicitly created
 PASS window.getComputedStyle(gridAutoFixedFixedWithChildren, '').getPropertyValue('-webkit-grid-auto-rows') is "30px"
@@ -50,8 +52,6 @@ PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-auto-columns')
 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-auto-rows') is 'auto'
 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-auto-columns') is 'auto'
 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-auto-rows') is 'auto'
-PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-auto-columns') is 'auto'
-PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-auto-rows') is 'auto'
 
 Test setting grid-auto-columns and grid-auto-rows to 'inherit' through JS
 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-auto-columns') is '50px'
index 58b22ad..73ba0a9 100644 (file)
     -webkit-grid-template-columns: 20px;
 }
 
+.gridAutoAutoInMinMax {
+    -webkit-grid-auto-rows: minmax(auto, 8vh);
+    -webkit-grid-auto-columns: minmax(10vw, auto);
+}
+
 </style>
 <script src="../../resources/js-test-pre.js"></script>
 <script src="resources/grid-definitions-parsing-utils.js"></script>
@@ -34,6 +39,7 @@
 <div class="grid gridAutoFixedFixed" id="gridAutoFixedFixed"></div>
 <div class="grid gridAutoMinMax" id="gridAutoMinMax"></div>
 <div class="grid gridAutoMinMaxContent" id="gridAutoMinMaxContent"></div>
+<div class="grid gridAutoAutoInMinMax" id="gridAutoAutoInMinMax"></div>
 <div class="grid gridAutoFixedFixed" id="gridAutoFixedFixedWithChildren">
     <div class="sizedToGridArea firstRowFirstColumn"></div>
 </div>
@@ -48,6 +54,7 @@ debug("Test getting -webkit-grid-auto-columns and -webkit-grid-auto-rows set thr
 testGridAutoDefinitionsValues(document.getElementById("gridAutoFixedFixed"), "30px", "50px");
 testGridAutoDefinitionsValues(document.getElementById("gridAutoMinMax"), "minmax(10%, 15px)", "minmax(30%, 100px)");
 testGridAutoDefinitionsValues(document.getElementById("gridAutoMinMaxContent"), "-webkit-min-content", "-webkit-max-content");
+testGridAutoDefinitionsValues(document.getElementById("gridAutoAutoInMinMax"), "minmax(auto, 48px)", "minmax(80px, auto)");
 
 debug("");
 debug("Test that getting grid-template-columns and grid-template-rows set through CSS lists every track listed whether implicitly or explicitly created");
@@ -122,14 +129,6 @@ shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-auto-rows
 
 element = document.createElement("div");
 document.body.appendChild(element);
-// Auto is not allowed inside minmax.
-element.style.webkitGridAutoColumns = "minmax(auto, 8vh)";
-element.style.webkitGridAutoRows = "minmax(10vw, auto)";
-shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-auto-columns')", "'auto'");
-shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-grid-auto-rows')", "'auto'");
-
-element = document.createElement("div");
-document.body.appendChild(element);
 // None is not allowed for grid-auto-{rows|columns}.
 element.style.webkitGridAutoColumns = "none";
 element.style.webkitGridAutoRows = "none";
diff --git a/LayoutTests/fast/css-grid-layout/grid-automatic-minimum-for-auto-columns-expected.txt b/LayoutTests/fast/css-grid-layout/grid-automatic-minimum-for-auto-columns-expected.txt
new file mode 100644 (file)
index 0000000..55e8d37
--- /dev/null
@@ -0,0 +1,84 @@
+Check that min-width is honored when sizing auto columns.
+PASS window.getComputedStyle(gridAuto, '').getPropertyValue('-webkit-grid-template-columns') is "40px"
+PASS window.getComputedStyle(gridAutoItemSmallerThanMinSize, '').getPropertyValue('-webkit-grid-template-columns') is "40px"
+PASS window.getComputedStyle(gridMinMaxAutoAuto, '').getPropertyValue('-webkit-grid-template-columns') is "40px"
+PASS window.getComputedStyle(gridMinMaxAutoMaxContent, '').getPropertyValue('-webkit-grid-template-columns') is "40px"
+PASS window.getComputedStyle(gridMinMaxMinContentAuto, '').getPropertyValue('-webkit-grid-template-columns') is "40px"
+PASS window.getComputedStyle(gridAutoMultipleItems, '').getPropertyValue('-webkit-grid-template-columns') is "30px"
+PASS window.getComputedStyle(gridMinMaxAutoAutoMultipleItemsOneWithoutMinWidth, '').getPropertyValue('-webkit-grid-template-columns') is "60px"
+PASS window.getComputedStyle(gridMinMaxAutoMaxContentMultipleItemsOneWithAutoMinWidth, '').getPropertyValue('-webkit-grid-template-columns') is "80px"
+
+Check that min-width is honored when sizing auto columns and spanning grid items.
+PASS window.getComputedStyle(gridAutoAndAutoOneSpanningOneNonSpannig, '').getPropertyValue('-webkit-grid-template-columns') is "35px 15px"
+PASS window.getComputedStyle(gridAutoAndAutoOneSpanningMultipleNonSpanning, '').getPropertyValue('-webkit-grid-template-columns') is "20px 40px"
+PASS window.getComputedStyle(gridAutoAndMinMaxAutoAutoOneSpanningOneNonSpanning, '').getPropertyValue('-webkit-grid-template-columns') is "20px 50px"
+PASS window.getComputedStyle(gridAutoAndMinMaxAutoAutoMultipleSpanning, '').getPropertyValue('-webkit-grid-template-columns') is "35px 35px"
+PASS window.getComputedStyle(gridMinMaxAutoMaxContentAndAutoOneSpanningMultipleNonSpanning, '').getPropertyValue('-webkit-grid-template-columns') is "25px 65px"
+PASS window.getComputedStyle(gridMinMaxAutoMaxContentAndAutoMultipleSpanningMultipleNonSpanning, '').getPropertyValue('-webkit-grid-template-columns') is "40px 50px"
+
+Check the interactions between width and min-width and auto tracks.
+PASS window.getComputedStyle(gridAutoWithFixedWidthChild, '').getPropertyValue('-webkit-grid-template-columns') is "60px"
+PASS window.getComputedStyle(gridAutoWithFixedWidthChildAndMinWidth, '').getPropertyValue('-webkit-grid-template-columns') is "40px"
+PASS window.getComputedStyle(gridAutoWithFixedWidthChildAndHigherMinWidth, '').getPropertyValue('-webkit-grid-template-columns') is "90px"
+PASS window.getComputedStyle(gridAutoAndAutoOneSpanningFixedWidth, '').getPropertyValue('-webkit-grid-template-columns') is "25px 25px"
+PASS window.getComputedStyle(gridAutoAndAutoOneSpanningFixedWidthAndMinWidth, '').getPropertyValue('-webkit-grid-template-columns') is "25px 25px"
+PASS window.getComputedStyle(gridAutoAndAutoOneSpanningFixedWidthAndHigherMinWidth, '').getPropertyValue('-webkit-grid-template-columns') is "35px 35px"
+
+Check that borders and paddings are considering when computing min sizes.
+PASS window.getComputedStyle(gridAutoFixedMinWidthWithBorder, '').getPropertyValue('-webkit-grid-template-columns') is "50px"
+PASS window.getComputedStyle(gridAutoFixedMinWidthWithPadding, '').getPropertyValue('-webkit-grid-template-columns') is "56px"
+PASS window.getComputedStyle(gridAutoFixedMinWidthWithBorderAndPadding, '').getPropertyValue('-webkit-grid-template-columns') is "66px"
+PASS window.getComputedStyle(gridAutoAutoMinWidthWithBorder, '').getPropertyValue('-webkit-grid-template-columns') is "40px"
+PASS window.getComputedStyle(gridAutoAutoMinWidthWithPadding, '').getPropertyValue('-webkit-grid-template-columns') is "46px"
+PASS window.getComputedStyle(gridAutoAutoMinWidthWithBorderAndPadding, '').getPropertyValue('-webkit-grid-template-columns') is "56px"
+PASS window.getComputedStyle(gridAutoMaxContentMinWidthWithBorder, '').getPropertyValue('-webkit-grid-template-columns') is "90px"
+PASS window.getComputedStyle(gridAutoMaxContentMinWidthWithPadding, '').getPropertyValue('-webkit-grid-template-columns') is "96px"
+PASS window.getComputedStyle(gridAutoMaxContentMinWidthWithBorderAndPadding, '').getPropertyValue('-webkit-grid-template-columns') is "106px"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+XXXXXX
+XX
+XX XX XX
+XXX XX X
+X X X X X X
+XX
+XXXX XXXX
+XX XXXXX X
+XX
+XXXXXX
+XXXX XXXX
+XX
+XX XXXXXXXX
+XXXX XXXX
+XX XX
+XXXXXX X XXX
+XX XX XX
+X X
+XXXX
+X XXX XX
+XXX XXXX
+XX XX XX
+XXXXX X XXXXX
+X XXX XX
+XXXXX XXXXX
+XX XX
+XX XX XX XX
+XXX
+X XX XXX
+X XX X
+XXX X
+XXX X
+XXX X
+XX XXX
+XX XXX XX
+XX XXX XX
+XXXXXX
+XXXXXX
+XXXXXX
+XX XXX X
+XX XXX X
+XX XXX X
+X XXXX X
+X XXXX X
+X XXXX X
diff --git a/LayoutTests/fast/css-grid-layout/grid-automatic-minimum-for-auto-columns.html b/LayoutTests/fast/css-grid-layout/grid-automatic-minimum-for-auto-columns.html
new file mode 100644 (file)
index 0000000..708c98f
--- /dev/null
@@ -0,0 +1,275 @@
+<html>
+<link href="resources/grid.css" rel="stylesheet"/>
+<style>
+.grid { font: 10px/1 Ahem; }
+
+.minWidth10 { min-width: 10px; }
+.minWidth20 { min-width: 20px; }
+.minWidth30 { min-width: 30px; }
+.minWidth40 { min-width: 40px; }
+.minWidth50 { min-width: 50px; }
+.minWidth60 { min-width: 60px; }
+.minWidth70 { min-width: 70px; }
+.minWidth90 { min-width: 90px; }
+.minWidthMaxContent { min-width: -webkit-max-content; }
+
+.width50 { width: 50px; }
+.width60 { width: 60px; }
+
+.border5 { border: 5px solid #abc; }
+.padding8 { padding: 0px 8px 0px; }
+
+/* All these 4 cases are equivalent. We use them interchangeably. */
+.gridAuto { -webkit-grid-template-columns: auto; }
+.gridMinMaxAutoAuto { -webkit-grid-template-columns: minmax(auto, auto); }
+.gridMinMaxAutoMaxContent { -webkit-grid-template-columns: minmax(auto, -webkit-max-content); }
+.gridMinMaxMinContentAuto { -webkit-grid-template-columns: minmax(-webkit-min-content, auto); }
+
+/* All these 3 cases are equivalent. We use them interchangeably. */
+.gridAutoAndAuto { -webkit-grid-template-columns: auto auto; }
+.gridAutoAndMinMaxAutoAuto { -webkit-grid-template-columns: auto minmax(auto, auto); }
+.gridMinMaxAutoMaxContentAndAuto { -webkit-grid-template-columns: minmax(auto, -webkit-max-content) auto; }
+
+</style>
+<script src="../../resources/js-test.js"></script>
+<body>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAuto">
+       <div class="firstRowFirstColumn minWidth40">XXXXXX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoItemSmallerThanMinSize">
+       <div class="firstRowFirstColumn minWidth40">XX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridMinMaxAutoAuto" id="gridMinMaxAutoAuto">
+       <div class="firstRowFirstColumn minWidth40">XX XX XX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridMinMaxAutoMaxContent" id="gridMinMaxAutoMaxContent">
+       <div class="firstRowFirstColumn minWidth40">XXX XX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridMinMaxMinContentAuto" id="gridMinMaxMinContentAuto">
+       <div class="firstRowFirstColumn minWidth40">X X X X X X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoMultipleItems">
+       <div class="firstRowFirstColumn minWidth30">XX</div>
+       <div class="secondRowFirstColumn minWidth20"">XXXX XXXX</div>
+       <div class="thirdRowAutoColumn minWidth10">XX XXXXX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridMinMaxAutoAuto" id="gridMinMaxAutoAutoMultipleItemsOneWithoutMinWidth">
+       <div class="firstRowFirstColumn minWidth30">XX</div>
+       <div class="secondRowFirstColumn">XXXXXX</div>
+       <div class="thirdRowAutoColumn minWidth20">XXXX XXXX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridMinMaxAutoMaxContent" id="gridMinMaxAutoMaxContentMultipleItemsOneWithAutoMinWidth">
+       <div class="firstRowFirstColumn minWidth30">XX</div>
+       <div class="secondRowFirstColumn">XX XXXXXXXX</div>
+       <div class="thirdRowAutoColumn minWidth20">XXXX XXXX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAutoAndAuto" id="gridAutoAndAutoOneSpanningOneNonSpannig">
+       <div class="firstRowFirstColumn">XX XX</div>
+       <div class="secondRowBothColumn minWidth50">XXXXXX X XXX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAutoAndAuto" id="gridAutoAndAutoOneSpanningMultipleNonSpanning">
+       <div class="secondRowBothColumn minWidth60">XX XX XX</div>
+       <div class="firstRowSecondColumn">X X</div>
+       <div class="firstRowSecondColumn">XXXX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAutoAndMinMaxAutoAuto" id="gridAutoAndMinMaxAutoAutoOneSpanningOneNonSpanning">
+       <div class="firstRowSecondColumn">X XXX XX</div>
+       <div class="secondRowBothColumn minWidth70">XXX XXXX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAutoAndMinMaxAutoAuto" id="gridAutoAndMinMaxAutoAutoMultipleSpanning">
+       <div class="secondRowBothColumn minWidth70">XX XX XX</div>
+       <div class="firstRowBothColumn">XXXXX X XXXXX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridMinMaxAutoMaxContentAndAuto" id="gridMinMaxAutoMaxContentAndAutoOneSpanningMultipleNonSpanning">
+       <div class="firstRowSecondColumn minWidth60">X XXX XX</div>
+       <div class="secondRowBothColumn minWidth90">XXXXX XXXXX</div>
+       <div class="firstRowFirstColumn">XX XX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridMinMaxAutoMaxContentAndAuto" id="gridMinMaxAutoMaxContentAndAutoMultipleSpanningMultipleNonSpanning">
+       <div class="secondRowBothColumn">XX XX XX XX</div>
+       <div class="firstRowFirstColumn minWidth40">XXX</div>
+       <div class="firstRowBothColumn minWidth90">X XX XXX</div>
+       <div class="firstRowSecondColumn">X XX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoWithFixedWidthChild">
+       <div class="firstRowFirstColumn width60">XXX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoWithFixedWidthChildAndMinWidth">
+       <div class="firstRowFirstColumn width60 minWidth40">XXX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoWithFixedWidthChildAndHigherMinWidth">
+       <div class="firstRowFirstColumn width60 minWidth90">XXX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAutoAndAuto" id="gridAutoAndAutoOneSpanningFixedWidth">
+       <div class="firstRowBothColumn width50">XX XXX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAutoAndAuto" id="gridAutoAndAutoOneSpanningFixedWidthAndMinWidth">
+       <div class="firstRowBothColumn width60 minWidth50">XX XXX XX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAutoAndAuto" id="gridAutoAndAutoOneSpanningFixedWidthAndHigherMinWidth">
+       <div class="firstRowBothColumn width60 minWidth70">XX XXX XX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoFixedMinWidthWithBorder">
+        <div class="firstRowFirstColumn minWidth40 border5">XXXXXX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoFixedMinWidthWithPadding">
+       <div class="firstRowFirstColumn minWidth40 padding8">XXXXXX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoFixedMinWidthWithBorderAndPadding">
+       <div class="firstRowFirstColumn minWidth40 border5 padding8">XXXXXX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoAutoMinWidthWithBorder">
+       <div class="firstRowFirstColumn border5">XX XXX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoAutoMinWidthWithPadding">
+       <div class="firstRowFirstColumn padding8">XX XXX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoAutoMinWidthWithBorderAndPadding">
+       <div class="firstRowFirstColumn border5 padding8">XX XXX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoMaxContentMinWidthWithBorder">
+       <div class="firstRowFirstColumn minWidthMaxContent border5">X XXXX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoMaxContentMinWidthWithPadding">
+       <div class="firstRowFirstColumn minWidthMaxContent padding8">X XXXX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoMaxContentMinWidthWithBorderAndPadding">
+       <div class="firstRowFirstColumn border5 padding8 minWidthMaxContent">X XXXX X</div>
+    </div>
+</div>
+
+<script>
+function testGridColumnsValues(id, computedColumnValue)
+{
+    shouldBeEqualToString("window.getComputedStyle(" + id + ", '').getPropertyValue('-webkit-grid-template-columns')", computedColumnValue);
+}
+
+debug("Check that min-width is honored when sizing auto columns.");
+testGridColumnsValues("gridAuto", "40px");
+testGridColumnsValues("gridAutoItemSmallerThanMinSize", "40px");
+testGridColumnsValues("gridMinMaxAutoAuto", "40px");
+testGridColumnsValues("gridMinMaxAutoMaxContent", "40px");
+testGridColumnsValues("gridMinMaxMinContentAuto", "40px");
+testGridColumnsValues("gridAutoMultipleItems", "30px");
+testGridColumnsValues("gridMinMaxAutoAutoMultipleItemsOneWithoutMinWidth", "60px");
+testGridColumnsValues("gridMinMaxAutoMaxContentMultipleItemsOneWithAutoMinWidth", "80px");
+
+debug("");
+debug("Check that min-width is honored when sizing auto columns and spanning grid items.");
+testGridColumnsValues("gridAutoAndAutoOneSpanningOneNonSpannig", "35px 15px");
+testGridColumnsValues("gridAutoAndAutoOneSpanningMultipleNonSpanning", "20px 40px");
+testGridColumnsValues("gridAutoAndMinMaxAutoAutoOneSpanningOneNonSpanning", "20px 50px");
+testGridColumnsValues("gridAutoAndMinMaxAutoAutoMultipleSpanning", "35px 35px");
+testGridColumnsValues("gridMinMaxAutoMaxContentAndAutoOneSpanningMultipleNonSpanning", "25px 65px");
+testGridColumnsValues("gridMinMaxAutoMaxContentAndAutoMultipleSpanningMultipleNonSpanning", "40px 50px");
+
+debug("");
+debug("Check the interactions between width and min-width and auto tracks.");
+testGridColumnsValues("gridAutoWithFixedWidthChild", "60px");
+testGridColumnsValues("gridAutoWithFixedWidthChildAndMinWidth", "40px");
+testGridColumnsValues("gridAutoWithFixedWidthChildAndHigherMinWidth", "90px");
+testGridColumnsValues("gridAutoAndAutoOneSpanningFixedWidth", "25px 25px");
+testGridColumnsValues("gridAutoAndAutoOneSpanningFixedWidthAndMinWidth", "25px 25px");
+testGridColumnsValues("gridAutoAndAutoOneSpanningFixedWidthAndHigherMinWidth", "35px 35px");
+
+debug("");
+debug("Check that borders and paddings are considering when computing min sizes.");
+testGridColumnsValues("gridAutoFixedMinWidthWithBorder", "50px");
+testGridColumnsValues("gridAutoFixedMinWidthWithPadding", "56px");
+testGridColumnsValues("gridAutoFixedMinWidthWithBorderAndPadding", "66px");
+testGridColumnsValues("gridAutoAutoMinWidthWithBorder", "40px");
+testGridColumnsValues("gridAutoAutoMinWidthWithPadding", "46px");
+testGridColumnsValues("gridAutoAutoMinWidthWithBorderAndPadding", "56px");
+testGridColumnsValues("gridAutoMaxContentMinWidthWithBorder", "90px");
+testGridColumnsValues("gridAutoMaxContentMinWidthWithPadding", "96px");
+testGridColumnsValues("gridAutoMaxContentMinWidthWithBorderAndPadding", "106px");
+
+</script>
+</body>
+</html>
diff --git a/LayoutTests/fast/css-grid-layout/grid-automatic-minimum-for-auto-rows-expected.txt b/LayoutTests/fast/css-grid-layout/grid-automatic-minimum-for-auto-rows-expected.txt
new file mode 100644 (file)
index 0000000..4d4aa95
--- /dev/null
@@ -0,0 +1,102 @@
+
+Check that min-height is honored when sizing auto rows.
+PASS window.getComputedStyle(gridAuto, '').getPropertyValue('-webkit-grid-template-rows') is "40px"
+PASS window.getComputedStyle(gridAutoItemSmallerThanMinSize, '').getPropertyValue('-webkit-grid-template-rows') is "40px"
+PASS window.getComputedStyle(gridMinMaxAutoAuto, '').getPropertyValue('-webkit-grid-template-rows') is "40px"
+PASS window.getComputedStyle(gridMinMaxAutoMaxContent, '').getPropertyValue('-webkit-grid-template-rows') is "20px"
+PASS window.getComputedStyle(gridMinMaxMinContentAuto, '').getPropertyValue('-webkit-grid-template-rows') is "60px"
+PASS window.getComputedStyle(gridAutoMultipleItems, '').getPropertyValue('-webkit-grid-template-rows') is "60px"
+PASS window.getComputedStyle(gridMinMaxAutoAutoMultipleItemsOneWithoutMinHeight, '').getPropertyValue('-webkit-grid-template-rows') is "50px"
+PASS window.getComputedStyle(gridMinMaxAutoMaxContentMultipleItemsOneWithAutoMinHeight, '').getPropertyValue('-webkit-grid-template-rows') is "60px"
+
+Check that min-height is honored when sizing auto rows and spanning grid items.
+PASS window.getComputedStyle(gridAutoAndAutoOneSpanningOneNonSpannig, '').getPropertyValue('-webkit-grid-template-rows') is "10px 40px"
+PASS window.getComputedStyle(gridAutoAndAutoOneSpanningMultipleNonSpanning, '').getPropertyValue('-webkit-grid-template-rows') is "40px 20px"
+PASS window.getComputedStyle(gridAutoAndMinMaxAutoAutoOneSpanningOneNonSpanning, '').getPropertyValue('-webkit-grid-template-rows') is "40px 30px"
+PASS window.getComputedStyle(gridAutoAndMinMaxAutoAutoMultipleSpanning, '').getPropertyValue('-webkit-grid-template-rows') is "35px 35px"
+PASS window.getComputedStyle(gridMinMaxAutoMaxContentAndAutoOneSpanningMultipleNonSpanning, '').getPropertyValue('-webkit-grid-template-rows') is "25px 65px"
+PASS window.getComputedStyle(gridMinMaxAutoMaxContentAndAutoMultipleSpanningMultipleNonSpanning, '').getPropertyValue('-webkit-grid-template-rows') is "50px 40px"
+
+Check the interactions between height and min-height and auto tracks.
+PASS window.getComputedStyle(gridAutoWithFixedHeightChild, '').getPropertyValue('-webkit-grid-template-rows') is "60px"
+PASS window.getComputedStyle(gridAutoWithFixedHeightChildAndMinHeight, '').getPropertyValue('-webkit-grid-template-rows') is "40px"
+PASS window.getComputedStyle(gridAutoWithFixedHeightChildAndHigherMinHeight, '').getPropertyValue('-webkit-grid-template-rows') is "90px"
+PASS window.getComputedStyle(gridAutoAndAutoOneSpanningFixedHeight, '').getPropertyValue('-webkit-grid-template-rows') is "25px 25px"
+PASS window.getComputedStyle(gridAutoAndAutoOneSpanningFixedHeightAndMinHeight, '').getPropertyValue('-webkit-grid-template-rows') is "25px 25px"
+PASS window.getComputedStyle(gridAutoAndAutoOneSpanningFixedHeightAndHigherMinHeight, '').getPropertyValue('-webkit-grid-template-rows') is "35px 35px"
+
+Check that borders and paddings are considering when computing min sizes.
+PASS window.getComputedStyle(gridAutoFixedMinHeightWithBorder, '').getPropertyValue('-webkit-grid-template-rows') is "50px"
+PASS window.getComputedStyle(gridAutoFixedMinHeightWithPadding, '').getPropertyValue('-webkit-grid-template-rows') is "56px"
+PASS window.getComputedStyle(gridAutoFixedMinHeightWithBorderAndPadding, '').getPropertyValue('-webkit-grid-template-rows') is "66px"
+PASS window.getComputedStyle(gridAutoAutoMinHeightWithBorder, '').getPropertyValue('-webkit-grid-template-rows') is "40px"
+PASS window.getComputedStyle(gridAutoAutoMinHeightWithPadding, '').getPropertyValue('-webkit-grid-template-rows') is "46px"
+PASS window.getComputedStyle(gridAutoAutoMinHeightWithBorderAndPadding, '').getPropertyValue('-webkit-grid-template-rows') is "56px"
+PASS window.getComputedStyle(gridAutoMaxContentMinHeightWithBorder, '').getPropertyValue('-webkit-grid-template-rows') is "30px"
+PASS window.getComputedStyle(gridAutoMaxContentMinHeightWithPadding, '').getPropertyValue('-webkit-grid-template-rows') is "36px"
+PASS window.getComputedStyle(gridAutoMaxContentMinHeightWithBorderAndPadding, '').getPropertyValue('-webkit-grid-template-rows') is "46px"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+XX
+XXX
+XX
+XXX
+XXXX
+XX
+XX
+XX
+X
+X
+X
+XXX
+X
+XX
+XX
+X
+X
+XXXX
+X
+XX
+XXX
+X
+X
+XX
+XXX
+XX
+XXX
+XX
+XX XX
+XXXXXX X XXX
+XX XX XX
+X X X X
+XX XX
+X XXX XX
+XXX XXXX
+XX XX XX
+XXXXX X XXXXX
+X XXX XX
+XXXXX XXXXX
+XX XX
+XX XX XX XX
+XXX
+X XX XXX
+X XX X
+XXX X
+XXX X
+XXX X
+XX XXX XX XXX XX XXX
+XX XXX XX
+XX XXX XX X XX
+XXXXXX
+XXXXXX
+XXXXXX
+XX
+XXX X
+XX
+XXX X
+XX
+XXX X
+XXX X
+XXX X
+XXX X
diff --git a/LayoutTests/fast/css-grid-layout/grid-automatic-minimum-for-auto-rows.html b/LayoutTests/fast/css-grid-layout/grid-automatic-minimum-for-auto-rows.html
new file mode 100644 (file)
index 0000000..afc42ab
--- /dev/null
@@ -0,0 +1,261 @@
+<html>
+<link href="resources/grid.css" rel="stylesheet"/>
+<style>
+.grid { font: 10px/1 Ahem; }
+
+.minHeight10 { min-height: 10px; }
+.minHeight20 { min-height: 20px; }
+.minHeight30 { min-height: 30px; }
+.minHeight40 { min-height: 40px; }
+.minHeight50 { min-height: 50px; }
+.minHeight60 { min-height: 60px; }
+.minHeight70 { min-height: 70px; }
+.minHeight90 { min-height: 90px; }
+.minHeightMaxContent { min-height: -webkit-max-content; }
+
+.height30 { height: 30px; }
+.height50 { height: 50px; }
+.height60 { height: 60px; }
+
+.border5 { border: 5px solid #abc; }
+.padding8 { padding: 8px 0px; }
+
+/* All these 4 cases are equivalent. We use them interchangeably. */
+.gridAuto { -webkit-grid-template-rows: auto; }
+.gridMinMaxAutoAuto { -webkit-grid-template-rows: minmax(auto, auto); }
+.gridMinMaxAutoMaxContent { -webkit-grid-template-rows: minmax(auto, -webkit-max-content); }
+.gridMinMaxMinContentAuto { -webkit-grid-template-rows: minmax(-webkit-min-content, auto); }
+
+/* All these 3 cases are equivalent. We use them interchangeably. */
+.gridAutoAndAuto { -webkit-grid-template-rows: auto auto; }
+.gridAutoAndMinMaxAutoAuto { -webkit-grid-template-rows: auto minmax(auto, auto); }
+.gridMinMaxAutoMaxContentAndAuto { -webkit-grid-template-rows: minmax(auto, -webkit-max-content) auto; }
+
+</style>
+<script src="../../resources/js-test.js"></script>
+<body>
+
+<div class="grid gridAuto constrainedContainer" id="gridAuto">
+    <div class="firstRowFirstColumn minHeight40">XX<br>XXX<br>XX<br>XXX<br>XXXX</div>
+</div>
+
+<div class="grid gridAuto constrainedContainer" id="gridAutoItemSmallerThanMinSize">
+    <div class="firstRowFirstColumn minHeight40">XX</div>
+</div>
+
+<div class="grid gridMinMaxAutoAuto constrainedContainer" id="gridMinMaxAutoAuto">
+    <div class="firstRowFirstColumn minHeight40">XX<br>XX</div>
+</div>
+
+<div class="grid gridMinMaxAutoMaxContent constrainedContainer" id="gridMinMaxAutoMaxContent">
+    <div class="firstRowFirstColumn minHeight20 height30"></div>
+</div>
+
+<div class="grid gridMinMaxMinContentAuto constrainedContainer" id="gridMinMaxMinContentAuto">
+    <div class="firstRowFirstColumn minHeight60">X</div>
+</div>
+
+<div class="grid gridAuto constrainedContainer" id="gridAutoMultipleItems">
+    <div class="firstRowFirstColumn minHeight60">X<br>X</div>
+    <div class="firstRowSecondColumn minHeight20"">XXX<br>X<br>XX<br>XX</div>
+    <div class="firstRowAutoColumn minConstrainedContainer height50"></div>
+</div>
+
+<div class="grid gridMinMaxAutoAuto constrainedContainer" id="gridMinMaxAutoAutoMultipleItemsOneWithoutMinHeight">
+    <div class="firstRowFirstColumn height30">X<br>X</div>
+    <div class="firstRowSecondColumn minHeight50"></div>
+    <div class="firstRowAutoColumn minHeight20">XXXX<br>X<br>XX<br>XXX</div>
+</div>
+
+<div class="grid gridMinMaxAutoMaxContent constrainedContainer" id="gridMinMaxAutoMaxContentMultipleItemsOneWithAutoMinHeight">
+    <div class="firstRowFirstColumn minHeight30">X<br>X</div>
+    <div class="firstRowSecondColumn height60">XX</div>
+    <div class="firstRowAutoColumn minHeight20">XXX<br>XX<br>XXX<br>XX</div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAutoAndAuto" id="gridAutoAndAutoOneSpanningOneNonSpannig">
+       <div class="firstRowFirstColumn">XX XX</div>
+       <div class="bothRowFirstColumn minHeight50">XXXXXX X XXX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAutoAndAuto" id="gridAutoAndAutoOneSpanningMultipleNonSpanning">
+       <div class="bothRowSecondColumn minHeight60">XX XX XX</div>
+       <div class="firstRowFirstColumn">X X X X</div>
+       <div class="firstRowFirstColumn">XX XX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAutoAndMinMaxAutoAuto" id="gridAutoAndMinMaxAutoAutoOneSpanningOneNonSpanning">
+       <div class="secondRowFirstColumn">X XXX XX</div>
+       <div class="bothRowSecondColumn minHeight70">XXX XXXX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAutoAndMinMaxAutoAuto" id="gridAutoAndMinMaxAutoAutoMultipleSpanning">
+       <div class="bothRowSecondColumn minHeight70">XX XX XX</div>
+       <div class="bothRowFirstColumn">XXXXX X XXXXX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridMinMaxAutoMaxContentAndAuto" id="gridMinMaxAutoMaxContentAndAutoOneSpanningMultipleNonSpanning">
+       <div class="secondRowFirstColumn minHeight60">X XXX XX</div>
+       <div class="bothRowSecondColumn minHeight90">XXXXX XXXXX</div>
+       <div class="firstRowFirstColumn">XX XX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridMinMaxAutoMaxContentAndAuto" id="gridMinMaxAutoMaxContentAndAutoMultipleSpanningMultipleNonSpanning">
+       <div class="bothRowSecondColumn">XX XX XX XX</div>
+       <div class="firstRowFirstColumn minHeight40">XXX</div>
+       <div class="bothRowFirstColumn minHeight90">X XX XXX</div>
+       <div class="secondRowFirstColumn">X XX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoWithFixedHeightChild">
+       <div class="firstRowFirstColumn height60">XXX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto height30" id="gridAutoWithFixedHeightChildAndMinHeight">
+       <div class="firstRowFirstColumn height60 minHeight40">XXX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoWithFixedHeightChildAndHigherMinHeight">
+       <div class="firstRowFirstColumn height60 minHeight90">XXX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAutoAndAuto" id="gridAutoAndAutoOneSpanningFixedHeight">
+       <div class="bothRowFirstColumn height50">XX XXX XX XXX XX XXX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAutoAndAuto height30" id="gridAutoAndAutoOneSpanningFixedHeightAndMinHeight">
+       <div class="bothRowFirstColumn height60 minHeight50">XX XXX XX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAutoAndAuto" id="gridAutoAndAutoOneSpanningFixedHeightAndHigherMinHeight">
+       <div class="bothRowFirstColumn height60 minHeight70">XX XXX XX X XX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoFixedMinHeightWithBorder">
+        <div class="firstRowFirstColumn minHeight40 border5">XXXXXX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoFixedMinHeightWithPadding">
+       <div class="firstRowFirstColumn minHeight40 padding8">XXXXXX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoFixedMinHeightWithBorderAndPadding">
+       <div class="firstRowFirstColumn minHeight40 border5 padding8">XXXXXX</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoAutoMinHeightWithBorder">
+       <div class="firstRowFirstColumn border5">XX<br>XXX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoAutoMinHeightWithPadding">
+       <div class="firstRowFirstColumn padding8">XX<br>XXX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoAutoMinHeightWithBorderAndPadding">
+       <div class="firstRowFirstColumn border5 padding8">XX<br>XXX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoMaxContentMinHeightWithBorder">
+       <div class="firstRowFirstColumn minHeightMaxContent border5">XXX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoMaxContentMinHeightWithPadding">
+       <div class="firstRowFirstColumn minHeightMaxContent padding8">XXX X</div>
+    </div>
+</div>
+
+<div class="constrainedContainer">
+    <div class="grid gridAuto" id="gridAutoMaxContentMinHeightWithBorderAndPadding">
+       <div class="firstRowFirstColumn border5 padding8 minHeightMaxContent">XXX X</div>
+    </div>
+</div>
+
+<script>
+function testGridRowsValues(id, computedRowValue)
+{
+    shouldBeEqualToString("window.getComputedStyle(" + id + ", '').getPropertyValue('-webkit-grid-template-rows')", computedRowValue);
+}
+
+debug("");
+debug("Check that min-height is honored when sizing auto rows.");
+testGridRowsValues("gridAuto", "40px");
+testGridRowsValues("gridAutoItemSmallerThanMinSize", "40px");
+testGridRowsValues("gridMinMaxAutoAuto", "40px");
+testGridRowsValues("gridMinMaxAutoMaxContent", "20px");
+testGridRowsValues("gridMinMaxMinContentAuto", "60px");
+testGridRowsValues("gridAutoMultipleItems", "60px");
+testGridRowsValues("gridMinMaxAutoAutoMultipleItemsOneWithoutMinHeight", "50px");
+testGridRowsValues("gridMinMaxAutoMaxContentMultipleItemsOneWithAutoMinHeight", "60px");
+
+debug("");
+debug("Check that min-height is honored when sizing auto rows and spanning grid items.");
+testGridRowsValues("gridAutoAndAutoOneSpanningOneNonSpannig", "10px 40px");
+testGridRowsValues("gridAutoAndAutoOneSpanningMultipleNonSpanning", "40px 20px");
+testGridRowsValues("gridAutoAndMinMaxAutoAutoOneSpanningOneNonSpanning", "40px 30px");
+testGridRowsValues("gridAutoAndMinMaxAutoAutoMultipleSpanning", "35px 35px");
+testGridRowsValues("gridMinMaxAutoMaxContentAndAutoOneSpanningMultipleNonSpanning", "25px 65px");
+testGridRowsValues("gridMinMaxAutoMaxContentAndAutoMultipleSpanningMultipleNonSpanning", "50px 40px");
+
+debug("");
+debug("Check the interactions between height and min-height and auto tracks.");
+testGridRowsValues("gridAutoWithFixedHeightChild", "60px");
+testGridRowsValues("gridAutoWithFixedHeightChildAndMinHeight", "40px");
+testGridRowsValues("gridAutoWithFixedHeightChildAndHigherMinHeight", "90px");
+testGridRowsValues("gridAutoAndAutoOneSpanningFixedHeight", "25px 25px");
+testGridRowsValues("gridAutoAndAutoOneSpanningFixedHeightAndMinHeight", "25px 25px");
+testGridRowsValues("gridAutoAndAutoOneSpanningFixedHeightAndHigherMinHeight", "35px 35px");
+
+debug("");
+debug("Check that borders and paddings are considering when computing min sizes.");
+testGridRowsValues("gridAutoFixedMinHeightWithBorder", "50px");
+testGridRowsValues("gridAutoFixedMinHeightWithPadding", "56px");
+testGridRowsValues("gridAutoFixedMinHeightWithBorderAndPadding", "66px");
+testGridRowsValues("gridAutoAutoMinHeightWithBorder", "40px");
+testGridRowsValues("gridAutoAutoMinHeightWithPadding", "46px");
+testGridRowsValues("gridAutoAutoMinHeightWithBorderAndPadding", "56px");
+testGridRowsValues("gridAutoMaxContentMinHeightWithBorder", "30px");
+testGridRowsValues("gridAutoMaxContentMinHeightWithPadding", "36px");
+testGridRowsValues("gridAutoMaxContentMinHeightWithBorderAndPadding", "46px");
+
+</script>
+</body>
+</html>
index f3afef2..30d8687 100644 (file)
@@ -42,6 +42,8 @@ PASS window.getComputedStyle(gridWithCalcInsideMinMaxElement, '').getPropertyVal
 PASS window.getComputedStyle(gridWithCalcInsideMinMaxElement, '').getPropertyValue('-webkit-grid-template-rows') is "300px"
 PASS window.getComputedStyle(gridWithCalcComplexInsideMinMaxElement, '').getPropertyValue('-webkit-grid-template-columns') is "415px"
 PASS window.getComputedStyle(gridWithCalcComplexInsideMinMaxElement, '').getPropertyValue('-webkit-grid-template-rows') is "300px"
+PASS window.getComputedStyle(gridWithAutoInsideMinMaxElement, '').getPropertyValue('-webkit-grid-template-columns') is "20px"
+PASS window.getComputedStyle(gridWithAutoInsideMinMaxElement, '').getPropertyValue('-webkit-grid-template-rows') is "11px"
 
 Test getting wrong values for -webkit-grid-template-columns and -webkit-grid-template-rows through CSS (they should resolve to the default: 'none')
 PASS window.getComputedStyle(gridWithFitContentElement, '').getPropertyValue('-webkit-grid-template-columns') is "none"
@@ -100,6 +102,10 @@ PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-colum
 PASS element.style.webkitGridTemplateColumns is "minmax(-webkit-min-content, -webkit-max-content)"
 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "0px"
 PASS element.style.webkitGridTemplateRows is "minmax(-webkit-max-content, -webkit-min-content)"
+PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is "0px"
+PASS element.style.webkitGridTemplateColumns is "minmax(auto, -webkit-max-content)"
+PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "80px"
+PASS element.style.webkitGridTemplateRows is "minmax(10vw, auto)"
 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is "800px"
 PASS element.style.webkitGridTemplateColumns is "3600fr"
 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "600px"
@@ -156,8 +162,6 @@ PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-templat
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "none"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is "none"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "none"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is "none"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "none"
 
 Test setting grid-template-columns and grid-template-rows back to 'none' through JS
 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is "18px"
index 8228749..4385132 100644 (file)
@@ -40,6 +40,8 @@ PASS window.getComputedStyle(gridWithCalcAndMinMax, '').getPropertyValue('-webki
 PASS window.getComputedStyle(gridWithCalcAndMinMax, '').getPropertyValue('-webkit-grid-template-rows') is "150px 53px"
 PASS window.getComputedStyle(gridWithCalcInsideMinMax, '').getPropertyValue('-webkit-grid-template-columns') is "400px 120px"
 PASS window.getComputedStyle(gridWithCalcInsideMinMax, '').getPropertyValue('-webkit-grid-template-rows') is "150px 175px"
+PASS window.getComputedStyle(gridWithAutoInsideMinMax, '').getPropertyValue('-webkit-grid-template-columns') is "0px 30px"
+PASS window.getComputedStyle(gridWithAutoInsideMinMax, '').getPropertyValue('-webkit-grid-template-rows') is "132px 60px"
 
 Test the initial value
 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is 'none'
@@ -78,6 +80,10 @@ PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-colum
 PASS element.style.webkitGridTemplateColumns is "calc(25px + 40%) minmax(-webkit-min-content, calc(10% + 12px))"
 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "100px 0px"
 PASS element.style.webkitGridTemplateRows is "minmax(calc(75% - 350px), -webkit-max-content) auto"
+PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is "0px 16px"
+PASS element.style.webkitGridTemplateColumns is "auto minmax(16px, auto)"
+PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "90px 80px"
+PASS element.style.webkitGridTemplateRows is "minmax(auto, 15%) 10vw"
 
 Test getting wrong values set from CSS
 PASS window.getComputedStyle(gridWithNoneAndAuto, '').getPropertyValue('-webkit-grid-template-columns') is "none"
@@ -106,8 +112,6 @@ PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-templat
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "none"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is "none"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "none"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is "none"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "none"
 
 Test setting grid-template-columns and grid-template-rows to 'inherit' through JS
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is "50px 750px [last]"
index f49990e..c8a58f1 100644 (file)
     -webkit-grid-template-rows: calc(150px) minmax(5%, calc(50% - 125px));
     font: 10px Ahem;
 }
+.gridWithAutoInsideMinMax {
+    -webkit-grid-template-columns: minmax(auto, -webkit-min-content) 30px;
+    -webkit-grid-template-rows: calc(100px + 2em) minmax(10%, auto);
+}
 </style>
 <script src="../../resources/js-test-pre.js"></script>
 </head>
 <div class="grid gridWithCalcAndFixed" id="gridWithCalcAndFixed"></div>
 <div class="grid gridWithCalcAndMinMax" id="gridWithCalcAndMinMax"></div>
 <div class="grid gridWithCalcInsideMinMax" id="gridWithCalcInsideMinMax"></div>
+<div class="grid gridWithAutoInsideMinMax" id="gridWithAutoInsideMinMax"></div>
 <script src="resources/grid-definitions-parsing-utils.js"></script>
 <script src="resources/grid-columns-rows-get-set-multiple.js"></script>
 <script src="../../resources/js-test-post.js"></script>
index 4fe76cd..e53b3d4 100644 (file)
@@ -1,4 +1,4 @@
-<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
+<!DOCTYPE html>
 <html>
 <head>
 <link href="resources/grid.css" rel="stylesheet">
     -webkit-grid-template-columns: minmax(10%, calc(50% + 15px));
     -webkit-grid-template-rows: minmax(calc(20px + 10%), 50%);
 }
+.gridWithAutoInsideMinMax {
+    -webkit-grid-template-columns: minmax(auto, 20px);
+    -webkit-grid-template-rows: minmax(max-content, auto);
+}
 </style>
 <script src="../../resources/js-test-pre.js"></script>
 </head>
 <div class="grid gridWithCalcComplex" id="gridWithCalcComplexElement"></div>
 <div class="grid gridWithCalcInsideMinMax" id="gridWithCalcInsideMinMaxElement"></div>
 <div class="grid gridWithCalcComplexInsideMinMax" id="gridWithCalcComplexInsideMinMaxElement"></div>
+<div class="grid gridWithAutoInsideMinMax" id="gridWithAutoInsideMinMaxElement">
+    <div class="gridItem"></div>
+</div>
 <script src="resources/grid-definitions-parsing-utils.js"></script>
 <script src="resources/grid-columns-rows-get-set.js"></script>
 <script src="../../resources/js-test-post.js"></script>
index d70adf3..288337e 100644 (file)
@@ -32,6 +32,8 @@ PASS window.getComputedStyle(gridWithCalcInsideMinMax, '').getPropertyValue('-we
 PASS window.getComputedStyle(gridWithCalcInsideMinMax, '').getPropertyValue('-webkit-grid-template-rows') is "minmax(20px, 50%)"
 PASS window.getComputedStyle(gridWithCalcComplexInsideMinMax, '').getPropertyValue('-webkit-grid-template-columns') is "minmax(10%, calc(50% + 15px))"
 PASS window.getComputedStyle(gridWithCalcComplexInsideMinMax, '').getPropertyValue('-webkit-grid-template-rows') is "minmax(calc(20px + 10%), 50%)"
+PASS window.getComputedStyle(gridWithAutoInsideMinMax, '').getPropertyValue('-webkit-grid-template-columns') is "minmax(auto, 20px)"
+PASS window.getComputedStyle(gridWithAutoInsideMinMax, '').getPropertyValue('-webkit-grid-template-rows') is "minmax(-webkit-min-content, auto)"
 
 Test getting wrong values for grid-template-columns and grid-template-rows through CSS (they should resolve to the default: 'none')
 PASS window.getComputedStyle(gridWithFitContentElement, '').getPropertyValue('-webkit-grid-template-columns') is "none"
@@ -104,6 +106,10 @@ PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-colum
 PASS element.style.webkitGridTemplateColumns is "3fr"
 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "4fr"
 PASS element.style.webkitGridTemplateRows is "4fr"
+PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is "minmax(auto, 48px)"
+PASS element.style.webkitGridTemplateColumns is "minmax(auto, 8vh)"
+PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "minmax(80px, auto)"
+PASS element.style.webkitGridTemplateRows is "minmax(10vw, auto)"
 
 Test setting grid-template-columns and grid-template-rows to bad values through JS
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is "none"
@@ -126,8 +132,6 @@ PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-templat
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "none"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is "none"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "none"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is "none"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "none"
 
 Test setting grid-template-columns and grid-template-rows back to 'none' through JS
 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is "18px"
index 94a3876..bd85dab 100644 (file)
@@ -36,6 +36,8 @@ PASS window.getComputedStyle(gridWithCalcAndMinMax, '').getPropertyValue('-webki
 PASS window.getComputedStyle(gridWithCalcAndMinMax, '').getPropertyValue('-webkit-grid-template-rows') is "minmax(25%, -webkit-max-content) calc(10% - 7px)"
 PASS window.getComputedStyle(gridWithCalcInsideMinMax, '').getPropertyValue('-webkit-grid-template-columns') is "minmax(calc(23px + 10%), 400px) 120px"
 PASS window.getComputedStyle(gridWithCalcInsideMinMax, '').getPropertyValue('-webkit-grid-template-rows') is "150px minmax(5%, calc(50% - 125px))"
+PASS window.getComputedStyle(gridWithAutoInsideMinMax, '').getPropertyValue('-webkit-grid-template-columns') is "minmax(auto, 20px) 10%"
+PASS window.getComputedStyle(gridWithAutoInsideMinMax, '').getPropertyValue('-webkit-grid-template-rows') is "-webkit-max-content minmax(-webkit-min-content, auto)"
 
 Test the initial value
 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is 'none'
@@ -70,6 +72,10 @@ PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-colum
 PASS element.style.webkitGridTemplateColumns is "50% 12vw"
 PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "5% 510px"
 PASS element.style.webkitGridTemplateRows is "5% 85vh"
+PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is "auto minmax(16px, auto)"
+PASS element.style.webkitGridTemplateColumns is "auto minmax(16px, auto)"
+PASS getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "minmax(auto, 15%) 80px"
+PASS element.style.webkitGridTemplateRows is "minmax(auto, 15%) 10vw"
 
 Test getting wrong values set from CSS
 PASS getComputedStyle(gridWithNoneAndAuto, '').getPropertyValue('-webkit-grid-template-columns') is 'none'
@@ -94,8 +100,6 @@ PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-templat
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "none"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is "none"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "none"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is "none"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-rows') is "none"
 
 Test setting grid-template-columns and grid-template-rows to 'inherit' through JS
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-grid-template-columns') is "50px 1fr [last]"
index a67f9eb..c169ccd 100644 (file)
     -webkit-grid-template-rows: calc(150px) minmax(5%, calc(50% - 125px));
     font: 10px Ahem;
 }
+.gridWithAutoInsideMinMax {
+    -webkit-grid-template-columns: minmax(auto, 20px) 10%;
+    -webkit-grid-template-rows: -webkit-max-content minmax(-webkit-min-content, auto);
+}
 </style>
 <script src="../../resources/js-test-pre.js"></script>
 </head>
 <div class="gridWithCalcAndFixed" id="gridWithCalcAndFixed"></div>
 <div class="gridWithCalcAndMinMax" id="gridWithCalcAndMinMax"></div>
 <div class="gridWithCalcInsideMinMax" id="gridWithCalcInsideMinMax"></div>
+<div class="gridWithAutoInsideMinMax" id="gridWithAutoInsideMinMax"></div>
 <script src="resources/grid-definitions-parsing-utils.js"></script>
 <script src="resources/non-grid-columns-rows-get-set-multiple.js"></script>
 <script src="../../resources/js-test-post.js"></script>
index b03520f..7cf2479 100644 (file)
     -webkit-grid-template-columns: minmax(10%, calc(50% + 15px));
     -webkit-grid-template-rows: minmax(calc(20px + 10%), 50%);
 }
+.gridWithAutoInsideMinMax {
+    -webkit-grid-template-columns: minmax(auto, 20px);
+    -webkit-grid-template-rows: minmax(-webkit-min-content, auto);
+}
 </style>
 <script src="../../resources/js-test-pre.js"></script>
 </head>
@@ -88,6 +92,7 @@
 <div class="gridWithCalcComplex" id="gridWithCalcComplex"></div>
 <div class="gridWithCalcInsideMinMax" id="gridWithCalcInsideMinMax"></div>
 <div class="gridWithCalcComplexInsideMinMax" id="gridWithCalcComplexInsideMinMax"></div>
+<div class="gridWithAutoInsideMinMax" id="gridWithAutoInsideMinMax"></div>
 <script src="resources/grid-definitions-parsing-utils.js"></script>
 <script src="resources/non-grid-columns-rows-get-set.js"></script>
 <script src="../../resources/js-test-post.js"></script>
index de8f729..3c41c9f 100644 (file)
@@ -19,6 +19,7 @@ testGridTemplatesValues(document.getElementById("gridWithCalcCalc"), "200px 100p
 testGridTemplatesValues(document.getElementById("gridWithCalcAndFixed"), "50% 80px", "88px 25%", "400px 80px", "88px 150px");
 testGridTemplatesValues(document.getElementById("gridWithCalcAndMinMax"), "190px minmax(-webkit-min-content, 80px)", "minmax(25%, -webkit-max-content) 53px", "190px 80px", "150px 53px");
 testGridTemplatesValues(document.getElementById("gridWithCalcInsideMinMax"), "minmax(103px, 400px) 120px", "150px minmax(5%, 175px)", "400px 120px", "150px 175px");
+testGridTemplatesValues(document.getElementById("gridWithAutoInsideMinMax"), "0px 30px", "132px 60px");
 
 debug("");
 debug("Test the initial value");
@@ -37,6 +38,7 @@ testGridTemplatesSetJSValues("16em minmax(16px, 20px)", "minmax(10%, 15%) auto",
 testGridTemplatesSetJSValues("16em 2fr", "14fr auto", "160px 640px", "600px 0px");
 testGridTemplatesSetJSValues("calc(25px) calc(2em)", "auto calc(10%)", "25px 20px", "0px 60px", "calc(25px) calc(2em)", "auto calc(10%)");
 testGridTemplatesSetJSValues("calc(25px + 40%) minmax(-webkit-min-content, calc(10% + 12px))", "minmax(calc(75% - 350px), -webkit-max-content) auto", "345px 92px", "100px 0px", "calc(25px + 40%) minmax(-webkit-min-content, calc(10% + 12px))", "minmax(calc(75% - 350px), -webkit-max-content) auto");
+testGridTemplatesSetJSValues("auto minmax(16px, auto)", "minmax(auto, 15%) 10vw", "0px 16px", "90px 80px");
 
 debug("");
 debug("Test getting wrong values set from CSS");
@@ -51,7 +53,6 @@ testGridTemplatesSetBadJSValues("none none", "none none");
 testGridTemplatesSetBadJSValues("auto none", "auto none");
 testGridTemplatesSetBadJSValues("auto none 16em", "auto 18em none");
 testGridTemplatesSetBadJSValues("-webkit-fit-content -webkit-fit-content", "-webkit-fit-available -webkit-fit-available");
-testGridTemplatesSetBadJSValues("auto minmax(16px, auto)", "minmax(auto, 15%) 10vw");
 
 // Negative values are not allowed.
 testGridTemplatesSetBadJSValues("-10px minmax(16px, 32px)", "minmax(10%, 15%) -10vw");
index 3dc9f7b..5fc6457 100644 (file)
@@ -20,6 +20,7 @@ testGridTemplatesValues(document.getElementById("gridWithCalcElement"), "150px",
 testGridTemplatesValues(document.getElementById("gridWithCalcComplexElement"), "550px", "465px");
 testGridTemplatesValues(document.getElementById("gridWithCalcInsideMinMaxElement"), "minmax(10%, 15px)", "minmax(20px, 50%)", "80px", "300px");
 testGridTemplatesValues(document.getElementById("gridWithCalcComplexInsideMinMaxElement"), "minmax(10%, 415px)", "minmax(80px, 50%)", "415px", "300px");
+testGridTemplatesValues(document.getElementById("gridWithAutoInsideMinMaxElement"), "20px", "11px");
 
 debug("");
 debug("Test getting wrong values for -webkit-grid-template-columns and -webkit-grid-template-rows through CSS (they should resolve to the default: 'none')");
@@ -51,6 +52,7 @@ testGridTemplatesSetJSValues("minmax(22em, 8vh)", "minmax(10vw, 5em)", "220px",
 testGridTemplatesSetJSValues("minmax(-webkit-min-content, 8vh)", "minmax(10vw, -webkit-min-content)", "48px", "80px");
 testGridTemplatesSetJSValues("minmax(22em, -webkit-max-content)", "minmax(-webkit-max-content, 5em)", "220px", "50px");
 testGridTemplatesSetJSValues("minmax(-webkit-min-content, -webkit-max-content)", "minmax(-webkit-max-content, -webkit-min-content)", "0px", "0px");
+testGridTemplatesSetJSValues("minmax(auto, -webkit-max-content)", "minmax(10vw, auto)", "0px", "80px");
 // Unit comparison should be case-insensitive.
 testGridTemplatesSetJSValues("3600Fr", "154fR", "800px", "600px", "3600fr", "154fr");
 
@@ -76,8 +78,6 @@ testGridTemplatesSetBadJSValues("minmax(minmax(10px, 20px), 20px)", "minmax(10px
 // No breadth value and no comma.
 testGridTemplatesSetBadJSValues("minmax()", "minmax(30px 30% 30em)");
 
-// Auto is not allowed inside minmax.
-testGridTemplatesSetBadJSValues("minmax(auto, 8vh)", "minmax(10vw, auto)");
 testGridTemplatesSetBadJSValues("-2fr", "3ffr");
 testGridTemplatesSetBadJSValues("-2.05fr", "+-3fr");
 testGridTemplatesSetBadJSValues("0fr", "1r");
index 395ee7c..b780d82 100644 (file)
@@ -17,6 +17,7 @@ testGridTemplatesValues(document.getElementById("gridWithCalcCalc"), "200px 100p
 testGridTemplatesValues(document.getElementById("gridWithCalcAndFixed"), "50% 80px", "88px 25%");
 testGridTemplatesValues(document.getElementById("gridWithCalcAndMinMax"), "calc(30px + 20%) minmax(-webkit-min-content, 80px)", "minmax(25%, -webkit-max-content) calc(10% - 7px)");
 testGridTemplatesValues(document.getElementById("gridWithCalcInsideMinMax"), "minmax(calc(23px + 10%), 400px) 120px", "150px minmax(5%, calc(50% - 125px))");
+testGridTemplatesValues(document.getElementById("gridWithAutoInsideMinMax"), "minmax(auto, 20px) 10%", "-webkit-max-content minmax(-webkit-min-content, auto)");
 
 debug("");
 debug("Test the initial value");
@@ -34,6 +35,7 @@ testNonGridTemplatesSetJSValues("auto 16em 22px", "56% 10em auto", "auto 160px 2
 testNonGridTemplatesSetJSValues("16em minmax(16px, 20px)", "minmax(10%, 15%) auto", "160px minmax(16px, 20px)");
 testNonGridTemplatesSetJSValues("16em 2fr", "14fr auto", "160px 2fr");
 testNonGridTemplatesSetJSValues("50% 12vw", "5% 85vh", "50% 96px", "5% 510px");
+testNonGridTemplatesSetJSValues("auto minmax(16px, auto)", "minmax(auto, 15%) 10vw", "auto minmax(16px, auto)", "minmax(auto, 15%) 80px");
 
 debug("");
 debug("Test getting wrong values set from CSS");
@@ -53,7 +55,6 @@ testGridTemplatesSetBadJSValues("none none", "none none");
 testGridTemplatesSetBadJSValues("auto none", "auto none");
 testGridTemplatesSetBadJSValues("auto none 16em", "auto 18em none");
 testGridTemplatesSetBadJSValues("-webkit-fit-content -webkit-fit-content", "-webkit-fit-available -webkit-fit-available");
-testGridTemplatesSetBadJSValues("auto minmax(16px, auto)", "minmax(auto, 15%) 10vw");
 // Negative values are not allowed.
 testGridTemplatesSetBadJSValues("-10px minmax(16px, 32px)", "minmax(10%, 15%) -10vw");
 testGridTemplatesSetBadJSValues("10px minmax(16px, -1vw)", "minmax(-1%, 15%) 10vw");
index 99fddd8..52ae56f 100644 (file)
@@ -15,6 +15,7 @@ testGridTemplatesValues(document.getElementById("gridWithCalc"), "150px", "75px"
 testGridTemplatesValues(document.getElementById("gridWithCalcComplex"), "calc(50% + 150px)", "calc(65% + 75px)");
 testGridTemplatesValues(document.getElementById("gridWithCalcInsideMinMax"), "minmax(10%, 15px)", "minmax(20px, 50%)");
 testGridTemplatesValues(document.getElementById("gridWithCalcComplexInsideMinMax"), "minmax(10%, calc(50% + 15px))", "minmax(calc(20px + 10%), 50%)");
+testGridTemplatesValues(document.getElementById("gridWithAutoInsideMinMax"), "minmax(auto, 20px)", "minmax(-webkit-min-content, auto)");
 
 debug("");
 debug("Test getting wrong values for grid-template-columns and grid-template-rows through CSS (they should resolve to the default: 'none')");
@@ -54,6 +55,7 @@ testNonGridTemplatesSetJSValues("3600Fr", "154fR", "3600fr", "154fr", "3600fr",
 testNonGridTemplatesSetJSValues("3.1459fr", "2.718fr");
 // A leading '+' is allowed.
 testNonGridTemplatesSetJSValues("+3fr", "+4fr", "3fr", "4fr", "3fr", "4fr");
+testNonGridTemplatesSetJSValues("minmax(auto, 8vh)", "minmax(10vw, auto)", "minmax(auto, 48px)", "minmax(80px, auto)");
 
 debug("");
 debug("Test setting grid-template-columns and grid-template-rows to bad values through JS");
@@ -63,8 +65,6 @@ testGridTemplatesSetBadJSValues("minmax(10px 20px)", "minmax(10px)")
 testGridTemplatesSetBadJSValues("minmax(minmax(10px, 20px), 20px)", "minmax(10px, 20px, 30px)");
 // No breadth value and no comma.
 testGridTemplatesSetBadJSValues("minmax()", "minmax(30px 30% 30em)");
-// Auto is not allowed inside minmax.
-testGridTemplatesSetBadJSValues("minmax(auto, 8vh)", "minmax(10vw, auto)");
 testGridTemplatesSetBadJSValues("-2fr", "3ffr");
 testGridTemplatesSetBadJSValues("-2.05fr", "+-3fr");
 testGridTemplatesSetBadJSValues("0fr", "1r");
index cb8b46b..0b0194a 100644 (file)
@@ -1,3 +1,54 @@
+2015-09-15  Sergio Villar Senin  <svillar@igalia.com>
+
+        [CSS Grid Layout]  Using automatic (instead of min-content) minimums for 'auto' tracks
+        https://bugs.webkit.org/show_bug.cgi?id=142329
+
+        Reviewed by Darin Adler.
+
+        Based on Blink's r198697 by <svillar@igalia.com> and r200478 by <jfernandez@igalia.com>
+
+        More precisely (syntax-wise), this would allow 'auto' to be used within the
+        minmax() function (it's currently forbidden) and have the 'auto' keyword map
+        to minmax(auto, auto) instead of minmax(min-content, max-content).
+        - As a minimum, 'auto' would mean "use the specified minimum size, or if
+        that is auto, treat as 0 or min-content per Flexbox rules".
+        - As a maximum, 'auto' would mean "use the max-content size".
+
+        Regarding the implementation, a new phase is added to the track sizing
+        algorithm called ResolveIntrinsicMinimums (the former ResolveIntrinsicMinimums
+        is now called ResolveContentBasedMinimums which does not include 'auto'
+        resolution) which will be run before any other. This phase uses the minimum
+        size of grid items (as specified by min-width/height).
+
+        Tests: fast/css-grid-layout/grid-automatic-minimum-for-auto-columns.html
+               fast/css-grid-layout/grid-automatic-minimum-for-auto-rows.html
+
+        * css/CSSParser.cpp:
+        (WebCore::CSSParser::parseGridBreadth):
+        * rendering/RenderGrid.cpp:
+        (WebCore::RenderGrid::computeUsedBreadthOfMinLength):
+        (WebCore::RenderGrid::computeUsedBreadthOfMaxLength):
+        (WebCore::RenderGrid::minSizeForChild):
+        (WebCore::RenderGrid::resolveContentBasedTrackSizingFunctions):
+        (WebCore::RenderGrid::resolveContentBasedTrackSizingFunctionsForNonSpanningItems):
+        (WebCore::RenderGrid::trackSizeForTrackSizeComputationPhase):
+        (WebCore::RenderGrid::shouldProcessTrackForTrackSizeComputationPhase):
+        (WebCore::RenderGrid::trackShouldGrowBeyondGrowthLimitsForTrackSizeComputationPhase):
+        (WebCore::RenderGrid::markAsInfinitelyGrowableForTrackSizeComputationPhase):
+        (WebCore::RenderGrid::updateTrackSizeForTrackSizeComputationPhase):
+        (WebCore::RenderGrid::currentItemSizeForTrackSizeComputationPhase):
+        * rendering/RenderGrid.h:
+        * rendering/style/GridTrackSize.h:
+        (WebCore::GridTrackSize::minTrackBreadth):
+        (WebCore::GridTrackSize::maxTrackBreadth):
+        (WebCore::GridTrackSize::cacheMinMaxTrackBreadthTypes):
+        (WebCore::GridTrackSize::hasIntrinsicMinTrackBreadth):
+        (WebCore::GridTrackSize::hasAutoMinTrackBreadth):
+        (WebCore::GridTrackSize::hasAutoMaxTrackBreadth):
+        (WebCore::GridTrackSize::hasMaxContentOrAutoMaxTrackBreadth):
+        (WebCore::GridTrackSize::hasAutoOrMinContentMinTrackBreadthAndIntrinsicMaxTrackBreadth):
+        (WebCore::GridTrackSize::hasMinContentMinTrackBreadthAndMinOrMaxContentMaxTrackBreadth): Deleted.
+
 2015-09-17  Javier Fernandez  <jfernandez@igalia.com>
 
         [CSS Grid Layout] Relayout whenever Box Alignment properties change
index 3be17d4..99fd21b 100644 (file)
@@ -5743,7 +5743,7 @@ RefPtr<CSSValue> CSSParser::parseGridTrackSize(CSSParserValueList& inputList)
 
 RefPtr<CSSPrimitiveValue> CSSParser::parseGridBreadth(CSSParserValue& value)
 {
-    if (value.id == CSSValueWebkitMinContent || value.id == CSSValueWebkitMaxContent)
+    if (value.id == CSSValueWebkitMinContent || value.id == CSSValueWebkitMaxContent || value.id == CSSValueAuto)
         return CSSValuePool::singleton().createIdentifierValue(value.id);
 
     if (value.unit == CSSPrimitiveValue::CSS_FR) {
index ebe3c6a..07d99fd 100644 (file)
@@ -469,11 +469,10 @@ LayoutUnit RenderGrid::computeUsedBreadthOfMinLength(GridTrackSizingDirection di
         return 0;
 
     const Length& trackLength = gridLength.length();
-    ASSERT(!trackLength.isAuto());
     if (trackLength.isSpecified())
         return computeUsedBreadthOfSpecifiedLength(direction, trackLength);
 
-    ASSERT(trackLength.isMinContent() || trackLength.isMaxContent());
+    ASSERT(trackLength.isMinContent() || trackLength.isAuto() || trackLength.isMaxContent());
     return 0;
 }
 
@@ -483,14 +482,13 @@ LayoutUnit RenderGrid::computeUsedBreadthOfMaxLength(GridTrackSizingDirection di
         return usedBreadth;
 
     const Length& trackLength = gridLength.length();
-    ASSERT(!trackLength.isAuto());
     if (trackLength.isSpecified()) {
         LayoutUnit computedBreadth = computeUsedBreadthOfSpecifiedLength(direction, trackLength);
         ASSERT(computedBreadth != infinity);
         return computedBreadth;
     }
 
-    ASSERT(trackLength.isMinContent() || trackLength.isMaxContent());
+    ASSERT(trackLength.isMinContent() || trackLength.isAuto() || trackLength.isMaxContent());
     return infinity;
 }
 
@@ -600,6 +598,25 @@ LayoutUnit RenderGrid::logicalContentHeightForChild(RenderBox& child, Vector<Gri
     return child.logicalHeight() + child.marginLogicalHeight();
 }
 
+LayoutUnit RenderGrid::minSizeForChild(RenderBox& child, GridTrackSizingDirection direction, Vector<GridTrack>& columnTracks)
+{
+    bool hasOrthogonalWritingMode = child.isHorizontalWritingMode() != isHorizontalWritingMode();
+    // FIXME: Properly support orthogonal writing mode.
+    if (hasOrthogonalWritingMode)
+        return { };
+
+    const Length& childMinSize = direction == ForColumns ? child.style().logicalMinWidth() : child.style().logicalMinHeight();
+    if (childMinSize.isAuto()) {
+        // FIXME: Implement intrinsic aspect ratio support (transferred size in specs).
+        return minContentForChild(child, direction, columnTracks);
+    }
+
+    if (direction == ForColumns)
+        return child.computeLogicalWidthInRegionUsing(MinSize, childMinSize, contentLogicalWidth(), this, nullptr);
+
+    return child.computeContentAndScrollbarLogicalHeightUsing(MinSize, childMinSize, child.logicalHeight()).valueOr(0);
+}
+
 LayoutUnit RenderGrid::minContentForChild(RenderBox& child, GridTrackSizingDirection direction, Vector<GridTrack>& columnTracks)
 {
     bool hasOrthogonalWritingMode = child.isHorizontalWritingMode() != isHorizontalWritingMode();
@@ -716,6 +733,7 @@ void RenderGrid::resolveContentBasedTrackSizingFunctions(GridTrackSizingDirectio
     while (it != end) {
         GridItemsSpanGroupRange spanGroupRange = { it, std::upper_bound(it, end, *it) };
         resolveContentBasedTrackSizingFunctionsForItems<ResolveIntrinsicMinimums>(direction, sizingData, spanGroupRange);
+        resolveContentBasedTrackSizingFunctionsForItems<ResolveContentBasedMinimums>(direction, sizingData, spanGroupRange);
         resolveContentBasedTrackSizingFunctionsForItems<ResolveMaxContentMinimums>(direction, sizingData, spanGroupRange);
         resolveContentBasedTrackSizingFunctionsForItems<ResolveIntrinsicMaximums>(direction, sizingData, spanGroupRange);
         resolveContentBasedTrackSizingFunctionsForItems<ResolveMaxContentMaximums>(direction, sizingData, spanGroupRange);
@@ -738,10 +756,12 @@ void RenderGrid::resolveContentBasedTrackSizingFunctionsForNonSpanningItems(Grid
         track.setBaseSize(std::max(track.baseSize(), minContentForChild(gridItem, direction, columnTracks)));
     else if (trackSize.hasMaxContentMinTrackBreadth())
         track.setBaseSize(std::max(track.baseSize(), maxContentForChild(gridItem, direction, columnTracks)));
+    else if (trackSize.hasAutoMinTrackBreadth())
+        track.setBaseSize(std::max(track.baseSize(), minSizeForChild(gridItem, direction, columnTracks)));
 
     if (trackSize.hasMinContentMaxTrackBreadth())
         track.setGrowthLimit(std::max(track.growthLimit(), minContentForChild(gridItem, direction, columnTracks)));
-    else if (trackSize.hasMaxContentMaxTrackBreadth())
+    else if (trackSize.hasMaxContentOrAutoMaxTrackBreadth())
         track.setGrowthLimit(std::max(track.growthLimit(), maxContentForChild(gridItem, direction, columnTracks)));
 }
 
@@ -749,6 +769,7 @@ const LayoutUnit& RenderGrid::trackSizeForTrackSizeComputationPhase(TrackSizeCom
 {
     switch (phase) {
     case ResolveIntrinsicMinimums:
+    case ResolveContentBasedMinimums:
     case ResolveMaxContentMinimums:
     case MaximizeTracks:
         return track.baseSize();
@@ -765,13 +786,15 @@ bool RenderGrid::shouldProcessTrackForTrackSizeComputationPhase(TrackSizeComputa
 {
     switch (phase) {
     case ResolveIntrinsicMinimums:
+        return trackSize.hasIntrinsicMinTrackBreadth();
+    case ResolveContentBasedMinimums:
         return trackSize.hasMinOrMaxContentMinTrackBreadth();
     case ResolveMaxContentMinimums:
         return trackSize.hasMaxContentMinTrackBreadth();
     case ResolveIntrinsicMaximums:
         return trackSize.hasMinOrMaxContentMaxTrackBreadth();
     case ResolveMaxContentMaximums:
-        return trackSize.hasMaxContentMaxTrackBreadth();
+        return trackSize.hasMaxContentOrAutoMaxTrackBreadth();
     case MaximizeTracks:
         ASSERT_NOT_REACHED();
         return false;
@@ -785,7 +808,8 @@ bool RenderGrid::trackShouldGrowBeyondGrowthLimitsForTrackSizeComputationPhase(T
 {
     switch (phase) {
     case ResolveIntrinsicMinimums:
-        return trackSize.hasMinContentMinTrackBreadthAndMinOrMaxContentMaxTrackBreadth();
+    case ResolveContentBasedMinimums:
+        return trackSize.hasAutoOrMinContentMinTrackBreadthAndIntrinsicMaxTrackBreadth();
     case ResolveMaxContentMinimums:
         return trackSize.hasMaxContentMinTrackBreadthAndMaxContentMaxTrackBreadth();
     case ResolveIntrinsicMaximums:
@@ -804,6 +828,7 @@ void RenderGrid::markAsInfinitelyGrowableForTrackSizeComputationPhase(TrackSizeC
 {
     switch (phase) {
     case ResolveIntrinsicMinimums:
+    case ResolveContentBasedMinimums:
     case ResolveMaxContentMinimums:
         return;
     case ResolveIntrinsicMaximums:
@@ -826,6 +851,7 @@ void RenderGrid::updateTrackSizeForTrackSizeComputationPhase(TrackSizeComputatio
 {
     switch (phase) {
     case ResolveIntrinsicMinimums:
+    case ResolveContentBasedMinimums:
     case ResolveMaxContentMinimums:
         track.setBaseSize(track.plannedSize());
         return;
@@ -845,6 +871,8 @@ LayoutUnit RenderGrid::currentItemSizeForTrackSizeComputationPhase(TrackSizeComp
 {
     switch (phase) {
     case ResolveIntrinsicMinimums:
+        return minSizeForChild(gridItem, direction, columnTracks);
+    case ResolveContentBasedMinimums:
     case ResolveIntrinsicMaximums:
         return minContentForChild(gridItem, direction, columnTracks);
     case ResolveMaxContentMinimums:
index 99206c7..ee71fde 100644 (file)
@@ -95,6 +95,7 @@ private:
     };
     enum TrackSizeComputationPhase {
         ResolveIntrinsicMinimums,
+        ResolveContentBasedMinimums,
         ResolveMaxContentMinimums,
         ResolveIntrinsicMaximums,
         ResolveMaxContentMaximums,
@@ -117,6 +118,7 @@ private:
     GridTrackSize gridTrackSize(GridTrackSizingDirection, unsigned) const;
 
     LayoutUnit logicalContentHeightForChild(RenderBox&, Vector<GridTrack>&);
+    LayoutUnit minSizeForChild(RenderBox&, GridTrackSizingDirection, Vector<GridTrack>& columnTracks);
     LayoutUnit minContentForChild(RenderBox&, GridTrackSizingDirection, Vector<GridTrack>& columnTracks);
     LayoutUnit maxContentForChild(RenderBox&, GridTrackSizingDirection, Vector<GridTrack>& columnTracks);
     GridAxisPosition columnAxisPositionForChild(const RenderBox&) const;
index d2c2deb..6063792 100644 (file)
@@ -70,23 +70,9 @@ public:
         return minTrackBreadth;
     }
 
-    const GridLength& minTrackBreadth() const
-    {
-        if (m_minTrackBreadth.isLength() && m_minTrackBreadth.length().isAuto()) {
-            static NeverDestroyed<const GridLength> minContent{Length(MinContent)};
-            return minContent;
-        }
-        return m_minTrackBreadth;
-    }
+    const GridLength& minTrackBreadth() const { return m_minTrackBreadth; }
 
-    const GridLength& maxTrackBreadth() const
-    {
-        if (m_maxTrackBreadth.isLength() && m_maxTrackBreadth.length().isAuto()) {
-            static NeverDestroyed<const GridLength> maxContent{Length(MaxContent)};
-            return maxContent;
-        }
-        return m_maxTrackBreadth;
-    }
+    const GridLength& maxTrackBreadth() const { return m_maxTrackBreadth; }
 
     GridTrackSizeType type() const { return m_type; }
 
@@ -101,27 +87,35 @@ public:
 
     void cacheMinMaxTrackBreadthTypes()
     {
+        m_minTrackBreadthIsAuto = minTrackBreadth().isLength() && minTrackBreadth().length().isAuto();
         m_minTrackBreadthIsMinContent = minTrackBreadth().isLength() && minTrackBreadth().length().isMinContent();
         m_minTrackBreadthIsMaxContent = minTrackBreadth().isLength() && minTrackBreadth().length().isMaxContent();
         m_maxTrackBreadthIsMaxContent = maxTrackBreadth().isLength() && maxTrackBreadth().length().isMaxContent();
         m_maxTrackBreadthIsMinContent = maxTrackBreadth().isLength() && maxTrackBreadth().length().isMinContent();
+        m_maxTrackBreadthIsAuto = maxTrackBreadth().isLength() && maxTrackBreadth().length().isAuto();
     }
 
+    bool hasIntrinsicMinTrackBreadth() const { return m_minTrackBreadthIsMaxContent || m_minTrackBreadthIsMinContent || m_minTrackBreadthIsAuto; }
     bool hasMinOrMaxContentMinTrackBreadth() const { return m_minTrackBreadthIsMaxContent || m_minTrackBreadthIsMinContent; }
+    bool hasAutoMinTrackBreadth() const { return m_minTrackBreadthIsAuto; }
+    bool hasAutoMaxTrackBreadth() const { return m_maxTrackBreadthIsAuto; }
     bool hasMaxContentMaxTrackBreadth() const { return m_maxTrackBreadthIsMaxContent; }
+    bool hasMaxContentOrAutoMaxTrackBreadth() const { return m_maxTrackBreadthIsMaxContent || m_maxTrackBreadthIsAuto; }
     bool hasMinContentMaxTrackBreadth() const { return m_maxTrackBreadthIsMinContent; }
     bool hasMinOrMaxContentMaxTrackBreadth() const { return m_maxTrackBreadthIsMaxContent || m_maxTrackBreadthIsMinContent; }
     bool hasMaxContentMinTrackBreadth() const { return m_minTrackBreadthIsMaxContent; }
     bool hasMinContentMinTrackBreadth() const { return m_minTrackBreadthIsMinContent; }
-    bool hasMinContentMinTrackBreadthAndMinOrMaxContentMaxTrackBreadth() const { return m_minTrackBreadthIsMinContent && hasMinOrMaxContentMaxTrackBreadth(); }
     bool hasMaxContentMinTrackBreadthAndMaxContentMaxTrackBreadth() const { return m_minTrackBreadthIsMaxContent && m_maxTrackBreadthIsMaxContent; }
+    bool hasAutoOrMinContentMinTrackBreadthAndIntrinsicMaxTrackBreadth() const { return (m_minTrackBreadthIsMinContent || m_minTrackBreadthIsAuto) && (m_maxTrackBreadthIsAuto || hasMinOrMaxContentMaxTrackBreadth()); }
 
 private:
     GridTrackSizeType m_type;
     GridLength m_minTrackBreadth;
     GridLength m_maxTrackBreadth;
+    bool m_minTrackBreadthIsAuto;
     bool m_minTrackBreadthIsMaxContent;
     bool m_minTrackBreadthIsMinContent;
+    bool m_maxTrackBreadthIsAuto;
     bool m_maxTrackBreadthIsMaxContent;
     bool m_maxTrackBreadthIsMinContent;
 };