Title: [100324] trunk
- Revision
- 100324
- Author
- o...@chromium.org
- Date
- 2011-11-15 14:25:24 -0800 (Tue, 15 Nov 2011)
Log Message
Overflow and relayout are broken in the new flexboxes
https://bugs.webkit.org/show_bug.cgi?id=71161
Reviewed by David Hyatt.
Source/WebCore:
Tests: css3/flexbox/auto-height-dynamic.html
css3/flexbox/flex-item-child-overflow-expected.html
css3/flexbox/flex-item-child-overflow.html
* rendering/RenderFlexibleBox.cpp:
(WebCore::RenderFlexibleBox::layoutBlock):
-Always set the logical height to 0 to start with to ensure we don't
use the height from the previous layout when we are computing the
intrinsic size of the flexbox.
-Call computeOverflow after computeLogicalHeight so that flex-item's children's
overflow is properly rendered.
(WebCore::RenderFlexibleBox::layoutAndPlaceChildrenInlineDirection):
-Now that we setLogicalHeight in layoutBlock, we no longer need to do it here.
-Refactor flipping code. The behavior is the same, but the variable names are just
more correct.
LayoutTests:
* css3/flexbox/auto-height-dynamic-expected.txt: Added.
* css3/flexbox/auto-height-dynamic.html: Added.
* css3/flexbox/flex-item-child-overflow-expected.html: Added.
* css3/flexbox/flex-item-child-overflow.html: Added.
Modified Paths
Added Paths
Diff
Modified: trunk/LayoutTests/ChangeLog (100323 => 100324)
--- trunk/LayoutTests/ChangeLog 2011-11-15 22:23:59 UTC (rev 100323)
+++ trunk/LayoutTests/ChangeLog 2011-11-15 22:25:24 UTC (rev 100324)
@@ -1,3 +1,15 @@
+2011-10-28 Ojan Vafai <o...@chromium.org>
+
+ Overflow and relayout are broken in the new flexboxes
+ https://bugs.webkit.org/show_bug.cgi?id=71161
+
+ Reviewed by David Hyatt.
+
+ * css3/flexbox/auto-height-dynamic-expected.txt: Added.
+ * css3/flexbox/auto-height-dynamic.html: Added.
+ * css3/flexbox/flex-item-child-overflow-expected.html: Added.
+ * css3/flexbox/flex-item-child-overflow.html: Added.
+
2011-11-15 Peter Kasting <pkast...@google.com>
Fix expectations after r100276.
Added: trunk/LayoutTests/css3/flexbox/auto-height-dynamic-expected.txt (0 => 100324)
--- trunk/LayoutTests/css3/flexbox/auto-height-dynamic-expected.txt (rev 0)
+++ trunk/LayoutTests/css3/flexbox/auto-height-dynamic-expected.txt 2011-11-15 22:25:24 UTC (rev 100324)
@@ -0,0 +1,2 @@
+PASS
+PASS
Property changes on: trunk/LayoutTests/css3/flexbox/auto-height-dynamic-expected.txt
___________________________________________________________________
Added: svn:eol-style
Added: trunk/LayoutTests/css3/flexbox/auto-height-dynamic.html (0 => 100324)
--- trunk/LayoutTests/css3/flexbox/auto-height-dynamic.html (rev 0)
+++ trunk/LayoutTests/css3/flexbox/auto-height-dynamic.html 2011-11-15 22:25:24 UTC (rev 100324)
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html>
+<style>
+.flexbox {
+ width: 600px;
+ display: -webkit-flexbox;
+ background-color: #aaa;
+ position: relative;
+ -webkit-flex-flow: column;
+}
+.flexbox :nth-child(1) {
+ background-color: blue;
+}
+</style>
+<script>
+if (window.layoutTestController)
+ layoutTestController.dumpAsText();
+</script>
+<script src=""
+<body _onload_="checkFlexBoxen()">
+
+<div class="flexbox" data-expected-height=0>
+ <div class="flexitem" data-expected-height=0 style="height: 100px"></div>
+</div>
+
+<div class="flexbox" data-expected-height=0>
+ <div class="flexitem2" data-expected-height=0 style="height: 100px"></div>
+</div>
+
+<script>
+document.querySelector('.flexitem').offsetHeight;
+document.querySelector('.flexitem2').offsetHeight;
+document.querySelector('.flexitem').style.height = "-webkit-flex(1)";
+document.querySelector('.flexitem2').style.height = "-webkit-flex(1 auto)";
+</script>
+
+</body>
+</html>
\ No newline at end of file
Property changes on: trunk/LayoutTests/css3/flexbox/auto-height-dynamic.html
___________________________________________________________________
Added: svn:eol-style
Added: trunk/LayoutTests/css3/flexbox/flex-item-child-overflow-expected.html (0 => 100324)
--- trunk/LayoutTests/css3/flexbox/flex-item-child-overflow-expected.html (rev 0)
+++ trunk/LayoutTests/css3/flexbox/flex-item-child-overflow-expected.html 2011-11-15 22:25:24 UTC (rev 100324)
@@ -0,0 +1,7 @@
+<!DOCTYPE html>
+<html>
+<body style="margin: 0">
+<div style="background-color: blue; width: 20px; height: 20px; position: absolute; top: 0;"></div>
+<pre>PASS</pre>
+</body>
+</html>
\ No newline at end of file
Property changes on: trunk/LayoutTests/css3/flexbox/flex-item-child-overflow-expected.html
___________________________________________________________________
Added: svn:eol-style
Added: trunk/LayoutTests/css3/flexbox/flex-item-child-overflow.html (0 => 100324)
--- trunk/LayoutTests/css3/flexbox/flex-item-child-overflow.html (rev 0)
+++ trunk/LayoutTests/css3/flexbox/flex-item-child-overflow.html 2011-11-15 22:25:24 UTC (rev 100324)
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html>
+<style>
+body {
+ margin: 0;
+}
+.flexbox {
+ display: -webkit-flexbox;
+ position: relative;
+ -webkit-flex-flow: column;
+}
+.flexbox > div {
+ height: 0;
+}
+.flexbox > div > div {
+ width: 20px;
+ height: 20px;
+ line-height: 0px;
+ background-color: blue;
+}
+</style>
+<script src=""
+<body _onload_="checkFlexBoxen()">
+
+<div data-expected-height=0 class="flexbox">
+ <div data-expected-height=0>
+ <div data-offset-y=0 data-expected-height=20></div>
+ </div>
+</div>
+
+</body>
+</html>
\ No newline at end of file
Property changes on: trunk/LayoutTests/css3/flexbox/flex-item-child-overflow.html
___________________________________________________________________
Added: svn:eol-style
Modified: trunk/Source/WebCore/ChangeLog (100323 => 100324)
--- trunk/Source/WebCore/ChangeLog 2011-11-15 22:23:59 UTC (rev 100323)
+++ trunk/Source/WebCore/ChangeLog 2011-11-15 22:25:24 UTC (rev 100324)
@@ -1,3 +1,27 @@
+2011-10-28 Ojan Vafai <o...@chromium.org>
+
+ Overflow and relayout are broken in the new flexboxes
+ https://bugs.webkit.org/show_bug.cgi?id=71161
+
+ Reviewed by David Hyatt.
+
+ Tests: css3/flexbox/auto-height-dynamic.html
+ css3/flexbox/flex-item-child-overflow-expected.html
+ css3/flexbox/flex-item-child-overflow.html
+
+ * rendering/RenderFlexibleBox.cpp:
+ (WebCore::RenderFlexibleBox::layoutBlock):
+ -Always set the logical height to 0 to start with to ensure we don't
+ use the height from the previous layout when we are computing the
+ intrinsic size of the flexbox.
+ -Call computeOverflow after computeLogicalHeight so that flex-item's children's
+ overflow is properly rendered.
+
+ (WebCore::RenderFlexibleBox::layoutAndPlaceChildrenInlineDirection):
+ -Now that we setLogicalHeight in layoutBlock, we no longer need to do it here.
+ -Refactor flipping code. The behavior is the same, but the variable names are just
+ more correct.
+
2011-11-15 Nate Chapin <jap...@chromium.org>
CachedResourceRequest is now the only SubresourceLoaderClient
Modified: trunk/Source/WebCore/rendering/RenderFlexibleBox.cpp (100323 => 100324)
--- trunk/Source/WebCore/rendering/RenderFlexibleBox.cpp 2011-11-15 22:23:59 UTC (rev 100323)
+++ trunk/Source/WebCore/rendering/RenderFlexibleBox.cpp 2011-11-15 22:25:24 UTC (rev 100324)
@@ -167,15 +167,17 @@
IntSize previousSize = size();
- // FIXME: In theory we should only have to call one of these.
- // computeLogicalWidth for flex-flow:row and computeLogicalHeight for flex-flow:column.
+ setLogicalHeight(0);
+ // We need to call both of these because we grab both crossAxisExtent and mainAxisExtent in layoutInlineDirection.
computeLogicalWidth();
computeLogicalHeight();
m_overflow.clear();
+ // FIXME: This is no longer named correctly. This should just be layoutFlexItems.
layoutInlineDirection(relayoutChildren);
+ LayoutUnit oldClientAfterEdge = clientLogicalBottom();
computeLogicalHeight();
if (size() != previousSize)
@@ -183,6 +185,8 @@
layoutPositionedObjects(relayoutChildren || isRoot());
+ // FIXME: css3/flexbox/repaint-rtl-column.html seems to repaint more overflow than it needs to.
+ computeOverflow(oldClientAfterEdge);
statePusher.pop();
updateLayerTransform();
@@ -646,8 +650,6 @@
LayoutUnit logicalTop = flowAwareBorderBefore() + flowAwarePaddingBefore();
LayoutUnit totalMainExtent = mainAxisExtent();
- if (crossAxisLength().isAuto())
- setCrossAxisExtent(0);
LayoutUnit maxAscent = 0, maxDescent = 0; // Used when flex-align: baseline.
size_t i = 0;
for (RenderBox* child = iterator.first(); child; child = iterator.next(), ++i) {
@@ -672,8 +674,8 @@
startEdge += flowAwareMarginStartForChild(child);
LayoutUnit childMainExtent = mainAxisExtentForChild(child);
- bool shouldFlipInlineDirection = isColumnFlow() ? true : isLeftToRightFlow();
- LayoutUnit logicalLeft = shouldFlipInlineDirection ? startEdge : totalMainExtent - startEdge - childMainExtent;
+ bool shouldFlipMainAxis = !isColumnFlow() && !isLeftToRightFlow();
+ LayoutUnit logicalLeft = shouldFlipMainAxis ? totalMainExtent - startEdge - childMainExtent : startEdge;
// FIXME: Supporting layout deltas.
setFlowAwareLocationForChild(child, IntPoint(logicalLeft, logicalTop + flowAwareMarginBeforeForChild(child)));
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
http://lists.webkit.org/mailman/listinfo.cgi/webkit-changes