Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(33)

Issues Search
    My Issues | Starred     Open | Closed | All

Unified Diff: LayoutTests/fast/css-grid-layout/grid-preferred-logical-widths.html

Issue 1317643005: [css-grid] Fix track sizing algo w/ size restrictions and intrinsic sizes (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Simplified code Created 5 years, 3 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « LayoutTests/fast/css-grid-layout/grid-item-change-column-repaint.html ('k') | LayoutTests/fast/css-grid-layout/maximize-tracks-definite-indefinite-height.html » ('j') | LayoutTests/fast/css-grid-layout/maximize-tracks-definite-indefinite-height.html » ('J')
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: LayoutTests/fast/css-grid-layout/grid-preferred-logical-widths.html
diff --git a/LayoutTests/fast/css-grid-layout/grid-preferred-logical-widths.html b/LayoutTests/fast/css-grid-layout/grid-preferred-logical-widths.html
index f25408033cfcee0b19872c256028cf21f29b2de2..931f2c48911094fd5e4e77cb47686bbb2bdd01f1 100644
--- a/LayoutTests/fast/css-grid-layout/grid-preferred-logical-widths.html
+++ b/LayoutTests/fast/css-grid-layout/grid-preferred-logical-widths.html
@@ -43,8 +43,6 @@
margin: 10px 20px 30px 40px;
}
-.dummyContainer { }
-
.minWidth70 {
min-width: 70px;
}
@@ -56,230 +54,166 @@
</style>
</head>
<script src="../../resources/check-layout.js"></script>
-<body onload="checkLayout('.dummyContainer')">
+<body onload="checkLayout('.grid')">
<body>
<p>This test checks that the grid element's preferred logical widths are properly computed with different combinations of minmax().</p>
-<div class="dummyContainer">
- <div class="grid gridMinContentFixed min-content" data-expected-height="10" data-expected-width="40">
- <div class="firstRowFirstColumn">XX XX XX</div>
- <div class="firstRowSecondColumn">XX XX XX</div>
- </div>
+<div class="grid gridMinContentFixed min-content" data-expected-height="10" data-expected-width="40">
+ <div class="firstRowFirstColumn">XX XX XX</div>
+ <div class="firstRowSecondColumn">XX XX XX</div>
</div>
-<div class="dummyContainer">
- <div class="grid gridMinContentFixed max-content" data-expected-height="10" data-expected-width="80">
- <div class="firstRowFirstColumn">XX XX XX</div>
- <div class="firstRowSecondColumn">XX XX XX</div>
- </div>
+<div class="grid gridMinContentFixed max-content" data-expected-height="10" data-expected-width="80">
+ <div class="firstRowFirstColumn">XX XX XX</div>
+ <div class="firstRowSecondColumn">XX XX XX</div>
</div>
-<div class="dummyContainer">
- <div class="grid gridFixedMinContent min-content" data-expected-height="10" data-expected-width="60">
- <div class="firstRowFirstColumn">XXXXX XXXXX</div>
- <div class="firstRowSecondColumn">XXXXX XXXXX</div>
- </div>
+<div class="grid gridFixedMinContent min-content" data-expected-height="10" data-expected-width="60">
+ <div class="firstRowFirstColumn">XXXXX XXXXX</div>
+ <div class="firstRowSecondColumn">XXXXX XXXXX</div>
</div>
-<div class="dummyContainer">
- <div class="grid gridFixedMinContent max-content" data-expected-height="10" data-expected-width="100">
- <div class="firstRowFirstColumn">XXXXX XXXXX</div>
- <div class="firstRowSecondColumn">XXXXX XXXXX</div>
- </div>
+<div class="grid gridFixedMinContent max-content" data-expected-height="10" data-expected-width="100">
+ <div class="firstRowFirstColumn">XXXXX XXXXX</div>
+ <div class="firstRowSecondColumn">XXXXX XXXXX</div>
</div>
-<div class="dummyContainer">
- <div class="grid gridFixedMaxContent min-content" data-expected-height="10" data-expected-width="80">
- <div class="firstRowFirstColumn">XX XX XX</div>
- <div class="firstRowSecondColumn">XX XX XX</div>
- </div>
+<div class="grid gridFixedMaxContent min-content" data-expected-height="10" data-expected-width="80">
+ <div class="firstRowFirstColumn">XX XX XX</div>
+ <div class="firstRowSecondColumn">XX XX XX</div>
</div>
-<div class="dummyContainer">
- <div class="grid gridFixedMaxContent max-content" data-expected-height="10" data-expected-width="160">
- <div class="firstRowFirstColumn">XX XX XX</div>
- <div class="firstRowSecondColumn">XX XX XX</div>
- </div>
+<div class="grid gridFixedMaxContent max-content" data-expected-height="10" data-expected-width="160">
+ <div class="firstRowFirstColumn">XX XX XX</div>
+ <div class="firstRowSecondColumn">XX XX XX</div>
</div>
-<div class="dummyContainer">
- <div class="grid gridFixedFixed min-content" data-expected-height="10" data-expected-width="60"></div>
+<div class="grid gridFixedFixed min-content" data-expected-height="10" data-expected-width="60"></div>
</div>
-<div class="dummyContainer">
- <div class="grid gridFixedFixed max-content" data-expected-height="10" data-expected-width="80"></div>
+<div class="grid gridFixedFixed max-content" data-expected-height="10" data-expected-width="80"></div>
</div>
-<div class="dummyContainer">
- <div class="grid gridAutoContent min-content" data-expected-height="10" data-expected-width="40">
- <div class="firstRowFirstColumn">XX XX XX</div>
- <div class="firstRowSecondColumn">XX XX XX</div>
- </div>
+<div class="grid gridAutoContent min-content" data-expected-height="10" data-expected-width="40">
+ <div class="firstRowFirstColumn">XX XX XX</div>
+ <div class="firstRowSecondColumn">XX XX XX</div>
</div>
-<div class="dummyContainer">
- <div class="grid gridAutoContent max-content" data-expected-height="10" data-expected-width="160">
- <div class="firstRowFirstColumn">XX XX XX</div>
- <div class="firstRowSecondColumn">XX XX XX</div>
- </div>
+<div class="grid gridAutoContent max-content" data-expected-height="10" data-expected-width="160">
+ <div class="firstRowFirstColumn">XX XX XX</div>
+ <div class="firstRowSecondColumn">XX XX XX</div>
</div>
-<div class="dummyContainer">
- <div class="grid gridFixedFraction min-content" data-expected-height="10" data-expected-width="10"></div>
+<div class="grid gridFixedFraction min-content" data-expected-height="10" data-expected-width="10"></div>
</div>
-<div class="dummyContainer">
- <div class="grid gridFixedFraction max-content" data-expected-height="10" data-expected-width="30"></div>
+<div class="grid gridFixedFraction max-content" data-expected-height="10" data-expected-width="30"></div>
</div>
+
<!-- Now with margin on one of the grid items. -->
-<div class="dummyContainer">
- <div class="grid gridMinContentFixed min-content" data-expected-height="10" data-expected-width="100">
- <div class="firstRowFirstColumn">XX XX XX</div>
- <div class="firstRowSecondColumn margins">XX XX XX</div>
- </div>
+<div class="grid gridMinContentFixed min-content" data-expected-height="10" data-expected-width="100">
+ <div class="firstRowFirstColumn">XX XX XX</div>
+ <div class="firstRowSecondColumn margins">XX XX XX</div>
</div>
-<div class="dummyContainer">
- <div class="grid gridMinContentFixed max-content" data-expected-height="10" data-expected-width="120">
- <div class="firstRowFirstColumn margins">XX XX XX</div>
- <div class="firstRowSecondColumn">XX XX XX</div>
- </div>
+<div class="grid gridMinContentFixed max-content" data-expected-height="10" data-expected-width="120">
+ <div class="firstRowFirstColumn margins">XX XX XX</div>
+ <div class="firstRowSecondColumn">XX XX XX</div>
</div>
-<div class="dummyContainer">
- <div class="grid gridFixedMinContent min-content" data-expected-height="10" data-expected-width="60">
- <div class="firstRowFirstColumn">XXXXX XXXXX</div>
- <div class="firstRowSecondColumn margins">XXXXX XXXXX</div>
- </div>
+<div class="grid gridFixedMinContent min-content" data-expected-height="10" data-expected-width="60">
+ <div class="firstRowFirstColumn">XXXXX XXXXX</div>
+ <div class="firstRowSecondColumn margins">XXXXX XXXXX</div>
</div>
-<div class="dummyContainer">
- <div class="grid gridFixedMinContent max-content" data-expected-height="10" data-expected-width="160">
- <div class="firstRowFirstColumn margins">XXXXX XXXXX</div>
- <div class="firstRowSecondColumn">XXXXX XXXXX</div>
- </div>
+<div class="grid gridFixedMinContent max-content" data-expected-height="10" data-expected-width="160">
+ <div class="firstRowFirstColumn margins">XXXXX XXXXX</div>
+ <div class="firstRowSecondColumn">XXXXX XXXXX</div>
</div>
-<div class="dummyContainer">
- <div class="grid gridFixedMaxContent min-content" data-expected-height="10" data-expected-width="80">
- <div class="firstRowFirstColumn">XX XX XX</div>
- <div class="firstRowSecondColumn margins">XX XX XX</div>
- </div>
+<div class="grid gridFixedMaxContent min-content" data-expected-height="10" data-expected-width="80">
+ <div class="firstRowFirstColumn">XX XX XX</div>
+ <div class="firstRowSecondColumn margins">XX XX XX</div>
</div>
-<div class="dummyContainer">
- <div class="grid gridFixedMaxContent max-content" data-expected-height="10" data-expected-width="220">
- <div class="firstRowFirstColumn margins">XX XX XX</div>
- <div class="firstRowSecondColumn">XX XX XX</div>
- </div>
+<div class="grid gridFixedMaxContent max-content" data-expected-height="10" data-expected-width="220">
+ <div class="firstRowFirstColumn margins">XX XX XX</div>
+ <div class="firstRowSecondColumn">XX XX XX</div>
</div>
<!-- Spanning cells -->
-<div class="dummyContainer">
- <div class="grid gridMinContentFixed min-content" data-expected-height="10" data-expected-width="20">
- <div class="firstRowBothColumn">XX XX XX</div>
- </div>
+<div class="grid gridMinContentFixed min-content" data-expected-height="10" data-expected-width="20">
+ <div class="firstRowBothColumn">XX XX XX</div>
</div>
-<div class="dummyContainer">
- <div class="grid gridFixedMinContent max-content" data-expected-height="10" data-expected-width="80">
- <div class="firstRowBothColumn">XXXXX XXXXX</div>
- <div class="firstRowSecondColumn">XXXXX XXXXX</div>
- </div>
+<div class="grid gridFixedMinContent max-content" data-expected-height="10" data-expected-width="80">
+ <div class="firstRowBothColumn">XXXXX XXXXX</div>
+ <div class="firstRowSecondColumn">XXXXX XXXXX</div>
</div>
-<div class="dummyContainer">
- <div class="grid gridFixedMaxContent max-content" data-expected-height="10" data-expected-width="80">
- <div class="firstRowBothColumn">XX XX XX</div>
- <div class="firstRowBothColumn">XX XX XX</div>
- </div>
+<div class="grid gridFixedMaxContent max-content" data-expected-height="10" data-expected-width="80">
+ <div class="firstRowBothColumn">XX XX XX</div>
+ <div class="firstRowBothColumn">XX XX XX</div>
</div>
-<div class="dummyContainer">
- <div class="grid gridAutoContent min-content" data-expected-height="10" data-expected-width="20">
- <div class="firstRowFirstColumn">XX XX XX</div>
- <div class="firstRowBothColumn">XX XX XX</div>
- </div>
+<div class="grid gridAutoContent min-content" data-expected-height="10" data-expected-width="20">
+ <div class="firstRowFirstColumn">XX XX XX</div>
+ <div class="firstRowBothColumn">XX XX XX</div>
</div>
-<div class="dummyContainer">
- <div class="grid gridAutoContent max-content" data-expected-height="10" data-expected-width="80">
- <div class="firstRowBothColumn">XX XX XX</div>
- <div class="firstRowSecondColumn">XX XX XX</div>
- </div>
+<div class="grid gridAutoContent max-content" data-expected-height="10" data-expected-width="80">
+ <div class="firstRowBothColumn">XX XX XX</div>
+ <div class="firstRowSecondColumn">XX XX XX</div>
</div>
<!-- Grids under min-width / max-width constraints -->
-<div class="dummyContainer min-content" data-expected-height="10" data-expected-width="70">
- <div class="grid gridMinContentFixed minWidth70" data-expected-height="10" data-expected-width="70">
- <div class="firstRowFirstColumn">XX XX XX</div>
- <div class="firstRowSecondColumn">XX XX XX</div>
- </div>
+<div class="min-content grid gridMinContentFixed minWidth70" data-expected-height="10" data-expected-width="70">
+ <div class="firstRowFirstColumn">XX XX XX</div>
+ <div class="firstRowSecondColumn">XX XX XX</div>
</div>
-<div class="dummyContainer max-content" data-expected-height="10" data-expected-width="20">
- <div class="grid gridMinContentFixed maxWidth20" data-expected-height="10" data-expected-width="20">
- <div class="firstRowFirstColumn">XX XX XX</div>
- <div class="firstRowSecondColumn">XX XX XX</div>
- </div>
+<div class="max-content grid gridMinContentFixed maxWidth20" data-expected-height="10" data-expected-width="20">
+ <div class="firstRowFirstColumn">XX XX XX</div>
+ <div class="firstRowSecondColumn">XX XX XX</div>
</div>
-<div class="dummyContainer min-content" data-expected-height="10" data-expected-width="70">
- <div class="grid gridFixedMinContent minWidth70" data-expected-height="10" data-expected-width="70">
- <div class="firstRowFirstColumn">XXXXX XXXXX</div>
- <div class="firstRowSecondColumn">XXXXX XXXXX</div>
- </div>
+<div class="min-content grid gridFixedMinContent minWidth70" data-expected-height="10" data-expected-width="70">
+ <div class="firstRowFirstColumn">XXXXX XXXXX</div>
+ <div class="firstRowSecondColumn">XXXXX XXXXX</div>
</div>
-<div class="dummyContainer max-content" data-expected-height="10" data-expected-width="20">
- <div class="grid gridFixedMinContent maxWidth20" data-expected-height="10" data-expected-width="20">
- <div class="firstRowFirstColumn">XXXXX XXXXX</div>
- <div class="firstRowSecondColumn">XXXXX XXXXX</div>
- </div>
+<div class="max-content grid gridFixedMinContent maxWidth20" data-expected-height="10" data-expected-width="20">
+ <div class="firstRowFirstColumn">XXXXX XXXXX</div>
+ <div class="firstRowSecondColumn">XXXXX XXXXX</div>
</div>
-<div class="dummyContainer min-content" data-expected-height="10" data-expected-width="80">
- <div class="grid gridFixedMaxContent minWidth70" data-expected-height="10" data-expected-width="80">
- <div class="firstRowFirstColumn">XX XX XX</div>
- <div class="firstRowSecondColumn">XX XX XX</div>
- </div>
+<div class="max-content grid gridFixedMaxContent minWidth70" data-expected-height="10" data-expected-width="160">
+ <div class="firstRowFirstColumn">XX XX XX</div>
+ <div class="firstRowSecondColumn">XX XX XX</div>
</div>
-
-<div class="dummyContainer max-content" data-expected-height="10" data-expected-width="20">
- <div class="grid gridFixedMaxContent maxWidth20" data-expected-height="10" data-expected-width="20">
- <div class="firstRowFirstColumn">XX XX XX</div>
- <div class="firstRowSecondColumn">XX XX XX</div>
- </div>
</div>
-<div class="dummyContainer min-content" data-expected-height="10" data-expected-width="70">
- <div class="grid gridFixedFixed minWidth70" data-expected-height="10" data-expected-width="70"></div>
+<div class="max-content grid gridFixedMaxContent maxWidth20" data-expected-height="10" data-expected-width="20">
+ <div class="firstRowFirstColumn">XX XX XX</div>
+ <div class="firstRowSecondColumn">XX XX XX</div>
</div>
-<div class="dummyContainer max-content" data-expected-height="10" data-expected-width="20">
- <div class="grid gridFixedFixed maxWidth20" data-expected-height="10" data-expected-width="20"></div>
-</div>
+<div class="min-content grid gridFixedFixed minWidth70" data-expected-height="10" data-expected-width="70"></div>
-<div class="dummyContainer min-content" data-expected-height="10" data-expected-width="70">
- <div class="grid gridAutoContent minWidth70" data-expected-height="10" data-expected-width="70">
- <div class="firstRowFirstColumn">XX XX XX</div>
- <div class="firstRowSecondColumn">XX XX XX</div>
- </div>
-</div>
+<div class="min-content grid gridFixedFixed maxWidth20" data-expected-height="10" data-expected-width="20"></div>
-<div class="dummyContainer max-content" data-expected-height="10" data-expected-width="20">
- <div class="grid gridAutoContent maxWidth20" data-expected-height="10" data-expected-width="20">
- <div class="firstRowFirstColumn">XX XX XX</div>
- <div class="firstRowSecondColumn">XX XX XX</div>
- </div>
+<div class="min-content grid gridAutoContent minWidth70" data-expected-height="10" data-expected-width="70">
+ <div class="firstRowFirstColumn">XX XX XX</div>
+ <div class="firstRowSecondColumn">XX XX XX</div>
</div>
-<div class="dummyContainer min-content" data-expected-height="10" data-expected-width="70">
- <div class="grid gridFixedFraction minWidth70" data-expected-height="10" data-expected-width="70"></div>
+<div class="min-content grid gridAutoContent maxWidth20" data-expected-height="10" data-expected-width="20">
+ <div class="firstRowFirstColumn">XX XX XX</div>
+ <div class="firstRowSecondColumn">XX XX XX</div>
</div>
-<div class="dummyContainer max-content" data-expected-height="10" data-expected-width="20">
- <div class="grid gridFixedFraction maxWidth20" data-expected-height="10" data-expected-width="20"></div>
-</div>
+<div class="min-content grid gridFixedFraction minWidth70" data-expected-height="10" data-expected-width="70"></div>
+
+<div class="min-content grid gridFixedFraction maxWidth20" data-expected-height="10" data-expected-width="10"></div>
</body>
</html>
« no previous file with comments | « LayoutTests/fast/css-grid-layout/grid-item-change-column-repaint.html ('k') | LayoutTests/fast/css-grid-layout/maximize-tracks-definite-indefinite-height.html » ('j') | LayoutTests/fast/css-grid-layout/maximize-tracks-definite-indefinite-height.html » ('J')

Powered by Google App Engine
This is Rietveld 408576698