Skip to content

GitLab

T
tangled
Commit e6c17c99 authored by rego@igalia.com's avatar rego@igalia.com
Browse files
Options

[CSS Grid Layout] Rename gridAutoFlow[Row|Column] to gridAutoFlow[Row|Column]Sparse 

Rename CSS styles in grid layout tests to make the name more explicit. As the
default mode for auto-placement algorithm is "sparse".

BUG=384099

Review URL: https://codereview.chromium.org/401473003

git-svn-id: svn://svn.chromium.org/blink/trunk@178500 bbb929c8-8fbe-4397-9dbb-9b2b20218538
parent f9a81a72
Hide whitespace changes
Inline Side-by-side
Showing with 70 additions and 72 deletions
third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-auto-columns-rows-auto-flow-resolution.html
View file @ e6c17c99
...@@ -31,84 +31,84 @@ ...@@ -31,84 +31,84 @@
<div>This test checks that grid rows / columns created via the auto-placement algorithm do follow, grid-auto-{rows|columns}.</div> <div>This test checks that grid rows / columns created via the auto-placement algorithm do follow, grid-auto-{rows|columns}.</div>
<div class="unconstrainedContainer" style="position: relative"> <div class="unconstrainedContainer" style="position: relative">
<div class="grid gridAutoFixedFixed gridAutoFlowRow"> <div class="grid gridAutoFixedFixed gridAutoFlowRowDense">
<div class="sizedToGridArea firstRowAutoColumn" data-offset-x="10" data-offset-y="0" data-expected-width="50" data-expected-height="5">XXXXX XXXXXX</div> <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="10" data-offset-y="0" data-expected-width="50" data-expected-height="5">XXXXX XXXXXX</div>
<div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div> <div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div>
</div> </div>
</div> </div>
<div class="unconstrainedContainer" style="position: relative"> <div class="unconstrainedContainer" style="position: relative">
<div class="grid gridAutoFixedFixed gridAutoFlowColumn"> <div class="grid gridAutoFixedFixed gridAutoFlowColumnDense">
<div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="5" data-expected-width="10" data-expected-height="30">XXXXX XXXXXX</div> <div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="5" data-expected-width="10" data-expected-height="30">XXXXX XXXXXX</div>
<div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div> <div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div>
</div> </div>
</div> </div>
<div class="unconstrainedContainer" style="position: relative"> <div class="unconstrainedContainer" style="position: relative">
<div class="grid gridAutoFixedFixed gridAutoFlowRow"> <div class="grid gridAutoFixedFixed gridAutoFlowRowDense">
<div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="5" data-expected-width="10" data-expected-height="30">XXXXX XXXXXX</div> <div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="5" data-expected-width="10" data-expected-height="30">XXXXX XXXXXX</div>
<div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div> <div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div>
</div> </div>
</div> </div>
<div class="unconstrainedContainer" style="position: relative"> <div class="unconstrainedContainer" style="position: relative">
<div class="grid gridAutoFixedFixed gridAutoFlowColumn"> <div class="grid gridAutoFixedFixed gridAutoFlowColumnDense">
<div class="sizedToGridArea firstRowAutoColumn" data-offset-x="10" data-offset-y="0" data-expected-width="50" data-expected-height="5">XXXXX XXXXXX</div> <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="10" data-offset-y="0" data-expected-width="50" data-expected-height="5">XXXXX XXXXXX</div>
<div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div> <div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div>
</div> </div>
</div> </div>
<div class="unconstrainedContainer" style="position: relative"> <div class="unconstrainedContainer" style="position: relative">
<div class="grid gridAutoMinMax gridAutoFlowRow"> <div class="grid gridAutoMinMax gridAutoFlowRowDense">
<div class="sizedToGridArea firstRowAutoColumn" data-offset-x="10" data-offset-y="0" data-expected-width="300" data-expected-height="5">XXXXX XXXXXX</div> <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="10" data-offset-y="0" data-expected-width="300" data-expected-height="5">XXXXX XXXXXX</div>
<div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div> <div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div>
</div> </div>
</div> </div>
<div class="unconstrainedContainer" style="position: relative"> <div class="unconstrainedContainer" style="position: relative">
<div class="grid gridAutoMinMax gridAutoFlowColumn"> <div class="grid gridAutoMinMax gridAutoFlowColumnDense">
<div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="5" data-expected-width="10" data-expected-height="100">XXXXX XXXXXX</div> <div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="5" data-expected-width="10" data-expected-height="100">XXXXX XXXXXX</div>
<div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div> <div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div>
</div> </div>
</div> </div>
<div class="unconstrainedContainer" style="position: relative"> <div class="unconstrainedContainer" style="position: relative">
<div class="grid gridAutoMinMax gridAutoFlowRow"> <div class="grid gridAutoMinMax gridAutoFlowRowDense">
<div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="5" data-expected-width="10" data-expected-height="100">XXXXX XXXXXX</div> <div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="5" data-expected-width="10" data-expected-height="100">XXXXX XXXXXX</div>
<div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div> <div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div>
</div> </div>
</div> </div>
<div class="unconstrainedContainer" style="position: relative"> <div class="unconstrainedContainer" style="position: relative">
<div class="grid gridAutoMinMax gridAutoFlowColumn"> <div class="grid gridAutoMinMax gridAutoFlowColumnDense">
<div class="sizedToGridArea firstRowAutoColumn" data-offset-x="10" data-offset-y="0" data-expected-width="300" data-expected-height="5">XXXXX XXXXXX</div> <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="10" data-offset-y="0" data-expected-width="300" data-expected-height="5">XXXXX XXXXXX</div>
<div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div> <div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div>
</div> </div>
</div> </div>
<div class="unconstrainedContainer" style="position: relative"> <div class="unconstrainedContainer" style="position: relative">
<div class="grid gridAutoMinMaxContent gridAutoFlowRow"> <div class="grid gridAutoMinMaxContent gridAutoFlowRowDense">
<div class="sizedToGridArea firstRowAutoColumn" data-offset-x="10" data-offset-y="0" data-expected-width="120" data-expected-height="5">XXXXX XXXXXX</div> <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="10" data-offset-y="0" data-expected-width="120" data-expected-height="5">XXXXX XXXXXX</div>
<div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div> <div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div>
</div> </div>
</div> </div>
<div class="unconstrainedContainer" style="position: relative"> <div class="unconstrainedContainer" style="position: relative">
<div class="grid gridAutoMinMaxContent gridAutoFlowColumn"> <div class="grid gridAutoMinMaxContent gridAutoFlowColumnDense">
<div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="5" data-expected-width="10" data-expected-height="20">XXXXX XXXXXX</div> <div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="5" data-expected-width="10" data-expected-height="20">XXXXX XXXXXX</div>
<div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div> <div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div>
</div> </div>
</div> </div>
<div class="unconstrainedContainer" style="position: relative"> <div class="unconstrainedContainer" style="position: relative">
<div class="grid gridAutoMinMaxContent gridAutoFlowRow"> <div class="grid gridAutoMinMaxContent gridAutoFlowRowDense">
<div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="5" data-expected-width="10" data-expected-height="20">XXXXX XXXXXX</div> <div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="5" data-expected-width="10" data-expected-height="20">XXXXX XXXXXX</div>
<div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div> <div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div>
</div> </div>
</div> </div>
<div class="unconstrainedContainer" style="position: relative"> <div class="unconstrainedContainer" style="position: relative">
<div class="grid gridAutoMinMaxContent gridAutoFlowColumn"> <div class="grid gridAutoMinMaxContent gridAutoFlowColumnDense">
<div class="sizedToGridArea firstRowAutoColumn" data-offset-x="10" data-offset-y="0" data-expected-width="120" data-expected-height="5">XXXXX XXXXXX</div> <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="10" data-offset-y="0" data-expected-width="120" data-expected-height="5">XXXXX XXXXXX</div>
<div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div> <div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="5"></div>
</div> </div>
......
third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-auto-flow-get-set-expected.txt
View file @ e6c17c99
...@@ -4,8 +4,8 @@ On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE ...@@ -4,8 +4,8 @@ On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE
Test getting auto-flow set through CSS Test getting auto-flow set through CSS
PASS window.getComputedStyle(gridAutoFlowColumn, '').getPropertyValue('grid-auto-flow') is 'column' PASS window.getComputedStyle(gridAutoFlowColumnSparse, '').getPropertyValue('grid-auto-flow') is 'column'
PASS window.getComputedStyle(gridAutoFlowRow, '').getPropertyValue('grid-auto-flow') is 'row' PASS window.getComputedStyle(gridAutoFlowRowSparse, '').getPropertyValue('grid-auto-flow') is 'row'
PASS window.getComputedStyle(gridAutoFlowColumnDense, '').getPropertyValue('grid-auto-flow') is 'column dense' PASS window.getComputedStyle(gridAutoFlowColumnDense, '').getPropertyValue('grid-auto-flow') is 'column dense'
PASS window.getComputedStyle(gridAutoFlowRowDense, '').getPropertyValue('grid-auto-flow') is 'row dense' PASS window.getComputedStyle(gridAutoFlowRowDense, '').getPropertyValue('grid-auto-flow') is 'row dense'
PASS window.getComputedStyle(gridAutoFlowDenseColumn, '').getPropertyValue('grid-auto-flow') is 'column dense' PASS window.getComputedStyle(gridAutoFlowDenseColumn, '').getPropertyValue('grid-auto-flow') is 'column dense'
......
third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-auto-flow-get-set.html
View file @ e6c17c99
...@@ -63,8 +63,8 @@ ...@@ -63,8 +63,8 @@
</head> </head>
<body> <body>
<div class="grid" id="gridInitial"></div> <div class="grid" id="gridInitial"></div>
<div class="grid gridAutoFlowColumn" id="gridAutoFlowColumn"></div> <div class="grid gridAutoFlowColumnSparse" id="gridAutoFlowColumnSparse"></div>
<div class="grid gridAutoFlowRow" id="gridAutoFlowRow"></div> <div class="grid gridAutoFlowRowSparse" id="gridAutoFlowRowSparse"></div>
<div class="grid gridAutoFlowColumnDense" id="gridAutoFlowColumnDense"></div> <div class="grid gridAutoFlowColumnDense" id="gridAutoFlowColumnDense"></div>
<div class="grid gridAutoFlowRowDense" id="gridAutoFlowRowDense"></div> <div class="grid gridAutoFlowRowDense" id="gridAutoFlowRowDense"></div>
<div class="grid gridAutoFlowDenseColumn" id="gridAutoFlowDenseColumn"></div> <div class="grid gridAutoFlowDenseColumn" id="gridAutoFlowDenseColumn"></div>
...@@ -74,10 +74,10 @@ ...@@ -74,10 +74,10 @@
<div class="grid gridAutoFlowStackRow" id="gridAutoFlowStackRow"></div> <div class="grid gridAutoFlowStackRow" id="gridAutoFlowStackRow"></div>
<div class="grid gridAutoFlowColumnStack" id="gridAutoFlowColumnStack"></div> <div class="grid gridAutoFlowColumnStack" id="gridAutoFlowColumnStack"></div>
<div class="grid gridAutoFlowRowStack" id="gridAutoFlowRowStack"></div> <div class="grid gridAutoFlowRowStack" id="gridAutoFlowRowStack"></div>
<div class="grid gridAutoFlowColumn"> <div class="grid gridAutoFlowColumnSparse">
<div class="grid gridAutoFlowInherit" id="gridAutoFlowInherit"></div> <div class="grid gridAutoFlowInherit" id="gridAutoFlowInherit"></div>
</div> </div>
<div class="grid gridAutoFlowColumn"> <div class="grid gridAutoFlowColumnSparse">
<div><div class="grid gridAutoFlowInherit" id="gridAutoFlowNoInherit"></div><div> <div><div class="grid gridAutoFlowInherit" id="gridAutoFlowNoInherit"></div><div>
</div> </div>
<div class="grid gridAutoFlowNone" id="gridAutoFlowNone"></div> <div class="grid gridAutoFlowNone" id="gridAutoFlowNone"></div>
...@@ -93,11 +93,11 @@ ...@@ -93,11 +93,11 @@
description('Test that setting and getting grid-auto-flow works as expected'); description('Test that setting and getting grid-auto-flow works as expected');
debug("Test getting auto-flow set through CSS"); debug("Test getting auto-flow set through CSS");
var gridAutoFlowColumn = document.getElementById("gridAutoFlowColumn"); var gridAutoFlowColumnSparse = document.getElementById("gridAutoFlowColumnSparse");
shouldBe("window.getComputedStyle(gridAutoFlowColumn, '').getPropertyValue('grid-auto-flow')", "'column'"); shouldBe("window.getComputedStyle(gridAutoFlowColumnSparse, '').getPropertyValue('grid-auto-flow')", "'column'");
var gridAutoFlowRow = document.getElementById("gridAutoFlowRow"); var gridAutoFlowRowSparse = document.getElementById("gridAutoFlowRowSparse");
shouldBe("window.getComputedStyle(gridAutoFlowRow, '').getPropertyValue('grid-auto-flow')", "'row'"); shouldBe("window.getComputedStyle(gridAutoFlowRowSparse, '').getPropertyValue('grid-auto-flow')", "'row'");
var gridAutoFlowColumnDense = document.getElementById("gridAutoFlowColumnDense"); var gridAutoFlowColumnDense = document.getElementById("gridAutoFlowColumnDense");
shouldBe("window.getComputedStyle(gridAutoFlowColumnDense, '').getPropertyValue('grid-auto-flow')", "'column dense'"); shouldBe("window.getComputedStyle(gridAutoFlowColumnDense, '').getPropertyValue('grid-auto-flow')", "'column dense'");
......
third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-auto-flow-resolution.html
View file @ e6c17c99
...@@ -56,7 +56,7 @@ ...@@ -56,7 +56,7 @@
</div> </div>
<div class="unconstrainedContainer"> <div class="unconstrainedContainer">
<div class="grid bigGrid gridAutoFlowColumn"> <div class="grid bigGrid gridAutoFlowColumnDense">
<div class="sizedToGridArea secondRowSecondColumn" data-offset-x="50" data-offset-y="50" data-expected-width="100" data-expected-height="100">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea secondRowSecondColumn" data-offset-x="50" data-offset-y="50" data-expected-width="100" data-expected-height="100">XXXXX XXXXX XXXXX</div>
<div class="sizedToGridArea firstRowSecondColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea firstRowSecondColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50">XXXXX XXXXX XXXXX</div>
<div class="sizedToGridArea secondRowFirstColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea secondRowFirstColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100">XXXXX XXXXX XXXXX</div>
...@@ -66,7 +66,7 @@ ...@@ -66,7 +66,7 @@
</div> </div>
<div class="unconstrainedContainer"> <div class="unconstrainedContainer">
<div class="grid bigGrid gridAutoFlowRow"> <div class="grid bigGrid gridAutoFlowRowDense">
<div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50">XXXXX XXXXX XXXXX</div>
<div class="sizedToGridArea firstRowSecondColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea firstRowSecondColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50">XXXXX XXXXX XXXXX</div>
<div class="sizedToGridArea secondRowSecondColumn" data-offset-x="50" data-offset-y="50" data-expected-width="100" data-expected-height="100">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea secondRowSecondColumn" data-offset-x="50" data-offset-y="50" data-expected-width="100" data-expected-height="100">XXXXX XXXXX XXXXX</div>
...@@ -97,7 +97,7 @@ ...@@ -97,7 +97,7 @@
<!-- Using some 2 positions non-spanning fixed grid-{row|column} --> <!-- Using some 2 positions non-spanning fixed grid-{row|column} -->
<div class="unconstrainedContainer"> <div class="unconstrainedContainer">
<div class="grid bigGrid gridAutoFlowColumn"> <div class="grid bigGrid gridAutoFlowColumnDense">
<div class="sizedToGridArea autoLastRowAutoLastColumn" data-offset-x="300" data-offset-y="300" data-expected-width="200" data-expected-height="200">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea autoLastRowAutoLastColumn" data-offset-x="300" data-offset-y="300" data-expected-width="200" data-expected-height="200">XXXXX XXXXX XXXXX</div>
<div class="sizedToGridArea firstAutoRowSecondAutoColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea firstAutoRowSecondAutoColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50">XXXXX XXXXX XXXXX</div>
<div class="sizedToGridArea secondRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea secondRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100">XXXXX XXXXX XXXXX</div>
...@@ -107,7 +107,7 @@ ...@@ -107,7 +107,7 @@
</div> </div>
<div class="unconstrainedContainer"> <div class="unconstrainedContainer">
<div class="grid bigGrid gridAutoFlowRow"> <div class="grid bigGrid gridAutoFlowRowDense">
<div class="sizedToGridArea autoLastRowAutoLastColumn" data-offset-x="300" data-offset-y="300" data-expected-width="200" data-expected-height="200">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea autoLastRowAutoLastColumn" data-offset-x="300" data-offset-y="300" data-expected-width="200" data-expected-height="200">XXXXX XXXXX XXXXX</div>
<div class="sizedToGridArea firstAutoRowSecondAutoColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea firstAutoRowSecondAutoColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50">XXXXX XXXXX XXXXX</div>
<div class="sizedToGridArea secondRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea secondRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100">XXXXX XXXXX XXXXX</div>
...@@ -117,28 +117,28 @@ ...@@ -117,28 +117,28 @@
</div> </div>
<div class="unconstrainedContainer"> <div class="unconstrainedContainer">
<div class="grid bigGrid gridAutoFlowColumn"> <div class="grid bigGrid gridAutoFlowColumnDense">
<div class="sizedToGridArea overflowingRowFirstColumn" data-offset-x="0" data-offset-y="500" data-expected-width="50" data-expected-height="30">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea overflowingRowFirstColumn" data-offset-x="0" data-offset-y="500" data-expected-width="50" data-expected-height="30">XXXXX XXXXX XXXXX</div>
<div class="sizedToGridArea secondRowOverflowingColumn" data-offset-x="500" data-offset-y="50" data-expected-width="170" data-expected-height="100">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea secondRowOverflowingColumn" data-offset-x="500" data-offset-y="50" data-expected-width="170" data-expected-height="100">XXXXX XXXXX XXXXX</div>
</div> </div>
</div> </div>
<div class="unconstrainedContainer"> <div class="unconstrainedContainer">
<div class="grid bigGrid gridAutoFlowRow"> <div class="grid bigGrid gridAutoFlowRowDense">
<div class="sizedToGridArea overflowingRowFirstColumn" data-offset-x="0" data-offset-y="500" data-expected-width="50" data-expected-height="30">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea overflowingRowFirstColumn" data-offset-x="0" data-offset-y="500" data-expected-width="50" data-expected-height="30">XXXXX XXXXX XXXXX</div>
<div class="sizedToGridArea secondRowOverflowingColumn" data-offset-x="500" data-offset-y="50" data-expected-width="170" data-expected-height="100">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea secondRowOverflowingColumn" data-offset-x="500" data-offset-y="50" data-expected-width="170" data-expected-height="100">XXXXX XXXXX XXXXX</div>
</div> </div>
</div> </div>
<div class="unconstrainedContainer"> <div class="unconstrainedContainer">
<div class="grid bigGrid gridAutoFlowColumn"> <div class="grid bigGrid gridAutoFlowColumnDense">
<div class="sizedToGridArea negativeOverflowingRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea negativeOverflowingRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50">XXXXX XXXXX XXXXX</div>
<div class="sizedToGridArea secondRowNegativeOverflowingColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea secondRowNegativeOverflowingColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100">XXXXX XXXXX XXXXX</div>
</div> </div>
</div> </div>
<div class="unconstrainedContainer"> <div class="unconstrainedContainer">
<div class="grid bigGrid gridAutoFlowRow"> <div class="grid bigGrid gridAutoFlowRowDense">
<div class="sizedToGridArea negativeOverflowingRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea negativeOverflowingRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50">XXXXX XXXXX XXXXX</div>
<div class="sizedToGridArea secondRowNegativeOverflowingColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea secondRowNegativeOverflowingColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100">XXXXX XXXXX XXXXX</div>
</div> </div>
......
third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-auto-flow-sparse.html
View file @ e6c17c99
...@@ -62,7 +62,7 @@ ...@@ -62,7 +62,7 @@
</div> </div>
<div class="unconstrainedContainer"> <div class="unconstrainedContainer">
<div class="grid gridAutoFlowColumn"> <div class="grid gridAutoFlowColumnSparse">
<div class="sizedToGridArea secondRowFirstColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div> <div class="sizedToGridArea secondRowFirstColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div>
<div class="sizedToGridArea autoRowSpanning2AutoColumn" data-offset-x="0" data-offset-y="150" data-expected-width="50" data-expected-height="350"></div> <div class="sizedToGridArea autoRowSpanning2AutoColumn" data-offset-x="0" data-offset-y="150" data-expected-width="50" data-expected-height="350"></div>
<div class="sizedToGridArea autoRowAutoColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div> <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
...@@ -73,7 +73,7 @@ ...@@ -73,7 +73,7 @@
</div> </div>
<div class="unconstrainedContainer"> <div class="unconstrainedContainer">
<div class="grid gridAutoFlowColumn"> <div class="grid gridAutoFlowColumnSparse">
<div class="sizedToGridArea secondRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div> <div class="sizedToGridArea secondRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div>
<div class="sizedToGridArea autoRowSpanning2AutoColumn" data-offset-x="0" data-offset-y="150" data-expected-width="50" data-expected-height="350"></div> <div class="sizedToGridArea autoRowSpanning2AutoColumn" data-offset-x="0" data-offset-y="150" data-expected-width="50" data-expected-height="350"></div>
<div class="sizedToGridArea firstRowAutoColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div> <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
...@@ -86,7 +86,7 @@ ...@@ -86,7 +86,7 @@
</div> </div>
<div class="unconstrainedContainer"> <div class="unconstrainedContainer">
<div class="grid gridAutoFlowColumn"> <div class="grid gridAutoFlowColumnSparse">
<div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50"></div> <div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50"></div>
<div class="sizedToGridArea autoRowSecondColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div> <div class="sizedToGridArea autoRowSecondColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
<div class="sizedToGridArea secondRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div> <div class="sizedToGridArea secondRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div>
...@@ -96,7 +96,7 @@ ...@@ -96,7 +96,7 @@
</div> </div>
<div class="unconstrainedContainer"> <div class="unconstrainedContainer">
<div class="grid gridAutoFlowColumn"> <div class="grid gridAutoFlowColumnSparse">
<div class="sizedToGridArea firstRowAutoColumn" data-offset-x="150" data-offset-y="0" data-expected-width="150" data-expected-height="50"></div> <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="150" data-offset-y="0" data-expected-width="150" data-expected-height="50"></div>
<div class="sizedToGridArea secondRowFirstColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div> <div class="sizedToGridArea secondRowFirstColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div>
<div class="sizedToGridArea autoRowSecondColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div> <div class="sizedToGridArea autoRowSecondColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
......
third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-item-addition-auto-placement-update.html
View file @ e6c17c99
...@@ -28,16 +28,16 @@ function testAdditions() ...@@ -28,16 +28,16 @@ function testAdditions()
{ {
var testOutput = document.getElementById("test-output"); var testOutput = document.getElementById("test-output");
checkLayout("#autoFlowColumnElement", testOutput); checkLayout("#autoFlowColumnElement", testOutput);
testAddition("gridAutoFlowColumn", { 'row': '1', 'column': '1' }, "autoFlowColumnElement", { 'width': '50', 'height': '100' }); testAddition("gridAutoFlowColumnDense", { 'row': '1', 'column': '1' }, "autoFlowColumnElement", { 'width': '50', 'height': '100' });
testAddition("gridAutoFlowColumn", { 'row': '1', 'column': '2' }, "autoFlowColumnElement", { 'width': '50', 'height': '100' }); testAddition("gridAutoFlowColumnDense", { 'row': '1', 'column': '2' }, "autoFlowColumnElement", { 'width': '50', 'height': '100' });
testAddition("gridAutoFlowColumn", { 'row': '2', 'column': '2' }, "autoFlowColumnElement", { 'width': '50', 'height': '100' }); testAddition("gridAutoFlowColumnDense", { 'row': '2', 'column': '2' }, "autoFlowColumnElement", { 'width': '50', 'height': '100' });
testAddition("gridAutoFlowColumn", { 'row': '2', 'column': '1' }, "autoFlowColumnElement", { 'width': '170', 'height': '50' }); testAddition("gridAutoFlowColumnDense", { 'row': '2', 'column': '1' }, "autoFlowColumnElement", { 'width': '170', 'height': '50' });
checkLayout("#autoFlowRowElement", testOutput); checkLayout("#autoFlowRowElement", testOutput);
testAddition("gridAutoFlowRow", { 'row': '1', 'column': '1' }, "autoFlowRowElement", { 'width': '100', 'height': '50' }); testAddition("gridAutoFlowRowDense", { 'row': '1', 'column': '1' }, "autoFlowRowElement", { 'width': '100', 'height': '50' });
testAddition("gridAutoFlowRow", { 'row': '2', 'column': '1' }, "autoFlowRowElement", { 'width': '100', 'height': '50' }); testAddition("gridAutoFlowRowDense", { 'row': '2', 'column': '1' }, "autoFlowRowElement", { 'width': '100', 'height': '50' });
testAddition("gridAutoFlowRow", { 'row': '2', 'column': '2' }, "autoFlowRowElement", { 'width': '100', 'height': '50' }); testAddition("gridAutoFlowRowDense", { 'row': '2', 'column': '2' }, "autoFlowRowElement", { 'width': '100', 'height': '50' });
testAddition("gridAutoFlowRow", { 'row': '1', 'column': '2' }, "autoFlowRowElement", { 'width': '50', 'height': '30' }); testAddition("gridAutoFlowRowDense", { 'row': '1', 'column': '2' }, "autoFlowRowElement", { 'width': '50', 'height': '30' });
checkLayout("#gridAutoFlowColumnWithAuto", testOutput); checkLayout("#gridAutoFlowColumnWithAuto", testOutput);
testAddition("gridAutoFlowColumnWithAuto", { 'row': 'auto', 'column': '1' }, "autoFlowColumnElementWithAuto", { 'width': '50', 'height': '100' }); testAddition("gridAutoFlowColumnWithAuto", { 'row': 'auto', 'column': '1' }, "autoFlowColumnElementWithAuto", { 'width': '50', 'height': '100' });
...@@ -58,25 +58,25 @@ window.addEventListener("load", testAdditions, false); ...@@ -58,25 +58,25 @@ window.addEventListener("load", testAdditions, false);
<p>This test checks that the tracks' auto positions are recomputed after adding a grid item.</p> <p>This test checks that the tracks' auto positions are recomputed after adding a grid item.</p>
<div class="unconstrainedContainer"> <div class="unconstrainedContainer">
<div class="grid gridAutoFlowColumn" id="gridAutoFlowColumn"> <div class="grid gridAutoFlowColumnDense" id="gridAutoFlowColumnDense">
<div class="sizedToGridArea autoRowAutoColumn" id="autoFlowColumnElement" data-expected-width="50" data-expected-height="50">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea autoRowAutoColumn" id="autoFlowColumnElement" data-expected-width="50" data-expected-height="50">XXXXX XXXXX XXXXX</div>
</div> </div>
</div> </div>
<div class="unconstrainedContainer"> <div class="unconstrainedContainer">
<div class="grid gridAutoFlowRow" id="gridAutoFlowRow"> <div class="grid gridAutoFlowRowDense" id="gridAutoFlowRowDense">
<div class="sizedToGridArea autoRowAutoColumn" id="autoFlowRowElement" data-expected-width="50" data-expected-height="50">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea autoRowAutoColumn" id="autoFlowRowElement" data-expected-width="50" data-expected-height="50">XXXXX XXXXX XXXXX</div>
</div> </div>
</div> </div>
<div class="unconstrainedContainer"> <div class="unconstrainedContainer">
<div class="grid gridAutoFlowColumn" id="gridAutoFlowColumnWithAuto"> <div class="grid gridAutoFlowColumnDense" id="gridAutoFlowColumnWithAuto">
<div class="sizedToGridArea autoRowAutoColumn" id="autoFlowColumnElementWithAuto" data-expected-width="50" data-expected-height="50">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea autoRowAutoColumn" id="autoFlowColumnElementWithAuto" data-expected-width="50" data-expected-height="50">XXXXX XXXXX XXXXX</div>
</div> </div>
</div> </div>
<div class="unconstrainedContainer"> <div class="unconstrainedContainer">
<div class="grid gridAutoFlowRow" id="gridAutoFlowRowWithAuto"> <div class="grid gridAutoFlowRowDense" id="gridAutoFlowRowWithAuto">
<div class="sizedToGridArea autoRowAutoColumn" id="autoFlowRowElementWithAuto" data-expected-width="50" data-expected-height="50">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea autoRowAutoColumn" id="autoFlowRowElementWithAuto" data-expected-width="50" data-expected-height="50">XXXXX XXXXX XXXXX</div>
</div> </div>
</div> </div>
......
third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-item-auto-placement-automatic-span.html
View file @ e6c17c99
...@@ -69,7 +69,7 @@ ...@@ -69,7 +69,7 @@
<p>Thist test checks that span is supported in auto-placement for automatic positions.</p> <p>Thist test checks that span is supported in auto-placement for automatic positions.</p>
<div style="position: relative"> <div style="position: relative">
<div class="grid gridAutoFlowRow"> <div class="grid gridAutoFlowRowDense">
<div class="sizedToGridArea autoRowAutoColumnSpanning2" data-offset-x="0" data-offset-y="0" data-expected-width="200" data-expected-height="50"></div> <div class="sizedToGridArea autoRowAutoColumnSpanning2" data-offset-x="0" data-offset-y="0" data-expected-width="200" data-expected-height="50"></div>
<div class="sizedToGridArea autoRowAutoColumn" data-offset-x="200" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div> <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="200" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
<div class="sizedToGridArea autoRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="100" data-expected-height="50"></div> <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="100" data-expected-height="50"></div>
...@@ -102,7 +102,7 @@ ...@@ -102,7 +102,7 @@
</div> </div>
<div style="position: relative"> <div style="position: relative">
<div class="grid gridAutoFlowRow"> <div class="grid gridAutoFlowRowDense">
<div class="sizedToGridArea autoRowSpanning2AutoColumn" data-offset-x="0" data-offset-y="0" data-expected-width="100" data-expected-height="100"></div> <div class="sizedToGridArea autoRowSpanning2AutoColumn" data-offset-x="0" data-offset-y="0" data-expected-width="100" data-expected-height="100"></div>
<div class="sizedToGridArea autoRowSecondColumn" data-offset-x="100" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div> <div class="sizedToGridArea autoRowSecondColumn" data-offset-x="100" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
<div class="sizedToGridArea autoRowThirdColumn" data-offset-x="200" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div> <div class="sizedToGridArea autoRowThirdColumn" data-offset-x="200" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
...@@ -130,7 +130,7 @@ ...@@ -130,7 +130,7 @@
</div> </div>
<div style="position: relative"> <div style="position: relative">
<div class="grid gridAutoFlowColumn"> <div class="grid gridAutoFlowColumnDense">
<div class="sizedToGridArea autoRowSpanning2AutoColumn" data-offset-x="0" data-offset-y="0" data-expected-width="100" data-expected-height="100"></div> <div class="sizedToGridArea autoRowSpanning2AutoColumn" data-offset-x="0" data-offset-y="0" data-expected-width="100" data-expected-height="100"></div>
<div class="sizedToGridArea autoRowAutoColumn" data-offset-x="0" data-offset-y="100" data-expected-width="100" data-expected-height="50"></div> <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="0" data-offset-y="100" data-expected-width="100" data-expected-height="50"></div>
<div class="sizedToGridArea autoRowAutoColumn" data-offset-x="100" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div> <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="100" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
...@@ -163,7 +163,7 @@ ...@@ -163,7 +163,7 @@
</div> </div>
<div style="position: relative"> <div style="position: relative">
<div class="grid gridAutoFlowColumn"> <div class="grid gridAutoFlowColumnDense">
<div class="sizedToGridArea autoRowAutoColumnSpanning2" data-offset-x="0" data-offset-y="0" data-expected-width="200" data-expected-height="50"></div> <div class="sizedToGridArea autoRowAutoColumnSpanning2" data-offset-x="0" data-offset-y="0" data-expected-width="200" data-expected-height="50"></div>
<div class="sizedToGridArea secondRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="100" data-expected-height="50"></div> <div class="sizedToGridArea secondRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="100" data-expected-height="50"></div>
<div class="sizedToGridArea thirdRowAutoColumn" data-offset-x="0" data-offset-y="100" data-expected-width="100" data-expected-height="50"></div> <div class="sizedToGridArea thirdRowAutoColumn" data-offset-x="0" data-offset-y="100" data-expected-width="100" data-expected-height="50"></div>
......
third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-item-auto-placement-definite-span.html
View file @ e6c17c99
...@@ -62,7 +62,7 @@ ...@@ -62,7 +62,7 @@
</div> </div>
<div style="position: relative"> <div style="position: relative">
<div class="grid gridAutoFlowRow"> <div class="grid gridAutoFlowRowDense">
<div class="sizedToGridArea firstRowSpanning2AutoColumn" data-offset-x="0" data-offset-y="0" data-expected-width="100" data-expected-height="100"></div> <div class="sizedToGridArea firstRowSpanning2AutoColumn" data-offset-x="0" data-offset-y="0" data-expected-width="100" data-expected-height="100"></div>
<div class="sizedToGridArea secondRowSpanning2AutoColumn" data-offset-x="100" data-offset-y="50" data-expected-width="100" data-expected-height="100"></div> <div class="sizedToGridArea secondRowSpanning2AutoColumn" data-offset-x="100" data-offset-y="50" data-expected-width="100" data-expected-height="100"></div>
<div class="sizedToGridArea firstRowSpanning3AutoColumn" data-offset-x="200" data-offset-y="0" data-expected-width="100" data-expected-height="150"></div> <div class="sizedToGridArea firstRowSpanning3AutoColumn" data-offset-x="200" data-offset-y="0" data-expected-width="100" data-expected-height="150"></div>
...@@ -82,7 +82,7 @@ ...@@ -82,7 +82,7 @@
</div> </div>
<div style="position: relative"> <div style="position: relative">
<div class="grid gridAutoFlowColumn"> <div class="grid gridAutoFlowColumnDense">
<div class="sizedToGridArea autoRowFirstColumnSpanning2" data-offset-x="0" data-offset-y="0" data-expected-width="200" data-expected-height="50"></div> <div class="sizedToGridArea autoRowFirstColumnSpanning2" data-offset-x="0" data-offset-y="0" data-expected-width="200" data-expected-height="50"></div>
<div class="sizedToGridArea autoRowSecondColumnSpanning2" data-offset-x="100" data-offset-y="50" data-expected-width="200" data-expected-height="50"></div> <div class="sizedToGridArea autoRowSecondColumnSpanning2" data-offset-x="100" data-offset-y="50" data-expected-width="200" data-expected-height="50"></div>
<div class="sizedToGridArea autoRowFirstColumnSpanning3" data-offset-x="0" data-offset-y="100" data-expected-width="300" data-expected-height="50"></div> <div class="sizedToGridArea autoRowFirstColumnSpanning3" data-offset-x="0" data-offset-y="100" data-expected-width="300" data-expected-height="50"></div>
......
third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-item-order-auto-flow-resolution.html
View file @ e6c17c99
...@@ -22,14 +22,14 @@ ...@@ -22,14 +22,14 @@
<!-- Step 1, grid item with a major-axis position that is not 'auto'. --> <!-- Step 1, grid item with a major-axis position that is not 'auto'. -->
<div style="position: relative"> <div style="position: relative">
<div class="grid gridAutoFlowRow"> <div class="grid gridAutoFlowRowDense">
<div class="sizedToGridArea firstRowAutoColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div> <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
<div class="sizedToGridArea firstRowAutoColumn negativeOrder" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50"></div> <div class="sizedToGridArea firstRowAutoColumn negativeOrder" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50"></div>
</div> </div>
</div> </div>
<div style="position: relative"> <div style="position: relative">
<div class="grid gridAutoFlowRow"> <div class="grid gridAutoFlowRowDense">
<div class="sizedToGridArea firstRowAutoColumn positiveOrder" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div> <div class="sizedToGridArea firstRowAutoColumn positiveOrder" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
<div class="sizedToGridArea firstRowAutoColumn" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50"></div> <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50"></div>
</div> </div>
...@@ -37,14 +37,14 @@ ...@@ -37,14 +37,14 @@
<!-- Step 4.1, grid items with a minor-axis position that is not 'auto'. --> <!-- Step 4.1, grid items with a minor-axis position that is not 'auto'. -->
<div style="position: relative"> <div style="position: relative">
<div class="grid gridAutoFlowColumn"> <div class="grid gridAutoFlowColumnDense">
<div class="sizedToGridArea secondRowAutoColumn" data-offset-x="50" data-offset-y="50" data-expected-width="100" data-expected-height="100"></div> <div class="sizedToGridArea secondRowAutoColumn" data-offset-x="50" data-offset-y="50" data-expected-width="100" data-expected-height="100"></div>
<div class="sizedToGridArea secondRowAutoColumn negativeOrder" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div> <div class="sizedToGridArea secondRowAutoColumn negativeOrder" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div>
</div> </div>
</div> </div>
<div style="position: relative"> <div style="position: relative">
<div class="grid gridAutoFlowColumn"> <div class="grid gridAutoFlowColumnDense">
<div class="sizedToGridArea secondRowAutoColumn positiveOrder" data-offset-x="50" data-offset-y="50" data-expected-width="100" data-expected-height="100"></div> <div class="sizedToGridArea secondRowAutoColumn positiveOrder" data-offset-x="50" data-offset-y="50" data-expected-width="100" data-expected-height="100"></div>
<div class="sizedToGridArea secondRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div> <div class="sizedToGridArea secondRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div>
</div> </div>
...@@ -52,14 +52,14 @@ ...@@ -52,14 +52,14 @@
<!-- Step 4.2, both minor and major-axis position are 'auto'. --> <!-- Step 4.2, both minor and major-axis position are 'auto'. -->
<div style="position: relative"> <div style="position: relative">
<div class="grid gridAutoFlowColumn"> <div class="grid gridAutoFlowColumnDense">
<div class="sizedToGridArea" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div> <div class="sizedToGridArea" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div>
<div class="sizedToGridArea negativeOrder" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50"></div> <div class="sizedToGridArea negativeOrder" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50"></div>
</div> </div>
</div> </div>
<div style="position: relative"> <div style="position: relative">
<div class="grid gridAutoFlowColumn"> <div class="grid gridAutoFlowColumnDense">
<div class="sizedToGridArea positiveOrder" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div> <div class="sizedToGridArea positiveOrder" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div>
<div class="sizedToGridArea" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50"></div> <div class="sizedToGridArea" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50"></div>
</div> </div>
......
third_party/WebKit/LayoutTests/fast/css-grid-layout/grid-item-removal-auto-placement-update.html
View file @ e6c17c99
...@@ -27,16 +27,16 @@ function testRemovals() ...@@ -27,16 +27,16 @@ function testRemovals()
{ {
var testOutput = document.getElementById("test-output"); var testOutput = document.getElementById("test-output");
checkLayout("#autoFlowColumnElement", testOutput); checkLayout("#autoFlowColumnElement", testOutput);
testRemoval("gridAutoFlowColumn", "autoFlowColumnElement", { 'width': '100', 'height': '100' }); testRemoval("gridAutoFlowColumnDense", "autoFlowColumnElement", { 'width': '100', 'height': '100' });
testRemoval("gridAutoFlowColumn", "autoFlowColumnElement", { 'width': '100', 'height': '50' }); testRemoval("gridAutoFlowColumnDense", "autoFlowColumnElement", { 'width': '100', 'height': '50' });
testRemoval("gridAutoFlowColumn", "autoFlowColumnElement", { 'width': '50', 'height': '100' }); testRemoval("gridAutoFlowColumnDense", "autoFlowColumnElement", { 'width': '50', 'height': '100' });
testRemoval("gridAutoFlowColumn", "autoFlowColumnElement", { 'width': '50', 'height': '50' }); testRemoval("gridAutoFlowColumnDense", "autoFlowColumnElement", { 'width': '50', 'height': '50' });
checkLayout("#autoFlowRowElement", testOutput); checkLayout("#autoFlowRowElement", testOutput);
testRemoval("gridAutoFlowRow", "autoFlowRowElement", { 'width': '100', 'height': '100' }); testRemoval("gridAutoFlowRowDense", "autoFlowRowElement", { 'width': '100', 'height': '100' });
testRemoval("gridAutoFlowRow", "autoFlowRowElement", { 'width': '100', 'height': '50' }); testRemoval("gridAutoFlowRowDense", "autoFlowRowElement", { 'width': '100', 'height': '50' });
testRemoval("gridAutoFlowRow", "autoFlowRowElement", { 'width': '50', 'height': '50' }); testRemoval("gridAutoFlowRowDense", "autoFlowRowElement", { 'width': '50', 'height': '50' });
testRemoval("gridAutoFlowRow", "autoFlowRowElement", { 'width': '50', 'height': '50' }); testRemoval("gridAutoFlowRowDense", "autoFlowRowElement", { 'width': '50', 'height': '50' });
checkLayout("#gridAutoFlowColumnWithAutoItems", testOutput); checkLayout("#gridAutoFlowColumnWithAutoItems", testOutput);
testRemoval("gridAutoFlowColumnWithAutoItems", "autoFlowRowElementWithAutoItems", { 'width': '100', 'height': '100' }); testRemoval("gridAutoFlowColumnWithAutoItems", "autoFlowRowElementWithAutoItems", { 'width': '100', 'height': '100' });
...@@ -57,7 +57,7 @@ window.addEventListener("load", testRemovals, false); ...@@ -57,7 +57,7 @@ window.addEventListener("load", testRemovals, false);
<p>This test checks that the tracks' auto positions are recomputed after removing a grid item.</p> <p>This test checks that the tracks' auto positions are recomputed after removing a grid item.</p>
<div class="unconstrainedContainer"> <div class="unconstrainedContainer">
<div class="grid gridAutoFlowColumn" id="gridAutoFlowColumn"> <div class="grid gridAutoFlowColumnDense" id="gridAutoFlowColumnDense">
<div class="sizedToGridArea secondRowSecondColumn">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea secondRowSecondColumn">XXXXX XXXXX XXXXX</div>
<div class="sizedToGridArea firstRowSecondColumn">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea firstRowSecondColumn">XXXXX XXXXX XXXXX</div>
<div class="sizedToGridArea secondRowFirstColumn">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea secondRowFirstColumn">XXXXX XXXXX XXXXX</div>
...@@ -67,7 +67,7 @@ window.addEventListener("load", testRemovals, false); ...@@ -67,7 +67,7 @@ window.addEventListener("load", testRemovals, false);
</div> </div>
<div class="unconstrainedContainer"> <div class="unconstrainedContainer">
<div class="grid gridAutoFlowRow" id="gridAutoFlowRow"> <div class="grid gridAutoFlowRowDense" id="gridAutoFlowRowDense">
<div class="sizedToGridArea secondRowSecondColumn">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea secondRowSecondColumn">XXXXX XXXXX XXXXX</div>
<div class="sizedToGridArea firstRowSecondColumn">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea firstRowSecondColumn">XXXXX XXXXX XXXXX</div>
<div class="sizedToGridArea firstRowFirstColumn">XXXXX XXXXX XXXXX</div> <div class="sizedToGridArea firstRowFirstColumn">XXXXX XXXXX XXXXX</div>
......
third_party/WebKit/LayoutTests/fast/css-grid-layout/resources/grid.css
View file @ e6c17c99
...@@ -151,8 +151,7 @@ ...@@ -151,8 +151,7 @@
grid-auto-flow: stack; grid-auto-flow: stack;
} }
/* FIXME: Rename to gridAutoFlowColumnSparse to be more explicit about the algorithm mode by default. */ .gridAutoFlowColumnSparse {
.gridAutoFlowColumn {
grid-auto-flow: column; grid-auto-flow: column;
} }
...@@ -160,8 +159,7 @@ ...@@ -160,8 +159,7 @@
grid-auto-flow: column dense; grid-auto-flow: column dense;
} }
/* FIXME: Rename to gridAutoFlowRowSparse to be more explicit about the algorithm mode by default. */ .gridAutoFlowRowSparse {
.gridAutoFlowRow {
grid-auto-flow: row; grid-auto-flow: row;
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment