Diff
Modified: trunk/LayoutTests/ChangeLog (154752 => 154753)
--- trunk/LayoutTests/ChangeLog 2013-08-28 16:44:27 UTC (rev 154752)
+++ trunk/LayoutTests/ChangeLog 2013-08-28 16:48:53 UTC (rev 154753)
@@ -1,3 +1,20 @@
+2013-08-28 Sergio Villar Senin <[email protected]>
+
+ [CSS Grid Layout] Handle 'span' positions during layout
+ https://bugs.webkit.org/show_bug.cgi?id=119756
+
+ Reviewed by Andreas Kling.
+
+ From Blink r149133 by <[email protected]>
+
+ Added some new test cases to verify that we properly resolve
+ 'span' positions.
+
+ * fast/css-grid-layout/grid-item-negative-position-resolution-expected.txt:
+ * fast/css-grid-layout/grid-item-negative-position-resolution.html:
+ * fast/css-grid-layout/grid-item-spanning-resolution-expected.txt:
+ * fast/css-grid-layout/grid-item-spanning-resolution.html:
+
2013-08-28 Ádám Kallai <[email protected]>
[Qt] Delete unnecessary empty directories.
Modified: trunk/LayoutTests/fast/css-grid-layout/grid-item-negative-position-resolution-expected.txt (154752 => 154753)
--- trunk/LayoutTests/fast/css-grid-layout/grid-item-negative-position-resolution-expected.txt 2013-08-28 16:44:27 UTC (rev 154752)
+++ trunk/LayoutTests/fast/css-grid-layout/grid-item-negative-position-resolution-expected.txt 2013-08-28 16:48:53 UTC (rev 154753)
@@ -4,3 +4,7 @@
PASS
PASS
PASS
+PASS
+PASS
+PASS
+PASS
Modified: trunk/LayoutTests/fast/css-grid-layout/grid-item-negative-position-resolution.html (154752 => 154753)
--- trunk/LayoutTests/fast/css-grid-layout/grid-item-negative-position-resolution.html 2013-08-28 16:44:27 UTC (rev 154752)
+++ trunk/LayoutTests/fast/css-grid-layout/grid-item-negative-position-resolution.html 2013-08-28 16:48:53 UTC (rev 154753)
@@ -27,6 +27,26 @@
-webkit-grid-row: -1 / auto;
}
+.endSpanGrowGridInColumnDirection {
+ -webkit-grid-column: -2 / span 3;
+ -webkit-grid-row: 1;
+}
+
+.endSpanGrowGridInRowDirection {
+ -webkit-grid-column: 1;
+ -webkit-grid-row: -2 / span 3;
+}
+
+.negativeEndPositionStartSpanInColumnDirection {
+ -webkit-grid-column: span / -1;
+ -webkit-grid-row: 1;
+}
+
+.negativeEndPositionStartSpanInRowDirection {
+ -webkit-grid-column: 1;
+ -webkit-grid-row: span 5 / -1;
+}
+
.negativeEndPositionStartNegativeInColumnDirection {
-webkit-grid-column: -3 / -1;
-webkit-grid-row: 1;
@@ -55,7 +75,31 @@
</div>
<div style="position: relative">
+<div class="grid" data-expected-width="550" data-expected-height="150">
+ <div class="sizedToGridArea endSpanGrowGridInColumnDirection" data-offset-x="50" data-offset-y="0" data-expected-width="500" data-expected-height="50"></div>
+</div>
+</div>
+
+<div style="position: relative">
+<div class="grid" data-expected-width="150" data-expected-height="550">
+ <div class="sizedToGridArea endSpanGrowGridInRowDirection" data-offset-x="0" data-offset-y="50" data-expected-width="50" data-expected-height="500"></div>
+</div>
+</div>
+
+<div style="position: relative">
<div class="grid" data-expected-width="150" data-expected-height="150">
+ <div class="sizedToGridArea negativeEndPositionStartSpanInColumnDirection" data-offset-x="50" data-offset-y="0" data-expected-width="100" data-expected-height="50"></div>
+</div>
+</div>
+
+<div style="position: relative">
+<div class="grid" data-expected-width="150" data-expected-height="150">
+ <div class="sizedToGridArea negativeEndPositionStartSpanInRowDirection" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="150"></div>
+</div>
+</div>
+
+<div style="position: relative">
+<div class="grid" data-expected-width="150" data-expected-height="150">
<div class="sizedToGridArea negativeEndPositionStartNegativeInColumnDirection" data-offset-x="0" data-offset-y="0" data-expected-width="150" data-expected-height="50"></div>
</div>
</div>
Modified: trunk/LayoutTests/fast/css-grid-layout/grid-item-spanning-resolution-expected.txt (154752 => 154753)
--- trunk/LayoutTests/fast/css-grid-layout/grid-item-spanning-resolution-expected.txt 2013-08-28 16:44:27 UTC (rev 154752)
+++ trunk/LayoutTests/fast/css-grid-layout/grid-item-spanning-resolution-expected.txt 2013-08-28 16:48:53 UTC (rev 154753)
@@ -12,3 +12,8 @@
PASS
PASS
PASS
+PASS
+PASS
+PASS
+PASS
+PASS
Modified: trunk/LayoutTests/fast/css-grid-layout/grid-item-spanning-resolution.html (154752 => 154753)
--- trunk/LayoutTests/fast/css-grid-layout/grid-item-spanning-resolution.html 2013-08-28 16:44:27 UTC (rev 154752)
+++ trunk/LayoutTests/fast/css-grid-layout/grid-item-spanning-resolution.html 2013-08-28 16:48:53 UTC (rev 154753)
@@ -49,6 +49,31 @@
-webkit-grid-column: 3 / 4;
-webkit-grid-row: 3 / 4;
}
+
+.firstRowSpanning3SecondColumn {
+ -webkit-grid-column: 2;
+ -webkit-grid-row: 1 / span 3;
+}
+
+.thirdRowSecondColumnSpanning2 {
+ -webkit-grid-column: 2 / span 2;
+ -webkit-grid-row: 3;
+}
+
+.spanning3Row5SecondColumn {
+ -webkit-grid-column: 2;
+ -webkit-grid-row: span 3 / 5;
+}
+
+.thirdRowSpanning2Column3 {
+ -webkit-grid-column: span 2 / 3;
+ -webkit-grid-row: 3;
+}
+
+.underflowSpanning {
+ -webkit-grid-column: span 3 / 3;
+ -webkit-grid-row: span 8 / 4;
+}
</style>
<script src=""
<body _onload_="checkLayout('.grid');">
@@ -126,5 +151,33 @@
<div class="sizedToGridArea secondRowSecondColumnNoSpan" data-offset-x="50" data-offset-y="25" data-expected-width="50" data-expected-height="25"></div>
<div class="sizedToGridArea thirdRowThirdColumnNoSpan" data-offset-x="100" data-offset-y="50" data-expected-width="50" data-expected-height="25"></div>
</div>
+
+<div style="position: relative">
+<div class="grid" id="bigGrid" data-expected-width="200" data-expected-height="100">
+ <div class="sizedToGridArea firstRowSpanning3SecondColumn" data-offset-x="50" data-offset-y="0" data-expected-width="50" data-expected-height="75"></div>
+</div>
+</div>
+
+<div style="position: relative">
+<div class="grid" id="bigGrid" data-expected-width="200" data-expected-height="100">
+ <div class="sizedToGridArea thirdRowSecondColumnSpanning2" data-offset-x="50" data-offset-y="50" data-expected-width="100" data-expected-height="25"></div>
+</div>
+
+<div style="position: relative">
+<div class="grid" id="bigGrid" data-expected-width="200" data-expected-height="100">
+ <div class="sizedToGridArea spanning3Row5SecondColumn" data-offset-x="50" data-offset-y="25" data-expected-width="50" data-expected-height="75"></div>
+</div>
+</div>
+
+<div style="position: relative">
+<div class="grid" id="bigGrid" data-expected-width="200" data-expected-height="100">
+ <div class="sizedToGridArea thirdRowSpanning2Column3" data-offset-x="0" data-offset-y="50" data-expected-width="100" data-expected-height="25"></div>
+</div>
+
+<div style="position: relative">
+<div class="grid" id="bigGrid" data-expected-width="200" data-expected-height="100">
+ <div class="sizedToGridArea underflowSpanning" data-offset-x="0" data-offset-y="0" data-expected-width="100" data-expected-height="75"></div>
+</div>
+
</body>
</html>
Modified: trunk/Source/WebCore/ChangeLog (154752 => 154753)
--- trunk/Source/WebCore/ChangeLog 2013-08-28 16:44:27 UTC (rev 154752)
+++ trunk/Source/WebCore/ChangeLog 2013-08-28 16:48:53 UTC (rev 154753)
@@ -1,3 +1,23 @@
+2013-08-28 Sergio Villar Senin <[email protected]>
+
+ [CSS Grid Layout] Handle 'span' positions during layout
+ https://bugs.webkit.org/show_bug.cgi?id=119756
+
+ Reviewed by Andreas Kling.
+
+ From Blink r149133 by <[email protected]>
+
+ Properly handle the 'span' keyword during layout. We only had
+ parsing support so far but with this change we are able to
+ recognize these positions and act accordingly.
+
+ * rendering/RenderGrid.cpp:
+ (WebCore::RenderGrid::resolveGridPositionsFromStyle):
+ (WebCore::RenderGrid::resolveGridPositionAgainstOppositePosition):
+ * rendering/RenderGrid.h:
+ * rendering/style/GridPosition.h:
+ (WebCore::GridPosition::shouldBeResolvedAgainstOppositePosition):
+
2013-08-28 Antti Koivisto <[email protected]>
Factor descendant iterator assertions into a class.
Modified: trunk/Source/WebCore/rendering/RenderGrid.cpp (154752 => 154753)
--- trunk/Source/WebCore/rendering/RenderGrid.cpp 2013-08-28 16:44:27 UTC (rev 154752)
+++ trunk/Source/WebCore/rendering/RenderGrid.cpp 2013-08-28 16:48:53 UTC (rev 154753)
@@ -720,6 +720,9 @@
const GridPosition& finalPosition = (direction == ForColumns) ? gridItem->style()->gridItemColumnEnd() : gridItem->style()->gridItemRowEnd();
const GridPositionSide finalPositionSide = (direction == ForColumns) ? ColumnEndSide : RowEndSide;
+ // We should NEVER see both spans as they should have been handled during style resolve.
+ ASSERT(!initialPosition.isSpan() || !finalPosition.isSpan());
+
if (initialPosition.isAuto() && finalPosition.isAuto()) {
if (style()->gridAutoFlow() == AutoFlowNone)
return adoptPtr(new GridSpan(0, 0));
@@ -728,16 +731,16 @@
return nullptr;
}
- if (initialPosition.isAuto()) {
- // Infer the position from the final position ('auto / 1' case).
+ if (initialPosition.shouldBeResolvedAgainstOppositePosition()) {
+ // Infer the position from the final position ('auto / 1' or 'span 2 / 3' case).
const size_t finalResolvedPosition = resolveGridPositionFromStyle(finalPosition, finalPositionSide);
- return adoptPtr(new GridSpan(finalResolvedPosition, finalResolvedPosition));
+ return resolveGridPositionAgainstOppositePosition(finalResolvedPosition, initialPosition, initialPositionSide);
}
- if (finalPosition.isAuto()) {
- // Infer our position from the initial position ('1 / auto' case).
+ if (finalPosition.shouldBeResolvedAgainstOppositePosition()) {
+ // Infer our position from the initial position ('1 / auto' or '3 / span 2' case).
const size_t initialResolvedPosition = resolveGridPositionFromStyle(initialPosition, initialPositionSide);
- return adoptPtr(new GridSpan(initialResolvedPosition, initialResolvedPosition));
+ return resolveGridPositionAgainstOppositePosition(initialResolvedPosition, finalPosition, finalPositionSide);
}
size_t resolvedInitialPosition = resolveGridPositionFromStyle(initialPosition, initialPositionSide);
@@ -790,6 +793,25 @@
return 0;
}
+PassOwnPtr<RenderGrid::GridSpan> RenderGrid::resolveGridPositionAgainstOppositePosition(size_t resolvedOppositePosition, const GridPosition& position, GridPositionSide side) const
+{
+ if (position.isAuto())
+ return GridSpan::create(resolvedOppositePosition, resolvedOppositePosition);
+
+ ASSERT(position.isSpan());
+ ASSERT(position.spanPosition() > 0);
+
+ // 'span 1' is contained inside a single grid track regardless of the direction.
+ // That's why the CSS span value is one more than the offset we apply.
+ size_t positionOffset = position.spanPosition() - 1;
+ if (side == ColumnStartSide || side == RowStartSide) {
+ size_t initialResolvedPosition = std::max<int>(0, resolvedOppositePosition - positionOffset);
+ return GridSpan::create(initialResolvedPosition, resolvedOppositePosition);
+ }
+
+ return GridSpan::create(resolvedOppositePosition, resolvedOppositePosition + positionOffset);
+}
+
LayoutUnit RenderGrid::gridAreaBreadthForChild(const RenderBox* child, TrackSizingDirection direction, const Vector<GridTrack>& tracks) const
{
const GridCoordinate& coordinate = cachedGridCoordinate(child);
Modified: trunk/Source/WebCore/rendering/RenderGrid.h (154752 => 154753)
--- trunk/Source/WebCore/rendering/RenderGrid.h 2013-08-28 16:44:27 UTC (rev 154752)
+++ trunk/Source/WebCore/rendering/RenderGrid.h 2013-08-28 16:48:53 UTC (rev 154753)
@@ -59,6 +59,11 @@
LayoutUnit computePreferredTrackWidth(const Length&, size_t) const;
struct GridSpan {
+ static PassOwnPtr<GridSpan> create(size_t initialPosition, size_t finalPosition)
+ {
+ return adoptPtr(new GridSpan(initialPosition, finalPosition));
+ }
+
GridSpan(size_t initialPosition, size_t finalPosition)
: initialPositionIndex(initialPosition)
, finalPositionIndex(finalPosition)
@@ -130,6 +135,7 @@
GridSpan resolveGridPositionsFromAutoPlacementPosition(const RenderBox*, TrackSizingDirection, size_t) const;
PassOwnPtr<GridSpan> resolveGridPositionsFromStyle(const RenderBox*, TrackSizingDirection) const;
size_t resolveGridPositionFromStyle(const GridPosition&, GridPositionSide) const;
+ PassOwnPtr<GridSpan> resolveGridPositionAgainstOppositePosition(size_t resolvedOppositePosition, const GridPosition&, GridPositionSide) const;
LayoutUnit gridAreaBreadthForChild(const RenderBox* child, TrackSizingDirection, const Vector<GridTrack>&) const;
Modified: trunk/Source/WebCore/rendering/style/GridPosition.h (154752 => 154753)
--- trunk/Source/WebCore/rendering/style/GridPosition.h 2013-08-28 16:44:27 UTC (rev 154752)
+++ trunk/Source/WebCore/rendering/style/GridPosition.h 2013-08-28 16:48:53 UTC (rev 154753)
@@ -86,6 +86,10 @@
return m_type == other.m_type && m_integerPosition == other.m_integerPosition;
}
+ bool shouldBeResolvedAgainstOppositePosition() const
+ {
+ return isAuto() || isSpan();
+ }
private:
GridPositionType m_type;
int m_integerPosition;
