<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[171082] trunk</title>
</head>
<body>
<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; }
#msg dl a { font-weight: bold}
#msg dl a:link { color:#fc3; }
#msg dl a:active { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://trac.webkit.org/projects/webkit/changeset/171082">171082</a></dd>
<dt>Author</dt> <dd>rego@igalia.com</dd>
<dt>Date</dt> <dd>2014-07-14 14:23:49 -0700 (Mon, 14 Jul 2014)</dd>
</dl>
<h3>Log Message</h3>
<pre>[CSS Grid Layout] Support sparse in auto-placement algorithm
https://bugs.webkit.org/show_bug.cgi?id=134544
Reviewed by Sergio Villar Senin.
Source/WebCore:
This patch implements sparse mode for auto-placement algorithm, which is
the default mode in the new grid-auto-flow syntax. It keeps track of the
auto-placement cursor in
RenderGrid::placeAutoMajorAxisItemsOnGrid() and updates it accordingly
when auto-positioned items are placed.
If we're in dense mode it resets the cursor after each item (which keeps
the old behavior that was using dense mode by default).
GridIterator has been adapted to look for empty areas from a given
position in both directions.
Test: fast/css-grid-layout/grid-auto-flow-sparse.html
* rendering/RenderGrid.cpp:
(WebCore::RenderGrid::GridIterator::GridIterator): Modify constructor to
add an optional argument for the varying index. This allows to look for
empty areas in both axis.
(WebCore::RenderGrid::placeAutoMajorAxisItemsOnGrid): Defined the
auto-placement cursor and rested after each item if we're in dense mode.
(WebCore::RenderGrid::placeAutoMajorAxisItemOnGrid): Use auto-placement
cursor to look for empty areas from the last auto-positioned item
placed.
* rendering/RenderGrid.h: Modify placeAutoMajorAxisItemOnGrid() header
to receive the auto-placement cursor.
LayoutTests:
Test cases have been adapted accordingly, adding new cases to cover both
sparse and dense options.
* fast/css-grid-layout/grid-auto-flow-resolution-expected.txt:
* fast/css-grid-layout/grid-auto-flow-resolution.html:
* fast/css-grid-layout/grid-auto-flow-sparse-expected.txt: Added.
* fast/css-grid-layout/grid-auto-flow-sparse.html: Added.
* fast/css-grid-layout/grid-container-change-named-grid-lines-recompute-child.html:
* fast/css-grid-layout/grid-item-auto-placement-automatic-span-expected.txt:
* fast/css-grid-layout/grid-item-auto-placement-automatic-span.html:
* fast/css-grid-layout/grid-item-auto-placement-definite-span-expected.txt:
* fast/css-grid-layout/grid-item-auto-placement-definite-span.html:
* fast/css-grid-layout/grid-item-removal-auto-placement-update.html:
* fast/css-grid-layout/named-grid-lines-with-named-grid-areas-resolution.html:
* fast/css-grid-layout/resources/grid.css:
(.autoRowAutoColumnSpanning2):
(.autoRowSpanning2AutoColumn):
(.autoRowSpanning2AutoColumnSpanning3):
(.autoRowSpanning3AutoColumnSpanning2):
(.gridAutoFlowColumnDense):
(.gridAutoFlowRowDense):</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsChangeLog">trunk/LayoutTests/ChangeLog</a></li>
<li><a href="#trunkLayoutTestsfastcssgridlayoutgridautoflowresolutionexpectedtxt">trunk/LayoutTests/fast/css-grid-layout/grid-auto-flow-resolution-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastcssgridlayoutgridautoflowresolutionhtml">trunk/LayoutTests/fast/css-grid-layout/grid-auto-flow-resolution.html</a></li>
<li><a href="#trunkLayoutTestsfastcssgridlayoutgridcontainerchangenamedgridlinesrecomputechildhtml">trunk/LayoutTests/fast/css-grid-layout/grid-container-change-named-grid-lines-recompute-child.html</a></li>
<li><a href="#trunkLayoutTestsfastcssgridlayoutgriditemautoplacementautomaticspanexpectedtxt">trunk/LayoutTests/fast/css-grid-layout/grid-item-auto-placement-automatic-span-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastcssgridlayoutgriditemautoplacementautomaticspanhtml">trunk/LayoutTests/fast/css-grid-layout/grid-item-auto-placement-automatic-span.html</a></li>
<li><a href="#trunkLayoutTestsfastcssgridlayoutgriditemautoplacementdefinitespanexpectedtxt">trunk/LayoutTests/fast/css-grid-layout/grid-item-auto-placement-definite-span-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastcssgridlayoutgriditemautoplacementdefinitespanhtml">trunk/LayoutTests/fast/css-grid-layout/grid-item-auto-placement-definite-span.html</a></li>
<li><a href="#trunkLayoutTestsfastcssgridlayoutgriditemremovalautoplacementupdatehtml">trunk/LayoutTests/fast/css-grid-layout/grid-item-removal-auto-placement-update.html</a></li>
<li><a href="#trunkLayoutTestsfastcssgridlayoutnamedgridlineswithnamedgridareasresolutionhtml">trunk/LayoutTests/fast/css-grid-layout/named-grid-lines-with-named-grid-areas-resolution.html</a></li>
<li><a href="#trunkLayoutTestsfastcssgridlayoutresourcesgridcss">trunk/LayoutTests/fast/css-grid-layout/resources/grid.css</a></li>
<li><a href="#trunkSourceWebCoreChangeLog">trunk/Source/WebCore/ChangeLog</a></li>
<li><a href="#trunkSourceWebCorerenderingRenderGridcpp">trunk/Source/WebCore/rendering/RenderGrid.cpp</a></li>
<li><a href="#trunkSourceWebCorerenderingRenderGridh">trunk/Source/WebCore/rendering/RenderGrid.h</a></li>
</ul>
<h3>Added Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsfastcssgridlayoutgridautoflowsparseexpectedtxt">trunk/LayoutTests/fast/css-grid-layout/grid-auto-flow-sparse-expected.txt</a></li>
<li><a href="#trunkLayoutTestsfastcssgridlayoutgridautoflowsparsehtml">trunk/LayoutTests/fast/css-grid-layout/grid-auto-flow-sparse.html</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkLayoutTestsChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/ChangeLog (171081 => 171082)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/ChangeLog 2014-07-14 21:22:10 UTC (rev 171081)
+++ trunk/LayoutTests/ChangeLog 2014-07-14 21:23:49 UTC (rev 171082)
</span><span class="lines">@@ -1,3 +1,32 @@
</span><ins>+2014-07-14 Manuel Rego Casasnovas <rego@igalia.com>
+
+ [CSS Grid Layout] Support sparse in auto-placement algorithm
+ https://bugs.webkit.org/show_bug.cgi?id=134544
+
+ Reviewed by Sergio Villar Senin.
+
+ Test cases have been adapted accordingly, adding new cases to cover both
+ sparse and dense options.
+
+ * fast/css-grid-layout/grid-auto-flow-resolution-expected.txt:
+ * fast/css-grid-layout/grid-auto-flow-resolution.html:
+ * fast/css-grid-layout/grid-auto-flow-sparse-expected.txt: Added.
+ * fast/css-grid-layout/grid-auto-flow-sparse.html: Added.
+ * fast/css-grid-layout/grid-container-change-named-grid-lines-recompute-child.html:
+ * fast/css-grid-layout/grid-item-auto-placement-automatic-span-expected.txt:
+ * fast/css-grid-layout/grid-item-auto-placement-automatic-span.html:
+ * fast/css-grid-layout/grid-item-auto-placement-definite-span-expected.txt:
+ * fast/css-grid-layout/grid-item-auto-placement-definite-span.html:
+ * fast/css-grid-layout/grid-item-removal-auto-placement-update.html:
+ * fast/css-grid-layout/named-grid-lines-with-named-grid-areas-resolution.html:
+ * fast/css-grid-layout/resources/grid.css:
+ (.autoRowAutoColumnSpanning2):
+ (.autoRowSpanning2AutoColumn):
+ (.autoRowSpanning2AutoColumnSpanning3):
+ (.autoRowSpanning3AutoColumnSpanning2):
+ (.gridAutoFlowColumnDense):
+ (.gridAutoFlowRowDense):
+
</ins><span class="cx"> 2014-07-14 Bear Travis <betravis@adobe.com>
</span><span class="cx">
</span><span class="cx"> [Feature Queries] Enable Feature Queries on Mac
</span></span></pre></div>
<a id="trunkLayoutTestsfastcssgridlayoutgridautoflowresolutionexpectedtxt"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/css-grid-layout/grid-auto-flow-resolution-expected.txt (171081 => 171082)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css-grid-layout/grid-auto-flow-resolution-expected.txt 2014-07-14 21:22:10 UTC (rev 171081)
+++ trunk/LayoutTests/fast/css-grid-layout/grid-auto-flow-resolution-expected.txt 2014-07-14 21:23:49 UTC (rev 171082)
</span><span class="lines">@@ -45,9 +45,15 @@
</span><span class="cx"> PASS
</span><span class="cx"> XXXXX XXXXX XXXXX
</span><span class="cx"> XXXXX XXXXX XXXXX
</span><ins>+XXXXX XXXXX XXXXX
+XXXXX XXXXX XXXXX
+XXXXX XXXXX XXXXX
</ins><span class="cx"> PASS
</span><span class="cx"> XXXXX XXXXX XXXXX
</span><span class="cx"> XXXXX XXXXX XXXXX
</span><ins>+XXXXX XXXXX XXXXX
+XXXXX XXXXX XXXXX
+XXXXX XXXXX XXXXX
</ins><span class="cx"> PASS
</span><span class="cx"> XXXXX XXXXX XXXXX
</span><span class="cx"> XXXXX XXXXX XXXXX
</span><span class="lines">@@ -55,3 +61,9 @@
</span><span class="cx"> XXXXX XXXXX XXXXX
</span><span class="cx"> XXXXX XXXXX XXXXX
</span><span class="cx"> PASS
</span><ins>+XXXXX XXXXX XXXXX
+XXXXX XXXXX XXXXX
+PASS
+XXXXX XXXXX XXXXX
+XXXXX XXXXX XXXXX
+PASS
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcssgridlayoutgridautoflowresolutionhtml"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/css-grid-layout/grid-auto-flow-resolution.html (171081 => 171082)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css-grid-layout/grid-auto-flow-resolution.html 2014-07-14 21:22:10 UTC (rev 171081)
+++ trunk/LayoutTests/fast/css-grid-layout/grid-auto-flow-resolution.html 2014-07-14 21:23:49 UTC (rev 171082)
</span><span class="lines">@@ -81,6 +81,16 @@
</span><span class="cx"> <div class="sizedToGridArea autoRowSecondColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50">XXXXX XXXXX XXXXX</div>
</span><span class="cx"> <div class="sizedToGridArea secondRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100">XXXXX XXXXX XXXXX</div>
</span><span class="cx"> <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="150" data-offset-y="0" data-expected-width="150" data-expected-height="50">XXXXX XXXXX XXXXX</div>
</span><ins>+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="150" data-offset-y="50" data-expected-width="150" data-expected-height="100">XXXXX XXXXX XXXXX</div>
+ </div>
+</div>
+
+<div class="unconstrainedContainer">
+ <div class="grid bigGrid gridAutoFlowColumnDense">
+ <div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50">XXXXX XXXXX XXXXX</div>
+ <div class="sizedToGridArea autoRowSecondColumn" 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 firstRowAutoColumn" data-offset-x="150" data-offset-y="0" data-expected-width="150" data-expected-height="50">XXXXX XXXXX XXXXX</div>
</ins><span class="cx"> <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="0" data-offset-y="150" data-expected-width="50" data-expected-height="150">XXXXX XXXXX XXXXX</div>
</span><span class="cx"> </div>
</span><span class="cx"> </div>
</span><span class="lines">@@ -91,6 +101,16 @@
</span><span class="cx"> <div class="sizedToGridArea firstRowSecondColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50">XXXXX XXXXX XXXXX</div>
</span><span class="cx"> <div class="sizedToGridArea secondRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100">XXXXX XXXXX XXXXX</div>
</span><span class="cx"> <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50">XXXXX XXXXX XXXXX</div>
</span><ins>+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="50" data-offset-y="150" data-expected-width="100" data-expected-height="150">XXXXX XXXXX XXXXX</div>
+ </div>
+</div>
+
+<div class="unconstrainedContainer">
+ <div class="grid bigGrid gridAutoFlowRowDense">
+ <div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="150" data-expected-width="50" data-expected-height="150">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 secondRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100">XXXXX XXXXX XXXXX</div>
+ <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50">XXXXX XXXXX XXXXX</div>
</ins><span class="cx"> <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="150" data-offset-y="0" data-expected-width="150" data-expected-height="50">XXXXX XXXXX XXXXX</div>
</span><span class="cx"> </div>
</span><span class="cx"> </div>
</span></span></pre></div>
<a id="trunkLayoutTestsfastcssgridlayoutgridautoflowsparseexpectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/css-grid-layout/grid-auto-flow-sparse-expected.txt (0 => 171082)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css-grid-layout/grid-auto-flow-sparse-expected.txt (rev 0)
+++ trunk/LayoutTests/fast/css-grid-layout/grid-auto-flow-sparse-expected.txt 2014-07-14 21:23:49 UTC (rev 171082)
</span><span class="lines">@@ -0,0 +1,6 @@
</span><ins>+This test checks that the auto-placement algorithm is sparse by default.
+
+PASS
+PASS
+PASS
+PASS
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcssgridlayoutgridautoflowsparsehtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/fast/css-grid-layout/grid-auto-flow-sparse.html (0 => 171082)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css-grid-layout/grid-auto-flow-sparse.html (rev 0)
+++ trunk/LayoutTests/fast/css-grid-layout/grid-auto-flow-sparse.html 2014-07-14 21:23:49 UTC (rev 171082)
</span><span class="lines">@@ -0,0 +1,69 @@
</span><ins>+<!DOCTYPE html>
+<html>
+<link href="resources/grid.css" rel="stylesheet">
+<style>
+.grid {
+ -webkit-grid-template-columns: 50px 100px 150px 200px;
+ -webkit-grid-template-rows: 50px 100px 150px 200px;
+}
+
+.unconstrainedContainer {
+ /* For accurate x / y offset. */
+ position: relative;
+}
+</style>
+<script src="../../resources/check-layout.js"></script>
+<body onload="checkLayout('.grid')">
+
+<p>This test checks that the auto-placement algorithm is sparse by default.</p>
+
+<div class="unconstrainedContainer">
+ <div class="grid">
+ <div class="sizedToGridArea firstRowSecondColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowAutoColumnSpanning2" data-offset-x="150" data-offset-y="0" data-expected-width="350" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div>
+ <div class="sizedToGridArea autoRowAutoColumnSpanning2" data-offset-x="50" data-offset-y="50" data-expected-width="250" data-expected-height="100"></div>
+ <div class="sizedToGridArea autoRowAutoColumnSpanning2" data-offset-x="0" data-offset-y="150" data-expected-width="150" data-expected-height="150"></div>
+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="150" data-offset-y="150" data-expected-width="150" data-expected-height="150"></div>
+ </div>
+</div>
+
+<div class="unconstrainedContainer">
+ <div class="grid">
+ <div class="sizedToGridArea autoRowSecondColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowAutoColumnSpanning2" data-offset-x="150" data-offset-y="0" data-expected-width="350" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="100"></div>
+ <div class="sizedToGridArea autoRowThirdColumn" data-offset-x="150" data-offset-y="50" data-expected-width="150" data-expected-height="100"></div>
+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="300" data-offset-y="50" data-expected-width="200" data-expected-height="100"></div>
+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="0" data-offset-y="150" data-expected-width="50" data-expected-height="150"></div>
+ <div class="sizedToGridArea autoRowSpanning2AutoColumnSpanning3" data-offset-x="50" data-offset-y="150" data-expected-width="450" data-expected-height="350"></div>
+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="0" data-offset-y="300" data-expected-width="50" data-expected-height="200"></div>
+ </div>
+</div>
+
+<div class="unconstrainedContainer">
+ <div class="grid gridAutoFlowColumn">
+ <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 autoRowAutoColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowSpanning2AutoColumn" data-offset-x="50" data-offset-y="50" data-expected-width="100" data-expected-height="250"></div>
+ <div class="sizedToGridArea autoRowSpanning2AutoColumn" data-offset-x="150" data-offset-y="0" data-expected-width="150" data-expected-height="150"></div>
+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="150" data-offset-y="150" data-expected-width="150" data-expected-height="150"></div>
+ </div>
+</div>
+
+<div class="unconstrainedContainer">
+ <div class="grid gridAutoFlowColumn">
+ <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 firstRowAutoColumn" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea thirdRowAutoColumn" data-offset-x="50" data-offset-y="150" data-expected-width="100" data-expected-height="150"></div>
+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="50" data-offset-y="300" data-expected-width="100" data-expected-height="200"></div>
+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="150" data-offset-y="0" data-expected-width="150" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowSpanning3AutoColumnSpanning2" data-offset-x="150" data-offset-y="50" data-expected-width="350" data-expected-height="450"></div>
+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="300" data-offset-y="0" data-expected-width="200" data-expected-height="50"></div>
+ </div>
+</div>
+
+</body>
+</html>
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcssgridlayoutgridcontainerchangenamedgridlinesrecomputechildhtml"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/css-grid-layout/grid-container-change-named-grid-lines-recompute-child.html (171081 => 171082)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css-grid-layout/grid-container-change-named-grid-lines-recompute-child.html 2014-07-14 21:22:10 UTC (rev 171081)
+++ trunk/LayoutTests/fast/css-grid-layout/grid-container-change-named-grid-lines-recompute-child.html 2014-07-14 21:23:49 UTC (rev 171082)
</span><span class="lines">@@ -5,7 +5,7 @@
</span><span class="cx"> <script src="../../resources/check-layout.js"></script>
</span><span class="cx"> <style type="text/css">
</span><span class="cx"> .grid {
</span><del>- -webkit-grid-auto-flow: row;
</del><ins>+ -webkit-grid-auto-flow: row dense;
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> #firstGridItem {
</span></span></pre></div>
<a id="trunkLayoutTestsfastcssgridlayoutgriditemautoplacementautomaticspanexpectedtxt"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/css-grid-layout/grid-item-auto-placement-automatic-span-expected.txt (171081 => 171082)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css-grid-layout/grid-item-auto-placement-automatic-span-expected.txt 2014-07-14 21:22:10 UTC (rev 171081)
+++ trunk/LayoutTests/fast/css-grid-layout/grid-item-auto-placement-automatic-span-expected.txt 2014-07-14 21:23:49 UTC (rev 171082)
</span><span class="lines">@@ -8,3 +8,11 @@
</span><span class="cx"> PASS
</span><span class="cx"> PASS
</span><span class="cx"> PASS
</span><ins>+PASS
+PASS
+PASS
+PASS
+PASS
+PASS
+PASS
+PASS
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcssgridlayoutgriditemautoplacementautomaticspanhtml"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/css-grid-layout/grid-item-auto-placement-automatic-span.html (171081 => 171082)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css-grid-layout/grid-item-auto-placement-automatic-span.html 2014-07-14 21:22:10 UTC (rev 171081)
+++ trunk/LayoutTests/fast/css-grid-layout/grid-item-auto-placement-automatic-span.html 2014-07-14 21:23:49 UTC (rev 171082)
</span><span class="lines">@@ -15,12 +15,6 @@
</span><span class="cx"> -webkit-grid-template-rows: 50px 100px (line) 200px (line);
</span><span class="cx"> }
</span><span class="cx">
</span><del>-.autoRowAutoColumnSpanning2 {
- background-color: maroon;
- -webkit-grid-column: span 2;
- -webkit-grid-row: auto;
-}
-
</del><span class="cx"> .autoRowAutoColumnSpanning3 {
</span><span class="cx"> background-color: teal;
</span><span class="cx"> -webkit-grid-column: span 3;
</span><span class="lines">@@ -91,12 +85,45 @@
</span><span class="cx"> </div>
</span><span class="cx">
</span><span class="cx"> <div style="position: relative">
</span><ins>+ <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 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 autoRowAutoColumnSpanning2" data-offset-x="100" data-offset-y="50" data-expected-width="200" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowAutoColumnSpanning3" data-offset-x="0" data-offset-y="100" data-expected-width="300" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowSpanning2AutoColumnSpanning2" data-offset-x="0" data-offset-y="150" data-expected-width="200" data-expected-height="100"></div>
+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="200" data-offset-y="150" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="200" data-offset-y="200" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="0" data-offset-y="250" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowSpanning2AutoColumnSpanning2" data-offset-x="100" data-offset-y="250" data-expected-width="200" data-expected-height="100"></div>
+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="0" data-offset-y="300" data-expected-width="100" data-expected-height="50"></div>
+ </div>
+</div>
+
+<div style="position: relative">
</ins><span class="cx"> <div class="grid gridAutoFlowRow">
</span><span class="cx"> <div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea autoRowSecondColumn" data-offset-x="100" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea autoRowThirdColumn" data-offset-x="200" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="50" data-expected-width="100" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea autoRowAutoColumnSpanning3" data-offset-x="0" data-offset-y="100" data-expected-width="300" data-expected-height="50"></div>
</span><ins>+ <div class="sizedToGridArea autoRowSecondColumn" data-offset-x="100" data-offset-y="150" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowAutoColumnSpanning2" data-offset-x="0" data-offset-y="200" data-expected-width="200" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowAutoColumnSpanning2" data-offset-x="0" data-offset-y="250" data-expected-width="200" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="300" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowAutoColumnSpanning3" data-offset-x="0" data-offset-y="350" data-expected-width="300" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowAutoColumnSpanning2" data-offset-x="0" data-offset-y="400" data-expected-width="200" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowSpanning2AutoColumnSpanning2" data-offset-x="0" data-offset-y="450" data-expected-width="200" data-expected-height="100"></div>
+ </div>
+</div>
+
+<div style="position: relative">
+ <div class="grid gridAutoFlowRowDense">
+ <div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" 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 autoRowFirstColumn" data-offset-x="0" data-offset-y="50" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowAutoColumnSpanning3" data-offset-x="0" data-offset-y="100" data-expected-width="300" data-expected-height="50"></div>
</ins><span class="cx"> <div class="sizedToGridArea autoRowSecondColumn" data-offset-x="100" data-offset-y="50" data-expected-width="100" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea autoRowAutoColumnSpanning2" data-offset-x="0" data-offset-y="150" data-expected-width="200" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea autoRowAutoColumnSpanning2" data-offset-x="0" data-offset-y="200" data-expected-width="200" data-expected-height="50"></div>
</span><span class="lines">@@ -119,10 +146,38 @@
</span><span class="cx"> </div>
</span><span class="cx">
</span><span class="cx"> <div style="position: relative">
</span><ins>+ <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 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 autoRowSpanning2AutoColumnSpanning2" data-offset-x="100" data-offset-y="50" data-expected-width="200" data-expected-height="100"></div>
+ <div class="sizedToGridArea autoRowSpanning3AutoColumn" data-offset-x="0" data-offset-y="100" data-expected-width="100" data-expected-height="150"></div>
+ <div class="sizedToGridArea autoRowSpanning2AutoColumnSpanning2" data-offset-x="100" data-offset-y="150" data-expected-width="200" data-expected-height="100"></div>
+ </div>
+</div>
+
+<div style="position: relative">
</ins><span class="cx"> <div class="grid gridAutoFlowRow gridNamedGridLinesColumns">
</span><span class="cx"> <div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea autoRowAutoColumnSpanning2Line" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea autoRowSecondColumn" data-offset-x="50" data-offset-y="50" data-expected-width="100" data-expected-height="50"></div>
</span><ins>+ <div class="sizedToGridArea autoRowAutoColumnSpanning2Line" data-offset-x="150" data-offset-y="50" data-expected-width="200" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowThirdColumn" data-offset-x="150" data-offset-y="100" data-expected-width="200" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowAutoColumnSpanningLine" data-offset-x="0" data-offset-y="150" data-expected-width="50" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowAutoColumnSpanning2Line" data-offset-x="50" data-offset-y="150" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="200" data-expected-width="50" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowAutoColumnSpanningLine" data-offset-x="50" data-offset-y="200" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowThirdColumn" data-offset-x="150" data-offset-y="200" data-expected-width="200" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowAutoColumnSpanningLine" data-offset-x="0" data-offset-y="250" data-expected-width="50" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowAutoColumnSpanningLine" data-offset-x="50" data-offset-y="250" data-expected-width="100" data-expected-height="50"></div>
+ </div>
+</div>
+
+<div style="position: relative">
+ <div class="grid gridAutoFlowRowDense gridNamedGridLinesColumns">
+ <div class="sizedToGridArea autoRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowAutoColumnSpanning2Line" 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="50" data-expected-width="100" data-expected-height="50"></div>
</ins><span class="cx"> <div class="sizedToGridArea autoRowAutoColumnSpanning2Line" data-offset-x="150" data-offset-y="0" data-expected-width="200" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea autoRowThirdColumn" data-offset-x="150" data-offset-y="50" data-expected-width="200" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea autoRowAutoColumnSpanningLine" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="50"></div>
</span><span class="lines">@@ -152,12 +207,45 @@
</span><span class="cx"> </div>
</span><span class="cx">
</span><span class="cx"> <div style="position: relative">
</span><ins>+ <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 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 autoRowSpanning2AutoColumn" data-offset-x="100" data-offset-y="50" data-expected-width="100" data-expected-height="100"></div>
+ <div class="sizedToGridArea autoRowSpanning3AutoColumn" data-offset-x="200" data-offset-y="0" data-expected-width="100" data-expected-height="150"></div>
+ <div class="sizedToGridArea autoRowSpanning2AutoColumnSpanning2" data-offset-x="300" data-offset-y="0" data-expected-width="200" data-expected-height="100"></div>
+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="300" data-offset-y="100" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="400" data-offset-y="100" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="500" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowSpanning2AutoColumnSpanning2" data-offset-x="500" data-offset-y="50" data-expected-width="200" data-expected-height="100"></div>
+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="600" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
+ </div>
+</div>
+
+<div style="position: relative">
</ins><span class="cx"> <div class="grid gridAutoFlowColumn">
</span><span class="cx"> <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="0" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea secondRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="100" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea thirdRowAutoColumn" data-offset-x="0" data-offset-y="100" data-expected-width="100" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="100" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea autoRowSpanning3AutoColumn" data-offset-x="200" data-offset-y="0" data-expected-width="100" data-expected-height="150"></div>
</span><ins>+ <div class="sizedToGridArea secondRowAutoColumn" data-offset-x="300" data-offset-y="50" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowSpanning2AutoColumn" data-offset-x="400" data-offset-y="0" data-expected-width="100" data-expected-height="100"></div>
+ <div class="sizedToGridArea autoRowSpanning2AutoColumn" data-offset-x="500" data-offset-y="0" data-expected-width="100" data-expected-height="100"></div>
+ <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="600" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowSpanning3AutoColumn" data-offset-x="700" data-offset-y="0" data-expected-width="100" data-expected-height="150"></div>
+ <div class="sizedToGridArea autoRowSpanning2AutoColumn" data-offset-x="800" data-offset-y="0" data-expected-width="100" data-expected-height="100"></div>
+ <div class="sizedToGridArea autoRowSpanning2AutoColumnSpanning2" data-offset-x="900" data-offset-y="0" data-expected-width="200" data-expected-height="100"></div>
+ </div>
+</div>
+
+<div style="position: relative">
+ <div class="grid gridAutoFlowColumnDense">
+ <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="0" 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="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 firstRowAutoColumn" data-offset-x="100" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowSpanning3AutoColumn" data-offset-x="200" data-offset-y="0" data-expected-width="100" data-expected-height="150"></div>
</ins><span class="cx"> <div class="sizedToGridArea secondRowAutoColumn" data-offset-x="100" data-offset-y="50" data-expected-width="100" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea autoRowSpanning2AutoColumn" data-offset-x="300" data-offset-y="0" data-expected-width="100" data-expected-height="100"></div>
</span><span class="cx"> <div class="sizedToGridArea autoRowSpanning2AutoColumn" data-offset-x="400" data-offset-y="0" data-expected-width="100" data-expected-height="100"></div>
</span><span class="lines">@@ -180,10 +268,38 @@
</span><span class="cx"> </div>
</span><span class="cx">
</span><span class="cx"> <div style="position: relative">
</span><ins>+ <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 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 autoRowSpanning2AutoColumnSpanning2" data-offset-x="100" data-offset-y="50" data-expected-width="200" data-expected-height="100"></div>
+ <div class="sizedToGridArea autoRowAutoColumnSpanning3" data-offset-x="200" data-offset-y="0" data-expected-width="300" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowSpanning2AutoColumnSpanning2" data-offset-x="300" data-offset-y="50" data-expected-width="200" data-expected-height="100"></div>
+ </div>
+</div>
+
+<div style="position: relative">
</ins><span class="cx"> <div class="grid gridAutoFlowColumn gridNamedGridLinesRows">
</span><span class="cx"> <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="0" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea autoRowSpanning2LineAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="100" data-expected-height="100"></div>
</span><span class="cx"> <div class="sizedToGridArea secondRowAutoColumn" data-offset-x="100" data-offset-y="50" data-expected-width="100" data-expected-height="100"></div>
</span><ins>+ <div class="sizedToGridArea autoRowSpanning2LineAutoColumn" data-offset-x="100" data-offset-y="150" data-expected-width="100" data-expected-height="200"></div>
+ <div class="sizedToGridArea thirdRowAutoColumn" data-offset-x="200" data-offset-y="150" data-expected-width="100" data-expected-height="200"></div>
+ <div class="sizedToGridArea autoRowSpanningLineAutoColumn" data-offset-x="300" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowSpanning2LineAutoColumn" data-offset-x="300" data-offset-y="50" data-expected-width="100" data-expected-height="100"></div>
+ <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="400" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowSpanningLineAutoColumn" data-offset-x="400" data-offset-y="50" data-expected-width="100" data-expected-height="100"></div>
+ <div class="sizedToGridArea thirdRowAutoColumn" data-offset-x="400" data-offset-y="150" data-expected-width="100" data-expected-height="200"></div>
+ <div class="sizedToGridArea autoRowSpanningLineAutoColumn" data-offset-x="500" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowSpanningLineAutoColumn" data-offset-x="500" data-offset-y="50" data-expected-width="100" data-expected-height="100"></div-->
+ </div>
+</div>
+
+<div style="position: relative">
+ <div class="grid gridAutoFlowColumnDense gridNamedGridLinesRows">
+ <div class="sizedToGridArea firstRowAutoColumn" data-offset-x="0" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
+ <div class="sizedToGridArea autoRowSpanning2LineAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="100" data-expected-height="100"></div>
+ <div class="sizedToGridArea secondRowAutoColumn" data-offset-x="100" data-offset-y="50" data-expected-width="100" data-expected-height="100"></div>
</ins><span class="cx"> <div class="sizedToGridArea autoRowSpanning2LineAutoColumn" data-offset-x="0" data-offset-y="150" data-expected-width="100" data-expected-height="200"></div>
</span><span class="cx"> <div class="sizedToGridArea thirdRowAutoColumn" data-offset-x="100" data-offset-y="150" data-expected-width="100" data-expected-height="200"></div>
</span><span class="cx"> <div class="sizedToGridArea autoRowSpanningLineAutoColumn" data-offset-x="100" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
</span></span></pre></div>
<a id="trunkLayoutTestsfastcssgridlayoutgriditemautoplacementdefinitespanexpectedtxt"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/css-grid-layout/grid-item-auto-placement-definite-span-expected.txt (171081 => 171082)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css-grid-layout/grid-item-auto-placement-definite-span-expected.txt 2014-07-14 21:22:10 UTC (rev 171081)
+++ trunk/LayoutTests/fast/css-grid-layout/grid-item-auto-placement-definite-span-expected.txt 2014-07-14 21:23:49 UTC (rev 171082)
</span><span class="lines">@@ -4,3 +4,7 @@
</span><span class="cx"> PASS
</span><span class="cx"> PASS
</span><span class="cx"> PASS
</span><ins>+PASS
+PASS
+PASS
+PASS
</ins></span></pre></div>
<a id="trunkLayoutTestsfastcssgridlayoutgriditemautoplacementdefinitespanhtml"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/css-grid-layout/grid-item-auto-placement-definite-span.html (171081 => 171082)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css-grid-layout/grid-item-auto-placement-definite-span.html 2014-07-14 21:22:10 UTC (rev 171081)
+++ trunk/LayoutTests/fast/css-grid-layout/grid-item-auto-placement-definite-span.html 2014-07-14 21:23:49 UTC (rev 171082)
</span><span class="lines">@@ -56,6 +56,15 @@
</span><span class="cx"> <div class="sizedToGridArea autoRowFirstColumnSpanning2" data-offset-x="0" data-offset-y="0" data-expected-width="200" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea autoRowSecondColumnSpanning2" data-offset-x="100" data-offset-y="50" data-expected-width="200" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea autoRowFirstColumnSpanning3" data-offset-x="0" data-offset-y="100" data-expected-width="300" data-expected-height="50"></div>
</span><ins>+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="0" data-offset-y="150" data-expected-width="100" data-expected-height="50"></div>
+ </div>
+</div>
+
+<div style="position: relative">
+ <div class="grid gridAutoFlowRowDense">
+ <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 autoRowFirstColumnSpanning3" data-offset-x="0" data-offset-y="100" data-expected-width="300" data-expected-height="50"></div>
</ins><span class="cx"> <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="200" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="0" data-offset-y="50" data-expected-width="100" data-expected-height="50"></div>
</span><span class="cx"> </div>
</span><span class="lines">@@ -72,10 +81,29 @@
</span><span class="cx"> </div>
</span><span class="cx">
</span><span class="cx"> <div style="position: relative">
</span><ins>+ <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 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 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="0" data-offset-y="100" data-expected-width="100" data-expected-height="50"></div>
+ </div>
+</div>
+
+<div style="position: relative">
</ins><span class="cx"> <div class="grid gridAutoFlowColumn">
</span><span class="cx"> <div class="sizedToGridArea firstRowSpanning2AutoColumn" data-offset-x="0" data-offset-y="0" data-expected-width="100" data-expected-height="100"></div>
</span><span class="cx"> <div class="sizedToGridArea secondRowSpanning2AutoColumn" data-offset-x="100" data-offset-y="50" data-expected-width="100" data-expected-height="100"></div>
</span><span class="cx"> <div class="sizedToGridArea firstRowSpanning3AutoColumn" data-offset-x="200" data-offset-y="0" data-expected-width="100" data-expected-height="150"></div>
</span><ins>+ <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="300" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
+ </div>
+</div>
+
+<div style="position: relative">
+ <div class="grid gridAutoFlowColumnDense">
+ <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 firstRowSpanning3AutoColumn" data-offset-x="200" data-offset-y="0" data-expected-width="100" data-expected-height="150"></div>
</ins><span class="cx"> <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="0" data-offset-y="100" data-expected-width="100" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea autoRowAutoColumn" data-offset-x="100" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
</span><span class="cx"> </div>
</span><span class="lines">@@ -91,5 +119,15 @@
</span><span class="cx"> </div>
</span><span class="cx"> </div>
</span><span class="cx">
</span><ins>+<div style="position: relative">
+ <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 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 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="200" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
+ </div>
+</div>
+
</ins><span class="cx"> </body>
</span><span class="cx"> </html>
</span></span></pre></div>
<a id="trunkLayoutTestsfastcssgridlayoutgriditemremovalautoplacementupdatehtml"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/css-grid-layout/grid-item-removal-auto-placement-update.html (171081 => 171082)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css-grid-layout/grid-item-removal-auto-placement-update.html 2014-07-14 21:22:10 UTC (rev 171081)
+++ trunk/LayoutTests/fast/css-grid-layout/grid-item-removal-auto-placement-update.html 2014-07-14 21:23:49 UTC (rev 171082)
</span><span class="lines">@@ -76,7 +76,7 @@
</span><span class="cx"> </div>
</span><span class="cx">
</span><span class="cx"> <div class="unconstrainedContainer">
</span><del>- <div class="grid gridAutoFlowColumn" id="gridAutoFlowColumnWithAutoItems">
</del><ins>+ <div class="grid gridAutoFlowColumnDense" id="gridAutoFlowColumnWithAutoItems">
</ins><span class="cx"> <div class="sizedToGridArea autoRowFirstColumn">XXXXX XXXXX XXXXX</div>
</span><span class="cx"> <div class="sizedToGridArea autoRowSecondColumn">XXXXX XXXXX XXXXX</div>
</span><span class="cx"> <div class="sizedToGridArea secondRowAutoColumn">XXXXX XXXXX XXXXX</div>
</span><span class="lines">@@ -86,7 +86,7 @@
</span><span class="cx"> </div>
</span><span class="cx">
</span><span class="cx"> <div class="unconstrainedContainer">
</span><del>- <div class="grid gridAutoFlowRow" id="gridAutoFlowRowWithAutoAndFixedItems">
</del><ins>+ <div class="grid gridAutoFlowRowDense" id="gridAutoFlowRowWithAutoAndFixedItems">
</ins><span class="cx"> <div class="sizedToGridArea autoRowFirstColumn">XXXXX XXXXX XXXXX</div>
</span><span class="cx"> <div class="sizedToGridArea firstRowSecondColumn">XXXXX XXXXX XXXXX</div>
</span><span class="cx"> <div class="sizedToGridArea secondRowAutoColumn">XXXXX XXXXX XXXXX</div>
</span></span></pre></div>
<a id="trunkLayoutTestsfastcssgridlayoutnamedgridlineswithnamedgridareasresolutionhtml"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/css-grid-layout/named-grid-lines-with-named-grid-areas-resolution.html (171081 => 171082)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css-grid-layout/named-grid-lines-with-named-grid-areas-resolution.html 2014-07-14 21:22:10 UTC (rev 171081)
+++ trunk/LayoutTests/fast/css-grid-layout/named-grid-lines-with-named-grid-areas-resolution.html 2014-07-14 21:23:49 UTC (rev 171082)
</span><span class="lines">@@ -107,7 +107,7 @@
</span><span class="cx">
</span><span class="cx"> <!-- Check positioning using grid areas -->
</span><span class="cx"> <div style="position: relative">
</span><del>- <div class="grid gridAreas gridNoLineNames">
</del><ins>+ <div class="grid gridAreas gridNoLineNames gridAutoFlowRowDense">
</ins><span class="cx"> <div class="sizedToGridArea" style="-webkit-grid-column: d;" data-offset-x="150" data-offset-y="0" data-expected-width="200" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea" style="-webkit-grid-row: d;" data-offset-x="0" data-offset-y="150" data-expected-width="50" data-expected-height="200"></div>
</span><span class="cx"> <div class="sizedToGridArea" style="-webkit-grid-column: c;" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50"></div>
</span><span class="lines">@@ -125,7 +125,7 @@
</span><span class="cx">
</span><span class="cx"> <!-- Use grid area's implicit line names if defined before explicitly named grid lines -->
</span><span class="cx"> <div style="position: relative">
</span><del>- <div class="grid gridAreas gridWithNamedLineAfterGridArea">
</del><ins>+ <div class="grid gridAreas gridWithNamedLineAfterGridArea gridAutoFlowRowDense">
</ins><span class="cx"> <div class="sizedToGridArea" style="-webkit-grid-column: d;" data-offset-x="150" data-offset-y="0" data-expected-width="200" data-expected-height="50"></div>
</span><span class="cx"> <div class="sizedToGridArea" style="-webkit-grid-row: d;" data-offset-x="0" data-offset-y="150" data-expected-width="50" data-expected-height="200"></div>
</span><span class="cx"> <div class="sizedToGridArea" style="-webkit-grid-column: c;" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="50"></div>
</span></span></pre></div>
<a id="trunkLayoutTestsfastcssgridlayoutresourcesgridcss"></a>
<div class="modfile"><h4>Modified: trunk/LayoutTests/fast/css-grid-layout/resources/grid.css (171081 => 171082)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/fast/css-grid-layout/resources/grid.css 2014-07-14 21:22:10 UTC (rev 171081)
+++ trunk/LayoutTests/fast/css-grid-layout/resources/grid.css 2014-07-14 21:23:49 UTC (rev 171082)
</span><span class="lines">@@ -122,6 +122,30 @@
</span><span class="cx"> -webkit-grid-row: auto;
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+.autoRowAutoColumnSpanning2 {
+ background-color: maroon;
+ -webkit-grid-column: span 2;
+ -webkit-grid-row: auto;
+}
+
+.autoRowSpanning2AutoColumn {
+ background-color: aqua;
+ -webkit-grid-column: auto;
+ -webkit-grid-row: span 2;
+}
+
+.autoRowSpanning2AutoColumnSpanning3 {
+ background-color: olive;
+ -webkit-grid-column: span 3;
+ -webkit-grid-row: span 2;
+}
+
+.autoRowSpanning3AutoColumnSpanning2 {
+ background-color: indigo;
+ -webkit-grid-column: span 2;
+ -webkit-grid-row: span 3;
+}
+
</ins><span class="cx"> /* Grid element flow. */
</span><span class="cx"> .gridAutoFlowStack {
</span><span class="cx"> -webkit-grid-auto-flow: stack;
</span><span class="lines">@@ -131,10 +155,18 @@
</span><span class="cx"> -webkit-grid-auto-flow: column;
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+.gridAutoFlowColumnDense {
+ -webkit-grid-auto-flow: column dense;
+}
+
</ins><span class="cx"> .gridAutoFlowRow {
</span><span class="cx"> -webkit-grid-auto-flow: row;
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+.gridAutoFlowRowDense {
+ -webkit-grid-auto-flow: row dense;
+}
+
</ins><span class="cx"> /* This rule makes sure the container is smaller than any grid items to avoid distributing any extra logical space to them. */
</span><span class="cx"> .constrainedContainer {
</span><span class="cx"> width: 10px;
</span></span></pre></div>
<a id="trunkSourceWebCoreChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/ChangeLog (171081 => 171082)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/ChangeLog 2014-07-14 21:22:10 UTC (rev 171081)
+++ trunk/Source/WebCore/ChangeLog 2014-07-14 21:23:49 UTC (rev 171082)
</span><span class="lines">@@ -1,3 +1,35 @@
</span><ins>+2014-07-14 Manuel Rego Casasnovas <rego@igalia.com>
+
+ [CSS Grid Layout] Support sparse in auto-placement algorithm
+ https://bugs.webkit.org/show_bug.cgi?id=134544
+
+ Reviewed by Sergio Villar Senin.
+
+ This patch implements sparse mode for auto-placement algorithm, which is
+ the default mode in the new grid-auto-flow syntax. It keeps track of the
+ auto-placement cursor in
+ RenderGrid::placeAutoMajorAxisItemsOnGrid() and updates it accordingly
+ when auto-positioned items are placed.
+ If we're in dense mode it resets the cursor after each item (which keeps
+ the old behavior that was using dense mode by default).
+
+ GridIterator has been adapted to look for empty areas from a given
+ position in both directions.
+
+ Test: fast/css-grid-layout/grid-auto-flow-sparse.html
+
+ * rendering/RenderGrid.cpp:
+ (WebCore::RenderGrid::GridIterator::GridIterator): Modify constructor to
+ add an optional argument for the varying index. This allows to look for
+ empty areas in both axis.
+ (WebCore::RenderGrid::placeAutoMajorAxisItemsOnGrid): Defined the
+ auto-placement cursor and rested after each item if we're in dense mode.
+ (WebCore::RenderGrid::placeAutoMajorAxisItemOnGrid): Use auto-placement
+ cursor to look for empty areas from the last auto-positioned item
+ placed.
+ * rendering/RenderGrid.h: Modify placeAutoMajorAxisItemOnGrid() header
+ to receive the auto-placement cursor.
+
</ins><span class="cx"> 2014-07-14 Brent Fulgham <bfulgham@apple.com>
</span><span class="cx">
</span><span class="cx"> [iOS] Some videos play as inline audio-only content
</span></span></pre></div>
<a id="trunkSourceWebCorerenderingRenderGridcpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/rendering/RenderGrid.cpp (171081 => 171082)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/rendering/RenderGrid.cpp 2014-07-14 21:22:10 UTC (rev 171081)
+++ trunk/Source/WebCore/rendering/RenderGrid.cpp 2014-07-14 21:23:49 UTC (rev 171082)
</span><span class="lines">@@ -89,11 +89,11 @@
</span><span class="cx"> public:
</span><span class="cx"> // |direction| is the direction that is fixed to |fixedTrackIndex| so e.g
</span><span class="cx"> // GridIterator(m_grid, ForColumns, 1) will walk over the rows of the 2nd column.
</span><del>- GridIterator(const Vector<Vector<Vector<RenderBox*, 1>>>& grid, GridTrackSizingDirection direction, size_t fixedTrackIndex)
</del><ins>+ GridIterator(const Vector<Vector<Vector<RenderBox*, 1>>>& grid, GridTrackSizingDirection direction, size_t fixedTrackIndex, size_t varyingTrackIndex = 0)
</ins><span class="cx"> : m_grid(grid)
</span><span class="cx"> , m_direction(direction)
</span><del>- , m_rowIndex((direction == ForColumns) ? 0 : fixedTrackIndex)
- , m_columnIndex((direction == ForColumns) ? fixedTrackIndex : 0)
</del><ins>+ , m_rowIndex((direction == ForColumns) ? varyingTrackIndex : fixedTrackIndex)
+ , m_columnIndex((direction == ForColumns) ? fixedTrackIndex : varyingTrackIndex)
</ins><span class="cx"> , m_childIndex(0)
</span><span class="cx"> {
</span><span class="cx"> ASSERT(m_rowIndex < m_grid.size());
</span><span class="lines">@@ -756,27 +756,48 @@
</span><span class="cx">
</span><span class="cx"> void RenderGrid::placeAutoMajorAxisItemsOnGrid(const Vector<RenderBox*>& autoGridItems)
</span><span class="cx"> {
</span><del>- for (auto& autoGridItem : autoGridItems)
- placeAutoMajorAxisItemOnGrid(autoGridItem);
</del><ins>+ AutoPlacementCursor autoPlacementCursor = {0, 0};
+ bool isGridAutoFlowDense = style().isGridAutoFlowAlgorithmDense();
+
+ for (auto& autoGridItem : autoGridItems) {
+ placeAutoMajorAxisItemOnGrid(autoGridItem, autoPlacementCursor);
+
+ if (isGridAutoFlowDense) {
+ autoPlacementCursor.first = 0;
+ autoPlacementCursor.second = 0;
+ }
+ }
</ins><span class="cx"> }
</span><span class="cx">
</span><del>-void RenderGrid::placeAutoMajorAxisItemOnGrid(RenderBox* gridItem)
</del><ins>+void RenderGrid::placeAutoMajorAxisItemOnGrid(RenderBox* gridItem,
+AutoPlacementCursor& autoPlacementCursor)
</ins><span class="cx"> {
</span><span class="cx"> std::unique_ptr<GridSpan> minorAxisPositions = GridResolvedPosition::resolveGridPositionsFromStyle(style(), *gridItem, autoPlacementMinorAxisDirection());
</span><span class="cx"> ASSERT(!GridResolvedPosition::resolveGridPositionsFromStyle(style(), *gridItem, autoPlacementMajorAxisDirection()));
</span><span class="cx"> GridSpan majorAxisPositions = GridResolvedPosition::resolveGridPositionsFromAutoPlacementPosition(style(), *gridItem, autoPlacementMajorAxisDirection(), GridResolvedPosition(0));
</span><ins>+
+ const size_t endOfMajorAxis = (autoPlacementMajorAxisDirection() == ForColumns) ? gridColumnCount() : gridRowCount();
+ size_t majorAxisAutoPlacementCursor = autoPlacementMajorAxisDirection() == ForColumns ? autoPlacementCursor.second : autoPlacementCursor.first;
+ size_t minorAxisAutoPlacementCursor = autoPlacementMajorAxisDirection() == ForColumns ? autoPlacementCursor.first : autoPlacementCursor.second;
+
</ins><span class="cx"> std::unique_ptr<GridCoordinate> emptyGridArea;
</span><span class="cx"> if (minorAxisPositions) {
</span><del>- GridIterator iterator(m_grid, autoPlacementMinorAxisDirection(), minorAxisPositions->resolvedInitialPosition.toInt());
- emptyGridArea = iterator.nextEmptyGridArea(minorAxisPositions->integerSpan(), majorAxisPositions.integerSpan());
</del><ins>+ // Move to the next track in major axis if initial position in minor axis is before auto-placement cursor.
+ if (minorAxisPositions->resolvedInitialPosition.toInt() < minorAxisAutoPlacementCursor)
+ majorAxisAutoPlacementCursor++;
+
+ if (majorAxisAutoPlacementCursor < endOfMajorAxis) {
+ GridIterator iterator(m_grid, autoPlacementMinorAxisDirection(), minorAxisPositions->resolvedInitialPosition.toInt(), majorAxisAutoPlacementCursor);
+ emptyGridArea = iterator.nextEmptyGridArea(minorAxisPositions->integerSpan(), majorAxisPositions.integerSpan());
+ }
+
</ins><span class="cx"> if (!emptyGridArea)
</span><span class="cx"> emptyGridArea = createEmptyGridAreaAtSpecifiedPositionsOutsideGrid(gridItem, autoPlacementMinorAxisDirection(), *minorAxisPositions);
</span><span class="cx"> } else {
</span><span class="cx"> GridSpan minorAxisPositions = GridResolvedPosition::resolveGridPositionsFromAutoPlacementPosition(style(), *gridItem, autoPlacementMinorAxisDirection(), GridResolvedPosition(0));
</span><span class="cx">
</span><del>- const size_t endOfMajorAxis = (autoPlacementMajorAxisDirection() == ForColumns) ? gridColumnCount() : gridRowCount();
- for (size_t majorAxisIndex = 0; majorAxisIndex < endOfMajorAxis; ++majorAxisIndex) {
- GridIterator iterator(m_grid, autoPlacementMajorAxisDirection(), majorAxisIndex);
</del><ins>+ for (size_t majorAxisIndex = majorAxisAutoPlacementCursor; majorAxisIndex < endOfMajorAxis; ++majorAxisIndex) {
+ GridIterator iterator(m_grid, autoPlacementMajorAxisDirection(), majorAxisIndex, minorAxisAutoPlacementCursor);
</ins><span class="cx"> emptyGridArea = iterator.nextEmptyGridArea(majorAxisPositions.integerSpan(), minorAxisPositions.integerSpan());
</span><span class="cx">
</span><span class="cx"> if (emptyGridArea) {
</span><span class="lines">@@ -790,6 +811,9 @@
</span><span class="cx"> // We don't need to create a new empty grid area yet as we might find a valid one in the next iteration.
</span><span class="cx"> emptyGridArea = nullptr;
</span><span class="cx"> }
</span><ins>+
+ // As we're moving to the next track in the major axis we should reset the auto-placement cursor in the minor axis.
+ minorAxisAutoPlacementCursor = 0;
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> if (!emptyGridArea)
</span><span class="lines">@@ -797,6 +821,8 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> insertItemIntoGrid(gridItem, *emptyGridArea);
</span><ins>+ autoPlacementCursor.first = emptyGridArea->rows.resolvedInitialPosition.toInt();
+ autoPlacementCursor.second = emptyGridArea->columns.resolvedInitialPosition.toInt();
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> GridTrackSizingDirection RenderGrid::autoPlacementMajorAxisDirection() const
</span></span></pre></div>
<a id="trunkSourceWebCorerenderingRenderGridh"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/rendering/RenderGrid.h (171081 => 171082)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/rendering/RenderGrid.h 2014-07-14 21:22:10 UTC (rev 171081)
+++ trunk/Source/WebCore/rendering/RenderGrid.h 2014-07-14 21:23:49 UTC (rev 171082)
</span><span class="lines">@@ -77,7 +77,8 @@
</span><span class="cx"> std::unique_ptr<GridCoordinate> createEmptyGridAreaAtSpecifiedPositionsOutsideGrid(const RenderBox*, GridTrackSizingDirection, const GridSpan&) const;
</span><span class="cx"> void placeSpecifiedMajorAxisItemsOnGrid(const Vector<RenderBox*>&);
</span><span class="cx"> void placeAutoMajorAxisItemsOnGrid(const Vector<RenderBox*>&);
</span><del>- void placeAutoMajorAxisItemOnGrid(RenderBox*);
</del><ins>+ typedef std::pair<size_t, size_t> AutoPlacementCursor;
+ void placeAutoMajorAxisItemOnGrid(RenderBox*, AutoPlacementCursor&);
</ins><span class="cx"> GridTrackSizingDirection autoPlacementMajorAxisDirection() const;
</span><span class="cx"> GridTrackSizingDirection autoPlacementMinorAxisDirection() const;
</span><span class="cx">
</span></span></pre>
</div>
</div>
</body>
</html>