Skip to content

GitLab

T
tangled
Commit 35b382aa authored by Christian Biesinger's avatar Christian Biesinger Committed by Commit Bot
Browse files
Options

[css-flexbox] Apply min-height: auto to nested flexboxes again 

To avoid the previous regression (see analysis in bug), we force
layout in the case where we otherwise would get an outdated result.

Bug: 596743
Change-Id: I9cf47675f7fcd88f94b2fe76b46bceae17e36756
Reviewed-on: https://chromium-review.googlesource.com/1246730
Commit-Queue: Christian Biesinger <cbiesinger@chromium.org>
Reviewed-by: default avatarMorten Stenshorne <mstensho@chromium.org>
Cr-Commit-Position: refs/heads/master@{#594752}
parent 5115783a
Show whitespace changes
Inline Side-by-side
Showing with 81 additions and 9 deletions
third_party/WebKit/LayoutTests/TestExpectations
View file @ 35b382aa
......@@ -1396,7 +1396,6 @@ crbug.com/591099 virtual/layout_ng_experimental/css3/flexbox/multiline-shrink-to
crbug.com/591099 virtual/layout_ng_experimental/css3/flexbox/multiline.html [ Skip ]
crbug.com/591099 virtual/layout_ng_experimental/css3/flexbox/negative-flex-rounding-assert.html [ Skip ]
crbug.com/591099 virtual/layout_ng_experimental/css3/flexbox/negative-overflow.html [ Skip ]
crbug.com/591099 virtual/layout_ng_experimental/css3/flexbox/nested-flexbox-min-size-auto.html [ Skip ]
crbug.com/591099 virtual/layout_ng_experimental/css3/flexbox/nested-orthogonal-flexbox-relayout.html [ Skip ]
crbug.com/591099 virtual/layout_ng_experimental/css3/flexbox/nested-stretch.html [ Skip ]
crbug.com/591099 virtual/layout_ng_experimental/css3/flexbox/order-painting.html [ Failure ]
......@@ -1516,6 +1515,7 @@ crbug.com/249112 virtual/layout_ng_experimental/external/wpt/css/css-flexbox/fle
crbug.com/467127 virtual/layout_ng_experimental/external/wpt/css/css-flexbox/flex-minimum-height-flex-items-006.xht [ Skip ]
crbug.com/249112 virtual/layout_ng_experimental/external/wpt/css/css-flexbox/flex-minimum-height-flex-items-007.xht [ Skip ]
crbug.com/467127 virtual/layout_ng_experimental/external/wpt/css/css-flexbox/flex-minimum-height-flex-items-008.xht [ Skip ]
crbug.com/591099 virtual/layout_ng_experimental/external/wpt/css/css-flexbox/flex-minimum-height-flex-items-009.html [ Skip ]
crbug.com/591099 virtual/layout_ng_experimental/external/wpt/css/css-flexbox/flex-minimum-width-flex-items-001.xht [ Failure ]
crbug.com/591099 virtual/layout_ng_experimental/external/wpt/css/css-flexbox/flex-minimum-width-flex-items-002.xht [ Failure ]
crbug.com/591099 virtual/layout_ng_experimental/external/wpt/css/css-flexbox/flex-minimum-width-flex-items-003.xht [ Failure ]
......
third_party/WebKit/LayoutTests/css3/flexbox/nested-flexbox-min-size-auto.html → third_party/WebKit/LayoutTests/external/wpt/css/css-flexbox/flex-minimum-height-flex-items-009.html
View file @ 35b382aa
<!DOCTYPE html>
<link href="resources/flexbox.css" rel="stylesheet">
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="../../resources/check-layout-th.js"></script>
<title>Tests correct handling of min-height: auto with dynamic changes</title>
<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#min-size-auto" title="4.5. Implied Minimum Size of Flex Items" />
<link rel="author" title="Google Inc." href="http://www.google.com/">
<link href="support/flexbox.css" rel="stylesheet">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/check-layout-th.js"></script>
<style>
#container {
.container {
height: 300px;
outline: 2px solid black;
}
......@@ -15,19 +18,37 @@
flex: 1;
background-color: green;
}
#container2 .flexbox > * { flex-basis: 0; }
#container2 .column > * { flex-basis: auto; }
</style>
<script>
function change() {
var container = document.getElementById('container');
container.offsetHeight;
container.style.height = '80px';
checkLayout('#container');
container = document.getElementById('container2');
container.offsetHeight;
container.style.height = '80px';
checkLayout('.container');
}
</script>
<body onload="change()">
<p>Green rectangle should be entirely within the black rectangle</p>
<div id="log"></div>
<div id="container">
<div id="container" class="container">
<div class="flexbox column" style="height: 100%;">
<div class="flexbox flex-one">
<div class="flexbox column">
<div class="flexbox column flex-one">
<div class="inner" data-expected-height="80">
</div>
</div>
</div>
</div>
</div>
</div>
<div id="container2" class="container">
<div class="flexbox column" style="height: 100%;">
<div class="flexbox flex-one">
<div class="flexbox column">
......
third_party/blink/renderer/core/layout/layout_flexible_box.cc
View file @ 35b382aa
......@@ -437,6 +437,14 @@ bool LayoutFlexibleBox::IsMultiline() const {
return StyleRef().FlexWrap() != EFlexWrap::kNowrap;
}
bool LayoutFlexibleBox::ShouldApplyMinSizeAutoForChild(
const LayoutBox& child) const {
Length min = IsHorizontalFlow() ? child.StyleRef().MinWidth()
: child.StyleRef().MinHeight();
return min.IsAuto() && !child.ShouldApplySizeContainment() &&
MainAxisOverflowForChild(child) == EOverflow::kVisible;
}
Length LayoutFlexibleBox::FlexBasisForChild(const LayoutBox& child) const {
Length flex_length = child.StyleRef().FlexBasis();
if (flex_length.IsAuto()) {
......@@ -997,14 +1005,7 @@ MinMaxSize LayoutFlexibleBox::ComputeMinAndMaxSizesForChild(
// computeMainAxisExtentForChild can return -1 when the child has a
// percentage min size, but we have an indefinite size in that axis.
sizes.min_size = std::max(LayoutUnit(), sizes.min_size);
} else if (min.IsAuto() && !child.ShouldApplySizeContainment() &&
MainAxisOverflowForChild(child) == EOverflow::kVisible &&
!(IsColumnFlow() && child.IsFlexibleBox())) {
// TODO(cbiesinger): For now, we do not handle min-height: auto for nested
// column flexboxes. We need to implement
// https://drafts.csswg.org/css-flexbox/#intrinsic-sizes before that
// produces reasonable results. Tracking bug: https://crbug.com/581553
// css-flexbox section 4.5
} else if (ShouldApplyMinSizeAutoForChild(child)) {
LayoutUnit content_size =
ComputeMainAxisExtentForChild(child, kMinSize, Length(kMinContent));
DCHECK_GE(content_size, LayoutUnit());
......@@ -1124,6 +1125,14 @@ LayoutUnit LayoutFlexibleBox::AdjustChildSizeForAspectRatioCrossAxisMinAndMax(
DISABLE_CFI_PERF
FlexItem LayoutFlexibleBox::ConstructFlexItem(LayoutBox& child,
ChildLayoutType layout_type) {
if (layout_type == kLayoutIfNeeded && IsColumnFlow() &&
child.IsFlexibleBox() && ShouldApplyMinSizeAutoForChild(child)) {
// In this case, we have to force-layout to update the intrinsic height of
// our child; otherwise, it may be too big because it is based on previous
// flexing of a descendant, which would be a problem for applying
// min-size: auto.
layout_type = kForceLayout;
}
if (layout_type != kNeverLayout && ChildHasIntrinsicMainAxisSize(child)) {
// If this condition is true, then ComputeMainAxisExtentForChild will call
// child.IntrinsicContentLogicalHeight() and
......
third_party/blink/renderer/core/layout/layout_flexible_box.h
View file @ 35b382aa
......@@ -111,6 +111,7 @@ class CORE_EXPORT LayoutFlexibleBox : public LayoutBlock {
bool IsColumnFlow() const;
bool IsLeftToRightFlow() const;
bool IsMultiline() const;
bool ShouldApplyMinSizeAutoForChild(const LayoutBox& child) const;
Length FlexBasisForChild(const LayoutBox& child) const;
LayoutUnit CrossAxisExtentForChild(const LayoutBox& child) const;
LayoutUnit CrossAxisIntrinsicExtentForChild(const LayoutBox& child) const;
......
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