Bug 1434658: Simplify getComputedStyle behavior for "min-{width,height}:auto" to *always* return "auto" for flex/grid items, per CSSWG resolution. r?bradwerth
This change is in response to this CSSWG resolution:
"RESOLVED: compute min-width/min-height: auto to auto"
https://github.com/w3c/csswg-drafts/issues/2230#issuecomment-362009042
...which was later clarified as only being applicable to grid/flex items (in
both axes). Other layout modes may get further min-width/min-height
clarification, but for now we'll leave that behavior the same (returning 0 from
getComputedStyle).
MozReview-Commit-ID: 2wLYDAOj9I6
--- a/layout/style/nsComputedDOMStyle.cpp
+++ b/layout/style/nsComputedDOMStyle.cpp
@@ -5485,46 +5485,33 @@ already_AddRefed<CSSValue>
nsComputedDOMStyle::DoGetMaxWidth()
{
RefPtr<nsROCSSPrimitiveValue> val = new nsROCSSPrimitiveValue;
SetValueToCoord(val, StylePosition()->mMaxWidth, true,
nullptr, nsCSSProps::kWidthKTable);
return val.forget();
}
+/**
+ * This function indicates whether we should return "auto" as the
+ * getComputedStyle() result for the (default) "min-width: auto" and
+ * "min-height: auto" CSS values.
+ *
+ * As of this writing, the CSS Sizing draft spec says this "auto" value
+ * *always* computes to itself. However, for now, we only make it compute to
+ * itself for grid and flex items (the containers where "auto" has special
+ * significance), because those are the only areas where the CSSWG has actually
+ * resolved on this "computes-to-itself" behavior. For elements in other sorts
+ * of containers, this function returns false, which will make us resolve
+ * "auto" to 0.
+ */
bool
nsComputedDOMStyle::ShouldHonorMinSizeAutoInAxis(PhysicalAxis aAxis)
{
- // A {flex,grid} item's min-{width|height} "auto" value gets special
- // treatment in getComputedStyle().
- // https://drafts.csswg.org/css-flexbox-1/#valdef-min-width-auto
- // https://drafts.csswg.org/css-grid/#min-size-auto
- // In most cases, "min-{width|height}: auto" is mapped to "0px", unless
- // we're a flex item (and the min-size is in the flex container's main
- // axis), or we're a grid item, AND we also have overflow:visible.
-
- // Note: We only need to bother checking one "overflow" subproperty for
- // "visible", because a non-"visible" value in either axis would force the
- // other axis to also be non-"visible" as well.
-
- if (mOuterFrame) {
- nsIFrame* containerFrame = mOuterFrame->GetParent();
- if (containerFrame &&
- StyleDisplay()->mOverflowX == NS_STYLE_OVERFLOW_VISIBLE) {
- if (containerFrame->IsFlexContainerFrame() &&
- (static_cast<nsFlexContainerFrame*>(containerFrame)->IsHorizontal() ==
- (aAxis == eAxisHorizontal))) {
- return true;
- }
- if (containerFrame->IsGridContainerFrame()) {
- return true;
- }
- }
- }
- return false;
+ return mOuterFrame && mOuterFrame->IsFlexOrGridItem();
}
already_AddRefed<CSSValue>
nsComputedDOMStyle::DoGetMinHeight()
{
RefPtr<nsROCSSPrimitiveValue> val = new nsROCSSPrimitiveValue;
nsStyleCoord minHeight = StylePosition()->mMinHeight;
--- a/layout/style/test/test_computed_style_min_size_auto.html
+++ b/layout/style/test/test_computed_style_min_size_auto.html
@@ -84,30 +84,26 @@ function checkElemMinSizes(aElemId,
// This function goes through all the elements we're interested in
// and checks their computed min-sizes against expected values,
// farming out each per-element job to checkElemMinSizes.
function checkAllTheMinSizes() {
// This is the normal part -- generally, the default value of "min-width"
// and "min-height" (auto) computes to "0px".
checkElemMinSizes("block-item", "0px", "0px");
- // ...but for a flex item in a horizontal flex container, "min-width: auto"
- // computes to "auto".
- checkElemMinSizes("horizontal-flex-item", "auto", "0px");
- checkElemMinSizes("horizontal-flex-item-OH", "0px", "0px");
-
- // ...and for a flex item in a vertical flex container, "min-height: auto"
- // computes to "auto".
- checkElemMinSizes("vertical-flex-item", "0px", "auto");
- checkElemMinSizes("vertical-flex-item-OH", "0px", "0px");
-
- // ...and for a grid item, "min-width: auto" and min-height both
- // compute to "auto".
- checkElemMinSizes("grid-item", "auto", "auto");
- checkElemMinSizes("grid-item-OH", "0px", "0px");
+ // ...but for a flex item or grid item, "min-width: auto" and
+ // "min-height: auto" both compute to "auto" (even in cases where
+ // we know it'll actually resolve to 0 in layout, like for example
+ // when the item has "overflow:hidden").
+ checkElemMinSizes("horizontal-flex-item", "auto", "auto");
+ checkElemMinSizes("horizontal-flex-item-OH", "auto", "auto");
+ checkElemMinSizes("vertical-flex-item", "auto", "auto");
+ checkElemMinSizes("vertical-flex-item-OH", "auto", "auto");
+ checkElemMinSizes("grid-item", "auto", "auto");
+ checkElemMinSizes("grid-item-OH", "auto", "auto");
}
// Main test function
function main() {
// First: check that min-sizes are what we expect, with min-size properties
// at their initial value.
checkAllTheMinSizes();