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

Unified Diff: LayoutTests/fast/css-grid-layout/grid-initialize-span-one-items.html

Issue 802243003: [CSS Grid Layout] Incorrect sizing of tracks with non-spanning items (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: Rebased + Test fixes Created 5 years, 11 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
Index: LayoutTests/fast/css-grid-layout/grid-initialize-span-one-items.html
diff --git a/LayoutTests/fast/css-grid-layout/grid-initialize-span-one-items.html b/LayoutTests/fast/css-grid-layout/grid-initialize-span-one-items.html
new file mode 100644
index 0000000000000000000000000000000000000000..c2955c9ae54d760d81587ba9a5af25885e2d87d3
--- /dev/null
+++ b/LayoutTests/fast/css-grid-layout/grid-initialize-span-one-items.html
@@ -0,0 +1,88 @@
+<!DOCTYPE html>
+<head>
+<link href="resources/grid.css" rel="stylesheet"/>
+<style>
+ .grid {
+ font: 10px/1 Ahem;
+ }
+ .gridAutoAndAuto {
+ grid-template-columns: auto auto;
+ }
+ .gridFixedMinContentFixedMaxContent {
+ grid-template-columns: minmax(50px, min-content) minmax(40px, max-content);
+ }
+ .gridMaxContentAndAuto {
+ grid-template-columns: max-content auto;
+ }
+ .gridMinContentAndAuto {
+ grid-template-columns: min-content auto;
+ }
+</style>
+<script src="../../resources/js-test.js"></script>
+</head>
+<body>
+<div class="grid gridAutoAndAuto" id="gridAutoAndAuto">
+ <div class="firstRowFirstColumn">X</div>
+ <div class="firstRowBothColumn">XXX XX XXX</div>
+</div>
+
+<div class="grid gridAutoAndAuto" id="gridAutoAndAutoReversed">
+ <div class="firstRowSecondColumn">X</div>
+ <div class="firstRowBothColumn">XXX XX XXX</div>
+</div>
+
+<div class="grid gridFixedMinContentFixedMaxContent" id="gridFixedMinContentFixedMaxContent">
+ <div class="sizedToGridArea firstRowFirstColumn"></div>
+ <div class="firstRowBothColumn">XXX XX XXX</div>
+</div>
+
+<div class="grid gridFixedMinContentFixedMaxContent" id="gridFixedMinContentFixedMaxContentTwoEmptyChildren">
+ <div class="sizedToGridArea firstRowFirstColumn"></div>
+ <div class="sizedToGridArea firstRowSecondColumn"></div>
+ <div class="firstRowBothColumn">XXX XX XXX</div>
+</div>
+
+<div class="grid gridFixedMinContentFixedMaxContent" id="gridFixedMinContentFixedMaxContentFixedSizeChild">
+ <div class="firstRowFirstColumn">XXXXXX</div>
+ <div class="firstRowBothColumn">XXX XX XXX</div>
+</div>
+
+<div class="grid gridMaxContentAndAuto" id="gridMaxContentAndAuto">
+ <div class="firstRowFirstColumn">X</div>
+ <div class="firstRowBothColumn">XXX XX XXX</div>
+</div>
+
+<div class="grid gridMaxContentAndAuto" id="gridMaxContentAndAutoReversed">
+ <div class="firstRowSecondColumn">X</div>
+ <div class="firstRowBothColumn">XXX XX XXX</div>
+</div>
+
+<div class="grid gridMinContentAndAuto" id="gridMinContentAndAuto">
+ <div class="firstRowFirstColumn">X</div>
+ <div class="firstRowBothColumn">XXX XX XXX</div>
+</div>
+
+<div class="grid gridMinContentAndAuto" id="gridMinContentAndAutoReversed">
+ <div class="firstRowSecondColumn">X</div>
+ <div class="firstRowBothColumn">XXX XX XXX</div>
+</div>
+
+<script>
+function testGridColumnsValues(id, computedColumnValue)
+{
+ shouldBeEqualToString("window.getComputedStyle(" + id + ", '').getPropertyValue('grid-template-columns')", computedColumnValue);
+}
+
+description('This test checks that content sized tracks are initialized using non-spanning grid items.');
+
+testGridColumnsValues("gridAutoAndAuto", "10px 90px");
+testGridColumnsValues("gridAutoAndAutoReversed", "90px 10px");
+testGridColumnsValues("gridFixedMinContentFixedMaxContent", "50px 50px");
+testGridColumnsValues("gridFixedMinContentFixedMaxContentTwoEmptyChildren", "50px 50px");
+testGridColumnsValues("gridFixedMinContentFixedMaxContentFixedSizeChild", "60px 40px");
+testGridColumnsValues("gridMaxContentAndAuto", "80px 20px");
+testGridColumnsValues("gridMaxContentAndAutoReversed", "90px 10px");
+testGridColumnsValues("gridMinContentAndAuto", "10px 90px");
+testGridColumnsValues("gridMinContentAndAutoReversed", "20px 80px");
+</script>
+</body>

Powered by Google App Engine
This is Rietveld 408576698