Changeset 284440 in webkit


Ignore:
Timestamp:
Oct 19, 2021 3:14:40 AM (9 months ago)
Author:
svillar@igalia.com
Message:

[css-flexbox] Add flex-basis: content support
​https://bugs.webkit.org/show_bug.cgi?id=221479
LayoutTests/imported/w3c:

Reviewed by Javier Fernandez.

Fixed 6 subtest expectations. All of them working fine now.

  • web-platform-tests/css/css-flexbox/parsing/flex-basis-computed-expected.txt:
  • web-platform-tests/css/css-flexbox/parsing/flex-basis-valid-expected.txt:
  • web-platform-tests/css/css-flexbox/parsing/flex-shorthand-expected.txt:

Source/WebCore:

Reviewed by Javier Fernandez.

Add support for the content keyword as a valid value for the flex-basis property.
It indicates an automated size based on the contents of the flex item. It's typically
equivalent to the max-content size but it has some adjustments for aspect ratios,
orthogonal flows and intrinsic sizing constraints.

Apart from adding the parsing support, it required very little adjustments in the
flexbox code after the refactoring in r284359.

This makes WebKit pass all of the flex-basis:content tests in WPT. We're talking
about 6 tests testing the feature and 6 subtests related to parsing.

  • css/CSSPrimitiveValue.cpp:

(WebCore::CSSPrimitiveValue::CSSPrimitiveValue): Handle Content in switch.
(WebCore::CSSPrimitiveValue::init): Initialization for content CSS value.

  • css/CSSProperties.json:
  • css/LengthFunctions.cpp: Replaced LengthOrAuto by LengthSizing.

(WebCore::valueForLength): Handle Content in switch.
(WebCore::floatValueForLength): Ditto.

  • css/LengthFunctions.h:

(WebCore::minimumValueForLength): Ditto.

  • css/calc/CSSCalcValue.cpp:

(WebCore::createCSS): Ditto.

  • css/parser/CSSPropertyParser.cpp:

(WebCore::consumeFlexBasis): Consume CSSValueContent.
(WebCore::CSSPropertyParser::consumeFlex): Ditto.

  • platform/Length.cpp:

(WebCore::operator<<): Added printing support for content.

  • platform/Length.h:

(WebCore::Length::initialize): Added enum for content.
(WebCore::Length::isContent const): New method.

  • rendering/RenderBox.cpp:

(WebCore::RenderBox::computeReplacedLogicalWidthUsing const): Handle content in switch.

  • rendering/RenderFlexibleBox.cpp:

(WebCore::RenderFlexibleBox::childMainSizeIsDefinite): Treat content as indefinite lenght.
(WebCore::RenderFlexibleBox::childHasComputableAspectRatioAndCrossSizeIsConsideredDefinite):
Flex basis must be either auto or content.
(WebCore::RenderFlexibleBox::computeFlexBaseSizeForChild): Compute flex-basis using max-content
if flex-basis:content is specified.

  • style/StyleBuilderConverter.h:

(WebCore::Style::BuilderConverter::convertLengthSizing): Handle content in switch.

Source/WebKit:

<rdar://problem/74279369>

Reviewed by Javier Fernandez.

Handle LengthType::Content in encode/decode functions.

  • Shared/WebCoreArgumentCoders.cpp:

(IPC::ArgumentCoder<Length>::encode):
(IPC::ArgumentCoder<Length>::decode):

LayoutTests:

Reviewed by Javier Fernandez.

Location:
trunk
Files:
20 edited

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/ChangeLog

    r284439 r284440  
     12021-10-18  Sergio Villar Senin  <svillar@igalia.com>
     2
     3        [css-flexbox] Add flex-basis: content support
     4        https://bugs.webkit.org/show_bug.cgi?id=221479
     5
     6        Reviewed by Javier Fernandez.
     7
     8        * TestExpectations: Unskipped 6 tests that are now passing.
     9
    1102021-10-19  Cameron McCormack  <heycam@apple.com>
    211

  • trunk/LayoutTests/TestExpectations

    r284439 r284440  
    42114211webkit.org/b/221478 imported/w3c/web-platform-tests/css/css-flexbox/synthesize-vrl-baseline.html [ ImageOnlyFailure ]
    42124212
    4213 # flex-basis:content.
    4214 webkit.org/b/221479 imported/w3c/web-platform-tests/css/css-flexbox/flexbox-flex-basis-content-001a.html [ ImageOnlyFailure ]
    4215 webkit.org/b/221479 imported/w3c/web-platform-tests/css/css-flexbox/flexbox-flex-basis-content-001b.html [ ImageOnlyFailure ]
    4216 webkit.org/b/221479 imported/w3c/web-platform-tests/css/css-flexbox/flexbox-flex-basis-content-002a.html [ ImageOnlyFailure ]
    4217 webkit.org/b/221479 imported/w3c/web-platform-tests/css/css-flexbox/flexbox-flex-basis-content-002b.html [ ImageOnlyFailure ]
    4218 webkit.org/b/221479 imported/w3c/web-platform-tests/css/css-flexbox/flexbox-flex-basis-content-003a.html [ ImageOnlyFailure ]
    4219 webkit.org/b/221479 imported/w3c/web-platform-tests/css/css-flexbox/flexbox-flex-basis-content-004a.html [ ImageOnlyFailure ]
    4220 
    42214213# Flex item's min|max content contributions
    42224214webkit.org/b/230747 imported/w3c/web-platform-tests/css/css-flexbox/flex-container-max-content-001.html [ ImageOnlyFailure ]

  • trunk/LayoutTests/imported/w3c/ChangeLog

    r284439 r284440  
     12021-10-18  Sergio Villar Senin  <svillar@igalia.com>
     2
     3        [css-flexbox] Add flex-basis: content support
     4        https://bugs.webkit.org/show_bug.cgi?id=221479
     5
     6        Reviewed by Javier Fernandez.
     7
     8        Fixed 6 subtest expectations. All of them working fine now.
     9
     10        * web-platform-tests/css/css-flexbox/parsing/flex-basis-computed-expected.txt:
     11        * web-platform-tests/css/css-flexbox/parsing/flex-basis-valid-expected.txt:
     12        * web-platform-tests/css/css-flexbox/parsing/flex-shorthand-expected.txt:
     13
    1142021-10-19  Cameron McCormack  <heycam@apple.com>
    215

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-flexbox/parsing/flex-basis-computed-expected.txt

    r283041 r284440  
    33PASS Property flex-basis value '400%'
    44PASS Property flex-basis value 'auto'
    5 FAIL Property flex-basis value 'content' assert_true: 'content' is a supported value for flex-basis. expected true got false
     5PASS Property flex-basis value 'content'
    66FAIL Property flex-basis value 'fit-content' assert_true: 'fit-content' is a supported value for flex-basis. expected true got false
    77FAIL Property flex-basis value 'min-content' assert_true: 'min-content' is a supported value for flex-basis. expected true got false

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-flexbox/parsing/flex-basis-valid-expected.txt

    r283041 r284440  
    77FAIL e.style['flex-basis'] = "min-content" should set the property value assert_not_equals: property should be set got disallowed value ""
    88FAIL e.style['flex-basis'] = "max-content" should set the property value assert_not_equals: property should be set got disallowed value ""
    9 FAIL e.style['flex-basis'] = "content" should set the property value assert_not_equals: property should be set got disallowed value ""
     9PASS e.style['flex-basis'] = "content" should set the property value
    1010

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-flexbox/parsing/flex-shorthand-expected.txt

    r283041 r284440  
    2424PASS e.style['flex'] = "8 auto" should set flex-shrink
    2525PASS e.style['flex'] = "8 auto" should not set unrelated longhands
    26 FAIL e.style['flex'] = "content" should set flex-basis assert_equals: flex-basis should be canonical expected "content" but got ""
    27 FAIL e.style['flex'] = "content" should set flex-grow assert_equals: flex-grow should be canonical expected "1" but got ""
    28 FAIL e.style['flex'] = "content" should set flex-shrink assert_equals: flex-shrink should be canonical expected "1" but got ""
    29 FAIL e.style['flex'] = "content" should not set unrelated longhands assert_true: expected true got false
     26PASS e.style['flex'] = "content" should set flex-basis
     27PASS e.style['flex'] = "content" should set flex-grow
     28PASS e.style['flex'] = "content" should set flex-shrink
     29PASS e.style['flex'] = "content" should not set unrelated longhands
    3030FAIL e.style['flex'] = "0 fit-content" should set flex-basis assert_equals: flex-basis should be canonical expected "fit-content" but got ""
    3131FAIL e.style['flex'] = "0 fit-content" should set flex-grow assert_equals: flex-grow should be canonical expected "0" but got ""

  • trunk/Source/WebCore/ChangeLog

    r284439 r284440  
     12021-10-18  Sergio Villar Senin  <svillar@igalia.com>
     2
     3        [css-flexbox] Add flex-basis: content support
     4        https://bugs.webkit.org/show_bug.cgi?id=221479
     5
     6        Reviewed by Javier Fernandez.
     7
     8        Add support for the content keyword as a valid value for the flex-basis property.
     9        It indicates an automated size based on the contents of the flex item. It's typically
     10        equivalent to the max-content size but it has some adjustments for aspect ratios,
     11        orthogonal flows and intrinsic sizing constraints.
     12
     13        Apart from adding the parsing support, it required very little adjustments in the
     14        flexbox code after the refactoring in r284359.
     15
     16        This makes WebKit pass all of the flex-basis:content tests in WPT. We're talking
     17        about 6 tests testing the feature and 6 subtests related to parsing.
     18
     19        * css/CSSPrimitiveValue.cpp:
     20        (WebCore::CSSPrimitiveValue::CSSPrimitiveValue): Handle Content in switch.
     21        (WebCore::CSSPrimitiveValue::init): Initialization for content CSS value.
     22        * css/CSSProperties.json:
     23        * css/LengthFunctions.cpp: Replaced LengthOrAuto by LengthSizing.
     24        (WebCore::valueForLength): Handle Content in switch.
     25        (WebCore::floatValueForLength): Ditto.
     26        * css/LengthFunctions.h:
     27        (WebCore::minimumValueForLength): Ditto.
     28        * css/calc/CSSCalcValue.cpp:
     29        (WebCore::createCSS): Ditto.
     30        * css/parser/CSSPropertyParser.cpp:
     31        (WebCore::consumeFlexBasis): Consume CSSValueContent.
     32        (WebCore::CSSPropertyParser::consumeFlex): Ditto.
     33        * platform/Length.cpp:
     34        (WebCore::operator<<): Added printing support for content.
     35        * platform/Length.h:
     36        (WebCore::Length::initialize): Added enum for content.
     37        (WebCore::Length::isContent const): New method.
     38        * rendering/RenderBox.cpp:
     39        (WebCore::RenderBox::computeReplacedLogicalWidthUsing const): Handle content in switch.
     40        * rendering/RenderFlexibleBox.cpp:
     41        (WebCore::RenderFlexibleBox::childMainSizeIsDefinite): Treat content as indefinite lenght.
     42        (WebCore::RenderFlexibleBox::childHasComputableAspectRatioAndCrossSizeIsConsideredDefinite):
     43        Flex basis must be either auto or content.
     44        (WebCore::RenderFlexibleBox::computeFlexBaseSizeForChild): Compute flex-basis using max-content
     45        if flex-basis:content is specified.
     46        * style/StyleBuilderConverter.h:
     47        (WebCore::Style::BuilderConverter::convertLengthSizing): Handle content in switch.
     48
    1492021-10-19  Cameron McCormack  <heycam@apple.com>
    250

  • trunk/Source/WebCore/css/CSSPrimitiveValue.cpp

    r283562 r284440  
    3838#include "DeprecatedCSSOMPrimitiveValue.h"
    3939#include "FontCascade.h"
     40#include "Length.h"
    4041#include "Node.h"
    4142#include "Pair.h"
    … …  
    291292    switch (length.type()) {
    292293    case LengthType::Auto:
     294    case LengthType::Content:
    293295    case LengthType::Intrinsic:
    294296    case LengthType::MinIntrinsic:
    … …  
    345347        setPrimitiveUnitType(CSSUnitType::CSS_VALUE_ID);
    346348        m_value.valueID = CSSValueAuto;
     349        return;
     350    case LengthType::Content:
     351        setPrimitiveUnitType(CSSUnitType::CSS_VALUE_ID);
     352        m_value.valueID = CSSValueContent;
    347353        return;
    348354    case LengthType::Fixed:

  • trunk/Source/WebCore/css/CSSProperties.json

    r284361 r284440  
    56725672                    "-webkit-flex-basis"
    56735673                ],
    5674                 "converter": "LengthOrAuto"
     5674                "converter": "LengthSizing"
    56755675            },
    56765676            "specification": {

  • trunk/Source/WebCore/css/LengthFunctions.cpp

    r272805 r284440  
    5050    case LengthType::Intrinsic:
    5151    case LengthType::MinIntrinsic:
     52    case LengthType::Content:
    5253    case LengthType::MinContent:
    5354    case LengthType::MaxContent:
    … …  
    7778    case LengthType::Intrinsic:
    7879    case LengthType::MinIntrinsic:
     80    case LengthType::Content:
    7981    case LengthType::MinContent:
    8082    case LengthType::MaxContent:
    … …  
    103105    case LengthType::Intrinsic:
    104106    case LengthType::MinIntrinsic:
     107    case LengthType::Content:
    105108    case LengthType::MinContent:
    106109    case LengthType::MaxContent:

  • trunk/Source/WebCore/css/LengthFunctions.h

    r272805 r284440  
    6060    case LengthType::FillAvailable:
    6161    case LengthType::Auto:
     62    case LengthType::Content:
    6263        return 0;
    6364    case LengthType::Relative:

  • trunk/Source/WebCore/css/calc/CSSCalcValue.cpp

    r283359 r284440  
    265265        return createCSS(length.calculationValue().expression(), style);
    266266    case LengthType::Auto:
     267    case LengthType::Content:
    267268    case LengthType::Intrinsic:
    268269    case LengthType::MinIntrinsic:

  • trunk/Source/WebCore/css/parser/CSSPropertyParser.cpp

    r284361 r284440  
    22422242{
    22432243    // FIXME: Support intrinsic dimensions too.
    2244     if (range.peek().id() == CSSValueAuto)
     2244    if (range.peek().id() == CSSValueAuto || range.peek().id() == CSSValueContent)
    22452245        return consumeIdent(range);
    22462246    return consumeLengthOrPercent(range, cssParserMode, ValueRange::NonNegative);
    … …  
    52285228                    return false;
    52295229            } else if (!flexBasis) {
    5230                 if (m_range.peek().id() == CSSValueAuto)
     5230                if (m_range.peek().id() == CSSValueAuto || m_range.peek().id() == CSSValueContent)
    52315231                    flexBasis = consumeIdent(m_range);
    52325232                if (!flexBasis)

  • trunk/Source/WebCore/platform/Length.cpp

    r283568 r284440  
    371371    case LengthType::FitContent: ts << "fit-content"; break;
    372372    case LengthType::Calculated: ts << "calc"; break;
     373    case LengthType::Content: ts << "content"; break;
    373374    case LengthType::Undefined: ts << "undefined"; break;
    374375    }
    … …  
    380381    switch (length.type()) {
    381382    case LengthType::Auto:
     383    case LengthType::Content:
    382384    case LengthType::Undefined:
    383385        ts << length.type();

  • trunk/Source/WebCore/platform/Length.h

    r283470 r284440  
    4848    FitContent,
    4949    Calculated,
     50    Content,
    5051    Undefined
    5152};
    … …  
    104105    bool isFitContent() const;
    105106    bool isMinIntrinsic() const;
     107    bool isContent() const;
    106108
    107109    bool hasQuirk() const;
    … …  
    237239    switch (m_type) {
    238240    case LengthType::Auto:
     241    case LengthType::Content:
    239242    case LengthType::Undefined:
    240243        m_intValue = 0;
    … …  
    269272    switch (m_type) {
    270273    case LengthType::Auto:
     274    case LengthType::Content:
    271275    case LengthType::Undefined:
    272276        m_intValue = 0;
    … …  
    512516}
    513517
     518inline bool Length::isContent() const
     519{
     520    return type() == LengthType::Content;
     521}
     522
    514523Length convertTo100PercentMinusLength(const Length&);
    515524

  • trunk/Source/WebCore/rendering/RenderBox.cpp

    r284380 r284440  
    33423342    case LengthType::MinIntrinsic:
    33433343    case LengthType::Auto:
     3344    case LengthType::Content:
    33443345    case LengthType::Relative:
    33453346    case LengthType::Undefined:

  • trunk/Source/WebCore/rendering/RenderFlexibleBox.cpp

    r284397 r284440  
    3535#include "HitTestResult.h"
    3636#include "LayoutRepainter.h"
     37#include "Length.h"
    3738#include "RenderBox.h"
    3839#include "RenderChildIterator.h"
    … …  
    918919bool RenderFlexibleBox::childMainSizeIsDefinite(const RenderBox& child, const Length& flexBasis)
    919920{
    920     if (flexBasis.isAuto())
     921    if (flexBasis.isAuto() || flexBasis.isContent())
    921922        return false;
    922923    if (isColumnFlow() && (flexBasis.isIntrinsic() || flexBasis.type() == LengthType::Intrinsic))
    … …  
    936937bool RenderFlexibleBox::childHasComputableAspectRatioAndCrossSizeIsConsideredDefinite(const RenderBox& child)
    937938{
    938     return childHasComputableAspectRatio(child)
     939    auto flexBasis = flexBasisForChild(child);
     940    return childHasComputableAspectRatio(child) && (flexBasis.isContent() || flexBasis.isAuto())
    939941        && (childCrossSizeIsDefinite(child, crossSizeLengthForChild(MainOrPreferredSize, child)) || childCrossSizeShouldUseContainerCrossSize(child));
    940942}
    … …  
    10701072    // 9.3.2 E. Otherwise, size the item into the available space using its used flex basis in place of its main size.
    10711073    {
    1072         ScopedUnboundedBoxWithFlexBasisAsChildMainSize flexBasisScope(child, flexBasis, mainAxisIsChildInlineAxis(child));
     1074        ScopedUnboundedBoxWithFlexBasisAsChildMainSize flexBasisScope(child, flexBasis.isContent() ? Length(LengthType::MaxContent) : flexBasis, mainAxisIsChildInlineAxis(child));
    10731075        if (mainAxisIsChildInlineAxis(child))
    10741076            return child.maxPreferredLogicalWidth() - mainAxisBorderAndPadding;

  • trunk/Source/WebCore/style/StyleBuilderConverter.h

    r284361 r284440  
    6969    static Length convertLength(const BuilderState&, const CSSValue&);
    7070    static Length convertLengthOrAuto(const BuilderState&, const CSSValue&);
     71    static Length convertLengthOrAutoOrContent(const BuilderState&, const CSSValue&);
    7172    static Length convertLengthSizing(const BuilderState&, const CSSValue&);
    7273    static Length convertLengthMaxSizing(const BuilderState&, const CSSValue&);
    … …  
    245246    case CSSValueAuto:
    246247        return Length(LengthType::Auto);
     248    case CSSValueContent:
     249        return Length(LengthType::Content);
    247250    default:
    248251        ASSERT_NOT_REACHED();

  • trunk/Source/WebKit/ChangeLog

    r284439 r284440  
     12021-10-18  Sergio Villar Senin  <svillar@igalia.com>
     2
     3        [css-flexbox] Add flex-basis: content support
     4        https://bugs.webkit.org/show_bug.cgi?id=221479
     5        <rdar://problem/74279369>
     6
     7        Reviewed by Javier Fernandez.
     8
     9        Handle LengthType::Content in encode/decode functions.
     10
     11        * Shared/WebCoreArgumentCoders.cpp:
     12        (IPC::ArgumentCoder<Length>::encode):
     13        (IPC::ArgumentCoder<Length>::decode):
     14
    1152021-10-19  Cameron McCormack  <heycam@apple.com>
    216

  • trunk/Source/WebKit/Shared/WebCoreArgumentCoders.cpp

    r284095 r284440  
    718718    switch (length.type()) {
    719719    case LengthType::Auto:
     720    case LengthType::Content:
    720721    case LengthType::Undefined:
    721722        break;
    … …  
    753754    switch (type) {
    754755    case LengthType::Auto:
     756    case LengthType::Content:
    755757    case LengthType::Undefined:
    756758        length = Length(type);
Note: See TracChangeset for help on using the changeset viewer.