Changeset 291474 in webkit


Ignore:
Timestamp:
Mar 18, 2022 2:01:12 AM (4 months ago)
Author:
Antti Koivisto
Message:

[CSS Container Queries] Basic support for container units
​https://bugs.webkit.org/show_bug.cgi?id=238021

Reviewed by Antoine Quint.

LayoutTests/imported/w3c:

  • web-platform-tests/css/css-contain/container-queries/container-units-animation-expected.txt:
  • web-platform-tests/css/css-contain/container-queries/container-units-basic-expected.txt:
  • web-platform-tests/css/css-contain/container-queries/container-units-computational-independence-expected.txt:
  • web-platform-tests/css/css-contain/container-queries/container-units-invalidation-expected.txt:
  • web-platform-tests/css/css-contain/container-queries/container-units-selection-expected.txt:
  • web-platform-tests/css/css-contain/container-queries/container-units-small-viewport-fallback-expected.txt:
  • web-platform-tests/css/css-contain/container-queries/container-units-typed-om-expected.txt:

Source/WebCore:

Container Relative Lengths: the cqw, cqh, cqi, cqb, cqmin, cqmax units
​https://drafts.csswg.org/css-contain-3/#container-lengths

  • css/CSSPrimitiveValue.cpp:

(WebCore::isValidCSSUnitTypeForDoubleConversion):
(WebCore::isStringType):
(WebCore::CSSPrimitiveValue::cleanup):
(WebCore::CSSPrimitiveValue::computeNonCalcLengthDouble):

Resolve container units by resolving the query container and computing the value against it.

(WebCore::CSSPrimitiveValue::unitTypeString):
(WebCore::CSSPrimitiveValue::formatNumberForCustomCSSText const):
(WebCore::CSSPrimitiveValue::equals const):

  • css/CSSPrimitiveValue.h:

(WebCore::CSSPrimitiveValue::isLength):

  • css/CSSToLengthConversionData.cpp:

(WebCore::CSSToLengthConversionData::CSSToLengthConversionData):

  • css/CSSToLengthConversionData.h:

(WebCore::CSSToLengthConversionData::element const):

  • css/CSSUnits.cpp:

(WebCore::unitCategory):
(WebCore::operator<<):

  • css/CSSUnits.h:
  • css/ContainerQuery.h:
  • css/calc/CSSCalcCategoryMapping.cpp:

(WebCore::calcUnitCategory):
(WebCore::calculationCategoryForCombination):
(WebCore::hasDoubleValue):

  • css/parser/CSSParserToken.cpp:

(WebCore::cssPrimitiveValueUnitFromTrie):

Parsing support.

  • css/parser/CSSPropertyParserHelpers.cpp:

(WebCore::CSSPropertyParserHelpers::LengthRawKnownTokenTypeDimensionConsumer::consume):

  • style/ContainerQueryEvaluator.cpp:

(WebCore::Style::ContainerQueryEvaluator::selectContainer const):
(WebCore::Style::ContainerQueryEvaluator::selectContainer):

Factor container selection into static function that can be used from the unit resolution code.

  • style/ContainerQueryEvaluator.h:
  • style/SelectorMatchingState.h:
Location:
trunk
Files:
22 edited

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/imported/w3c/ChangeLog

    r291464 r291474  
     12022-03-18  Antti Koivisto  <antti@apple.com>
     2
     3        [CSS Container Queries] Basic support for container units
     4        https://bugs.webkit.org/show_bug.cgi?id=238021
     5
     6        Reviewed by Antoine Quint.
     7
     8        * web-platform-tests/css/css-contain/container-queries/container-units-animation-expected.txt:
     9        * web-platform-tests/css/css-contain/container-queries/container-units-basic-expected.txt:
     10        * web-platform-tests/css/css-contain/container-queries/container-units-computational-independence-expected.txt:
     11        * web-platform-tests/css/css-contain/container-queries/container-units-invalidation-expected.txt:
     12        * web-platform-tests/css/css-contain/container-queries/container-units-selection-expected.txt:
     13        * web-platform-tests/css/css-contain/container-queries/container-units-small-viewport-fallback-expected.txt:
     14        * web-platform-tests/css/css-contain/container-queries/container-units-typed-om-expected.txt:
     15
    1162022-03-17  Matt Woodrow  <mattwoodrow@apple.com>
    217

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-units-animation-expected.txt

    r291293 r291474  
    11
    2 FAIL Animation using cqw unit assert_equals: expected "60px" but got "auto"
    3 FAIL Animation using cqw unit responds to changing container size assert_equals: expected "60px" but got "auto"
    4 FAIL Animation using cqh unit assert_equals: expected "60px" but got "auto"
    5 FAIL Animation using cqh unit responds to changing container size assert_equals: expected "60px" but got "auto"
    6 FAIL Animation using cqi unit assert_equals: expected "60px" but got "auto"
    7 FAIL Animation using cqi unit responds to changing container size assert_equals: expected "60px" but got "auto"
    8 FAIL Animation using cqb unit assert_equals: expected "60px" but got "auto"
    9 FAIL Animation using cqb unit responds to changing container size assert_equals: expected "60px" but got "auto"
    10 FAIL Animation using cqmin unit assert_equals: expected "60px" but got "auto"
    11 FAIL Animation using cqmin unit responds to changing container size assert_equals: expected "60px" but got "auto"
    12 FAIL Animation using cqmax unit assert_equals: expected "60px" but got "auto"
    13 FAIL Animation using cqmax unit responds to changing container size assert_equals: expected "60px" but got "auto"
     2PASS Animation using cqw unit
     3FAIL Animation using cqw unit responds to changing container size assert_equals: expected "90px" but got "60px"
     4PASS Animation using cqh unit
     5FAIL Animation using cqh unit responds to changing container size assert_equals: expected "90px" but got "60px"
     6PASS Animation using cqi unit
     7FAIL Animation using cqi unit responds to changing container size assert_equals: expected "90px" but got "60px"
     8PASS Animation using cqb unit
     9FAIL Animation using cqb unit responds to changing container size assert_equals: expected "90px" but got "60px"
     10PASS Animation using cqmin unit
     11FAIL Animation using cqmin unit responds to changing container size assert_equals: expected "90px" but got "60px"
     12PASS Animation using cqmax unit
     13FAIL Animation using cqmax unit responds to changing container size assert_equals: expected "90px" but got "60px"
    1414

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-units-basic-expected.txt

    r288465 r291474  
    11Test
    22
    3 FAIL Container relative units assert_equals: expected "3px" but got "0px"
    4 FAIL Container relative units in math functions assert_equals: expected "30px" but got "0px"
     3PASS Container relative units
     4PASS Container relative units in math functions
    55

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-units-computational-independence-expected.txt

    r291293 r291474  
    11
    2 PASS Container relative unit cqw is not computationally independent
    3 PASS Container relative unit cqh is not computationally independent
    4 PASS Container relative unit cqi is not computationally independent
    5 PASS Container relative unit cqb is not computationally independent
    6 PASS Container relative unit cqmin is not computationally independent
    7 PASS Container relative unit cqmax is not computationally independent
     2FAIL Container relative unit cqw is not computationally independent assert_throws_dom: function "() => {
     3        CSS.registerProperty({ name: '--x', inherits: false, syntax: '<length>', initialValue: `1${unit}` });
     4      }" did not throw
     5FAIL Container relative unit cqh is not computationally independent assert_throws_dom: function "() => {
     6        CSS.registerProperty({ name: '--x', inherits: false, syntax: '<length>', initialValue: `1${unit}` });
     7      }" threw object "InvalidModificationError: This property has already been registered." that is not a DOMException SyntaxError: property "code" is equal to 13, expected 12
     8FAIL Container relative unit cqi is not computationally independent assert_throws_dom: function "() => {
     9        CSS.registerProperty({ name: '--x', inherits: false, syntax: '<length>', initialValue: `1${unit}` });
     10      }" threw object "InvalidModificationError: This property has already been registered." that is not a DOMException SyntaxError: property "code" is equal to 13, expected 12
     11FAIL Container relative unit cqb is not computationally independent assert_throws_dom: function "() => {
     12        CSS.registerProperty({ name: '--x', inherits: false, syntax: '<length>', initialValue: `1${unit}` });
     13      }" threw object "InvalidModificationError: This property has already been registered." that is not a DOMException SyntaxError: property "code" is equal to 13, expected 12
     14FAIL Container relative unit cqmin is not computationally independent assert_throws_dom: function "() => {
     15        CSS.registerProperty({ name: '--x', inherits: false, syntax: '<length>', initialValue: `1${unit}` });
     16      }" threw object "InvalidModificationError: This property has already been registered." that is not a DOMException SyntaxError: property "code" is equal to 13, expected 12
     17FAIL Container relative unit cqmax is not computationally independent assert_throws_dom: function "() => {
     18        CSS.registerProperty({ name: '--x', inherits: false, syntax: '<length>', initialValue: `1${unit}` });
     19      }" threw object "InvalidModificationError: This property has already been registered." that is not a DOMException SyntaxError: property "code" is equal to 13, expected 12
    820

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-units-invalidation-expected.txt

    r291293 r291474  
    11Test
    22
    3 FAIL cqi respond when selected container changes type (inline-size -> none) assert_equals: expected "30px" but got "0px"
    4 FAIL cqb respond when selected container changes type (size -> none) assert_equals: expected "40px" but got "0px"
    5 FAIL cqb respond when intermediate container changes type (inline-size -> size) assert_equals: expected "40px" but got "0px"
    6 FAIL cqi respond when selected container changes inline-size assert_equals: expected "30px" but got "0px"
    7 FAIL cqb respond when selected container changes block-size assert_equals: expected "40px" but got "0px"
     3FAIL cqi respond when selected container changes type (inline-size -> none) assert_equals: expected "50px" but got "30px"
     4FAIL cqb respond when selected container changes type (size -> none) assert_equals: expected "60px" but got "40px"
     5FAIL cqb respond when intermediate container changes type (inline-size -> size) assert_equals: expected "20px" but got "40px"
     6FAIL cqi respond when selected container changes inline-size assert_equals: expected "5px" but got "30px"
     7FAIL cqb respond when selected container changes block-size assert_equals: expected "5px" but got "40px"
    88

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-units-selection-expected.txt

    r288465 r291474  
    11Test
    22
    3 FAIL Container units select the proper container assert_equals: expected "10px" but got "0px"
    4 FAIL Units respond to the writing-mode of the element assert_equals: expected "30px" but got "0px"
     3FAIL Container units select the proper container assert_equals: expected "30px" but got "10px"
     4FAIL Units respond to the writing-mode of the element assert_equals: expected "40px" but got "30px"
    55

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-units-small-viewport-fallback-expected.txt

    r291036 r291474  
    11
    22
    3 FAIL Use small viewport size as fallback assert_equals: expected "7px" but got "auto"
     3PASS Use small viewport size as fallback
    44

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-contain/container-queries/container-units-typed-om-expected.txt

    r291293 r291474  
    11
    22FAIL CSS.cqw function func is not a function. (In 'func(10)', 'func' is undefined)
    3 FAIL Reify value with cqw unit null is not an object (evaluating 'value.value')
     3FAIL Reify value with cqw unit assert_equals: expected (number) 10 but got (undefined) undefined
    44FAIL Set value with cqw unit (string) element.attributeStyleMap.set is not a function. (In 'element.attributeStyleMap.set('top', `10${unit}`)', 'element.attributeStyleMap.set' is undefined)
    55FAIL Set value with cqw unit (CSS.cqw) func is not a function. (In 'func(10)', 'func' is undefined)
    66FAIL CSS.cqh function func is not a function. (In 'func(10)', 'func' is undefined)
    7 FAIL Reify value with cqh unit null is not an object (evaluating 'value.value')
     7FAIL Reify value with cqh unit assert_equals: expected (number) 10 but got (undefined) undefined
    88FAIL Set value with cqh unit (string) element.attributeStyleMap.set is not a function. (In 'element.attributeStyleMap.set('top', `10${unit}`)', 'element.attributeStyleMap.set' is undefined)
    99FAIL Set value with cqh unit (CSS.cqh) func is not a function. (In 'func(10)', 'func' is undefined)
    1010FAIL CSS.cqi function func is not a function. (In 'func(10)', 'func' is undefined)
    11 FAIL Reify value with cqi unit null is not an object (evaluating 'value.value')
     11FAIL Reify value with cqi unit assert_equals: expected (number) 10 but got (undefined) undefined
    1212FAIL Set value with cqi unit (string) element.attributeStyleMap.set is not a function. (In 'element.attributeStyleMap.set('top', `10${unit}`)', 'element.attributeStyleMap.set' is undefined)
    1313FAIL Set value with cqi unit (CSS.cqi) func is not a function. (In 'func(10)', 'func' is undefined)
    1414FAIL CSS.cqb function func is not a function. (In 'func(10)', 'func' is undefined)
    15 FAIL Reify value with cqb unit null is not an object (evaluating 'value.value')
     15FAIL Reify value with cqb unit assert_equals: expected (number) 10 but got (undefined) undefined
    1616FAIL Set value with cqb unit (string) element.attributeStyleMap.set is not a function. (In 'element.attributeStyleMap.set('top', `10${unit}`)', 'element.attributeStyleMap.set' is undefined)
    1717FAIL Set value with cqb unit (CSS.cqb) func is not a function. (In 'func(10)', 'func' is undefined)
    1818FAIL CSS.cqmin function func is not a function. (In 'func(10)', 'func' is undefined)
    19 FAIL Reify value with cqmin unit null is not an object (evaluating 'value.value')
     19FAIL Reify value with cqmin unit assert_equals: expected (number) 10 but got (undefined) undefined
    2020FAIL Set value with cqmin unit (string) element.attributeStyleMap.set is not a function. (In 'element.attributeStyleMap.set('top', `10${unit}`)', 'element.attributeStyleMap.set' is undefined)
    2121FAIL Set value with cqmin unit (CSS.cqmin) func is not a function. (In 'func(10)', 'func' is undefined)
    2222FAIL CSS.cqmax function func is not a function. (In 'func(10)', 'func' is undefined)
    23 FAIL Reify value with cqmax unit null is not an object (evaluating 'value.value')
     23FAIL Reify value with cqmax unit assert_equals: expected (number) 10 but got (undefined) undefined
    2424FAIL Set value with cqmax unit (string) element.attributeStyleMap.set is not a function. (In 'element.attributeStyleMap.set('top', `10${unit}`)', 'element.attributeStyleMap.set' is undefined)
    2525FAIL Set value with cqmax unit (CSS.cqmax) func is not a function. (In 'func(10)', 'func' is undefined)

  • trunk/Source/WebCore/ChangeLog

    r291473 r291474  
     12022-03-18  Antti Koivisto  <antti@apple.com>
     2
     3        [CSS Container Queries] Basic support for container units
     4        https://bugs.webkit.org/show_bug.cgi?id=238021
     5
     6        Reviewed by Antoine Quint.
     7
     8        Container Relative Lengths: the cqw, cqh, cqi, cqb, cqmin, cqmax units
     9        https://drafts.csswg.org/css-contain-3/#container-lengths
     10
     11        * css/CSSPrimitiveValue.cpp:
     12        (WebCore::isValidCSSUnitTypeForDoubleConversion):
     13        (WebCore::isStringType):
     14        (WebCore::CSSPrimitiveValue::cleanup):
     15        (WebCore::CSSPrimitiveValue::computeNonCalcLengthDouble):
     16
     17        Resolve container units by resolving the query container and computing the value against it.
     18
     19        (WebCore::CSSPrimitiveValue::unitTypeString):
     20        (WebCore::CSSPrimitiveValue::formatNumberForCustomCSSText const):
     21        (WebCore::CSSPrimitiveValue::equals const):
     22        * css/CSSPrimitiveValue.h:
     23        (WebCore::CSSPrimitiveValue::isLength):
     24        * css/CSSToLengthConversionData.cpp:
     25        (WebCore::CSSToLengthConversionData::CSSToLengthConversionData):
     26        * css/CSSToLengthConversionData.h:
     27        (WebCore::CSSToLengthConversionData::element const):
     28        * css/CSSUnits.cpp:
     29        (WebCore::unitCategory):
     30        (WebCore::operator<<):
     31        * css/CSSUnits.h:
     32        * css/ContainerQuery.h:
     33        * css/calc/CSSCalcCategoryMapping.cpp:
     34        (WebCore::calcUnitCategory):
     35        (WebCore::calculationCategoryForCombination):
     36        (WebCore::hasDoubleValue):
     37        * css/parser/CSSParserToken.cpp:
     38        (WebCore::cssPrimitiveValueUnitFromTrie):
     39
     40        Parsing support.
     41
     42        * css/parser/CSSPropertyParserHelpers.cpp:
     43        (WebCore::CSSPropertyParserHelpers::LengthRawKnownTokenTypeDimensionConsumer::consume):
     44        * style/ContainerQueryEvaluator.cpp:
     45        (WebCore::Style::ContainerQueryEvaluator::selectContainer const):
     46        (WebCore::Style::ContainerQueryEvaluator::selectContainer):
     47
     48        Factor container selection into static function that can be used from the unit resolution code.
     49
     50        * style/ContainerQueryEvaluator.h:
     51        * style/SelectorMatchingState.h:
     52
    1532022-03-18  Carlos Garcia Campos  <cgarcia@igalia.com>
    254

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

    r289997 r291474  
    3636#include "Color.h"
    3737#include "ColorSerialization.h"
     38#include "ContainerQueryEvaluator.h"
    3839#include "Counter.h"
    3940#include "DeprecatedCSSOMPrimitiveValue.h"
    … …  
    114115    case CSSUnitType::CSS_DPPX:
    115116    case CSSUnitType::CSS_X:
     117    case CSSUnitType::CSS_CQW:
     118    case CSSUnitType::CSS_CQH:
     119    case CSSUnitType::CSS_CQI:
     120    case CSSUnitType::CSS_CQB:
     121    case CSSUnitType::CSS_CQMIN:
     122    case CSSUnitType::CSS_CQMAX:
    116123        return true;
    117124    case CSSUnitType::CSS_ATTR:
    … …  
    222229    case CSSUnitType::CSS_VMIN:
    223230    case CSSUnitType::CSS_VW:
     231    case CSSUnitType::CSS_CQW:
     232    case CSSUnitType::CSS_CQH:
     233    case CSSUnitType::CSS_CQI:
     234    case CSSUnitType::CSS_CQB:
     235    case CSSUnitType::CSS_CQMIN:
     236    case CSSUnitType::CSS_CQMAX:
    224237        return false;
    225238    }
    … …  
    607620    case CSSUnitType::CSS_PROPERTY_ID:
    608621    case CSSUnitType::CSS_VALUE_ID:
     622    case CSSUnitType::CSS_CQW:
     623    case CSSUnitType::CSS_CQH:
     624    case CSSUnitType::CSS_CQI:
     625    case CSSUnitType::CSS_CQB:
     626    case CSSUnitType::CSS_CQMIN:
     627    case CSSUnitType::CSS_CQMAX:
    609628        ASSERT(!isStringType(type));
    610629        break;
    … …  
    804823double CSSPrimitiveValue::computeNonCalcLengthDouble(const CSSToLengthConversionData& conversionData, CSSUnitType primitiveType, double value)
    805824{
     825    auto selectContainerRenderer = [&](CQ::Axis axis) -> const RenderBox* {
     826        if (!conversionData.element())
     827            return nullptr;
     828        // FIXME: Use cached query containers when available.
     829        auto* container = Style::ContainerQueryEvaluator::selectContainer(axis, nullString(), *conversionData.element(), nullptr);
     830        if (!container)
     831            return nullptr;
     832        return dynamicDowncast<RenderBox>(container->renderer());
     833    };
     834
    806835    switch (primitiveType) {
    807836    case CSSUnitType::CSS_EMS:
    … …  
    921950            value *= conversionData.style()->computedLineHeight();
    922951        break;
     952
     953    case CSSUnitType::CSS_CQW: {
     954        if (auto* containerRenderer = selectContainerRenderer(CQ::Axis::Width))
     955            return containerRenderer->width() * value / 100;
     956        return value * conversionData.smallViewportFactor().width();
     957    }
     958
     959    case CSSUnitType::CSS_CQH: {
     960        if (auto* containerRenderer = selectContainerRenderer(CQ::Axis::Height))
     961            return containerRenderer->height() * value / 100;
     962        return value * conversionData.smallViewportFactor().height();
     963    }
     964
     965    case CSSUnitType::CSS_CQI: {
     966        if (auto* containerRenderer = selectContainerRenderer(CQ::Axis::Inline))
     967            return containerRenderer->logicalWidth() * value / 100;
     968        return value * lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis::Inline, conversionData.smallViewportFactor(), conversionData.rootStyle());
     969    }
     970
     971    case CSSUnitType::CSS_CQB: {
     972        if (auto* containerRenderer = selectContainerRenderer(CQ::Axis::Block))
     973            return containerRenderer->logicalHeight() * value / 100;
     974        return value * lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis::Block, conversionData.smallViewportFactor(), conversionData.rootStyle());
     975    }
     976
     977    case CSSUnitType::CSS_CQMAX:
     978        return std::max(computeNonCalcLengthDouble(conversionData, CSSUnitType::CSS_CQB, value), computeNonCalcLengthDouble(conversionData, CSSUnitType::CSS_CQI, value));
     979
     980    case CSSUnitType::CSS_CQMIN:
     981        return std::min(computeNonCalcLengthDouble(conversionData, CSSUnitType::CSS_CQB, value), computeNonCalcLengthDouble(conversionData, CSSUnitType::CSS_CQI, value));
    923982
    924983    case CSSUnitType::CSS_RLHS:
    … …  
    12251284        case CSSUnitType::CSS_CHS: return "ch";
    12261285        case CSSUnitType::CSS_IC: return "ic";
     1286        case CSSUnitType::CSS_CQW: return "cqw";
     1287        case CSSUnitType::CSS_CQH: return "cqh";
     1288        case CSSUnitType::CSS_CQI: return "cqi";
     1289        case CSSUnitType::CSS_CQB: return "cqb";
     1290        case CSSUnitType::CSS_CQMAX: return "cqmax";
     1291        case CSSUnitType::CSS_CQMIN: return "cqmin";
    12271292
    12281293        case CSSUnitType::CSS_UNKNOWN:
    … …  
    13221387    case CSSUnitType::CSS_RLHS:
    13231388        return formatNumberValue("rlh");
     1389    case CSSUnitType::CSS_CQW:
     1390        return formatNumberValue("cqw");
     1391    case CSSUnitType::CSS_CQH:
     1392        return formatNumberValue("cqh");
     1393    case CSSUnitType::CSS_CQI:
     1394        return formatNumberValue("cqi");
     1395    case CSSUnitType::CSS_CQB:
     1396        return formatNumberValue("cqb");
     1397    case CSSUnitType::CSS_CQMAX:
     1398        return formatNumberValue("cqmax");
     1399    case CSSUnitType::CSS_CQMIN:
     1400        return formatNumberValue("cqmin");
    13241401    case CSSUnitType::CSS_DIMENSION:
    13251402        // FIXME: This isn't correct.
    … …  
    15111588    case CSSUnitType::CSS_RLHS:
    15121589    case CSSUnitType::CSS_DIMENSION:
     1590    case CSSUnitType::CSS_CQW:
     1591    case CSSUnitType::CSS_CQH:
     1592    case CSSUnitType::CSS_CQI:
     1593    case CSSUnitType::CSS_CQB:
     1594    case CSSUnitType::CSS_CQMIN:
     1595    case CSSUnitType::CSS_CQMAX:
    15131596        return m_value.num == other.m_value.num;
    15141597    case CSSUnitType::CSS_PROPERTY_ID:

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

    r288245 r291474  
    315315        || type == CSSUnitType::CSS_LHS
    316316        || type == CSSUnitType::CSS_RLHS
     317        || type == CSSUnitType::CSS_CQW
     318        || type == CSSUnitType::CSS_CQH
     319        || type == CSSUnitType::CSS_CQI
     320        || type == CSSUnitType::CSS_CQB
     321        || type == CSSUnitType::CSS_CQMIN
     322        || type == CSSUnitType::CSS_CQMAX
    317323        || isViewportPercentageLength(type)
    318324        || type == CSSUnitType::CSS_QUIRKY_EMS;

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

    r291398 r291474  
    4444    , m_parentStyle(&builderContext.parentStyle)
    4545    , m_renderView(builderContext.document->renderView())
     46    , m_element(builderContext.element)
    4647    , m_viewportDependencyDetectionStyle(const_cast<RenderStyle*>(m_style))
    4748{

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

    r291398 r291474  
    3737namespace WebCore {
    3838
     39class Element;
    3940class FloatSize;
    4041class RenderStyle;
    … …  
    6263    CSSPropertyID propertyToCompute() const { return m_propertyToCompute.value_or(CSSPropertyInvalid); }
    6364    const RenderView* renderView() const { return m_renderView; }
     65    const Element* element() const { return m_element.get(); }
    6466
    6567    FloatSize defaultViewportFactor() const;
    … …  
    9799    const RenderStyle* m_parentStyle { nullptr };
    98100    const RenderView* m_renderView { nullptr };
     101    RefPtr<const Element> m_element;
    99102    std::optional<float> m_zoom;
    100103    std::optional<CSSPropertyID> m_propertyToCompute;

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

    r289997 r291474  
    7272    case CSSUnitType::CSS_DVB:
    7373    case CSSUnitType::CSS_DVI:
     74    case CSSUnitType::CSS_CQW:
     75    case CSSUnitType::CSS_CQH:
     76    case CSSUnitType::CSS_CQI:
     77    case CSSUnitType::CSS_CQB:
     78    case CSSUnitType::CSS_CQMIN:
     79    case CSSUnitType::CSS_CQMAX:
    7480        return CSSUnitCategory::Length;
    7581    case CSSUnitType::CSS_MS:
    … …  
    225231    case CSSUnitType::CSS_LHS: ts << "lh"; break;
    226232    case CSSUnitType::CSS_RLHS: ts << "rlh"; break;
     233    case CSSUnitType::CSS_CQW: ts << "cqw"; break;
     234    case CSSUnitType::CSS_CQH: ts << "cqh"; break;
     235    case CSSUnitType::CSS_CQI: ts << "cqi"; break;
     236    case CSSUnitType::CSS_CQB: ts << "cqb"; break;
     237    case CSSUnitType::CSS_CQMAX: ts << "cqmax"; break;
     238    case CSSUnitType::CSS_CQMIN: ts << "cqmin"; break;
    227239    case CSSUnitType::CSS_PAIR: ts << "pair"; break;
    228240    case CSSUnitType::CSS_UNICODE_RANGE: ts << "unicode_range"; break;

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

    r287909 r291474  
    8585    LastViewporCSSUnitType = CSS_DVI,
    8686
     87    CSS_CQW,
     88    CSS_CQH,
     89    CSS_CQI,
     90    CSS_CQB,
     91    CSS_CQMIN,
     92    CSS_CQMAX,
     93
    8794    CSS_DPPX,
    8895    CSS_X,

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

    r291113 r291474  
    2525#pragma once
    2626
     27#include <wtf/Forward.h>
    2728#include <wtf/OptionSet.h>
    2829#include <wtf/text/AtomString.h>
    … …  
    3132
    3233class CSSValue;
     34class Element;
    3335
    3436namespace CQ {
    … …  
    9496};
    9597
     98using CachedQueryContainers = Vector<Ref<const Element>>;
     99
    96100}

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

    r289997 r291474  
    7676    case CSSUnitType::CSS_DVB:
    7777    case CSSUnitType::CSS_DVI:
     78    case CSSUnitType::CSS_CQW:
     79    case CSSUnitType::CSS_CQH:
     80    case CSSUnitType::CSS_CQI:
     81    case CSSUnitType::CSS_CQB:
     82    case CSSUnitType::CSS_CQMIN:
     83    case CSSUnitType::CSS_CQMAX:
    7884        return CalculationCategory::Length;
    7985    case CSSUnitType::CSS_PERCENTAGE:
    … …  
    153159    case CSSUnitType::CSS_DVB:
    154160    case CSSUnitType::CSS_DVI:
     161    case CSSUnitType::CSS_CQW:
     162    case CSSUnitType::CSS_CQH:
     163    case CSSUnitType::CSS_CQI:
     164    case CSSUnitType::CSS_CQB:
     165    case CSSUnitType::CSS_CQMIN:
     166    case CSSUnitType::CSS_CQMAX:
    155167    default:
    156168        return CalculationCategory::Other;
    … …  
    234246    case CSSUnitType::CSS_LHS:
    235247    case CSSUnitType::CSS_RLHS:
     248    case CSSUnitType::CSS_CQW:
     249    case CSSUnitType::CSS_CQH:
     250    case CSSUnitType::CSS_CQI:
     251    case CSSUnitType::CSS_CQB:
     252    case CSSUnitType::CSS_CQMIN:
     253    case CSSUnitType::CSS_CQMAX:
    236254        return true;
    237255    case CSSUnitType::CSS_UNKNOWN:

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

    r286458 r291474  
    129129    case 3:
    130130        switch (toASCIILower(data[0])) {
     131        case 'c':
     132            if (toASCIILower(data[1]) == 'q') {
     133                switch (toASCIILower(data[2])) {
     134                case 'b':
     135                    return CSSUnitType::CSS_CQB;
     136                case 'h':
     137                    return CSSUnitType::CSS_CQH;
     138                case 'i':
     139                    return CSSUnitType::CSS_CQI;
     140                case 'w':
     141                    return CSSUnitType::CSS_CQW;
     142                }
     143            }
     144            break;
    131145        case 'd':
    132146            switch (toASCIILower(data[1])) {
    … …  
    252266            if (toASCIILower(data[1]) == '_' && toASCIILower(data[2]) == 'q' && toASCIILower(data[3]) == 'e' && toASCIILower(data[4]) == 'm')
    253267                return CSSUnitType::CSS_QUIRKY_EMS;
     268            break;
     269        case 'c':
     270            if (toASCIILower(data[1]) == 'q' && toASCIILower(data[2]) == 'm') {
     271                switch (toASCIILower(data[3])) {
     272                case 'a':
     273                    if (toASCIILower(data[4]) == 'x')
     274                        return CSSUnitType::CSS_CQMAX;
     275                    break;
     276                case 'i':
     277                    if (toASCIILower(data[4]) == 'n')
     278                        return CSSUnitType::CSS_CQMIN;
     279                    break;
     280                }
     281            }
    254282            break;
    255283        case 'd':

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

    r291046 r291474  
    520520        case CSSUnitType::CSS_DVI:
    521521        case CSSUnitType::CSS_Q:
     522        case CSSUnitType::CSS_CQW:
     523        case CSSUnitType::CSS_CQH:
     524        case CSSUnitType::CSS_CQI:
     525        case CSSUnitType::CSS_CQB:
     526        case CSSUnitType::CSS_CQMIN:
     527        case CSSUnitType::CSS_CQMAX:
    522528            break;
    523529        default:

  • trunk/Source/WebCore/style/ContainerQueryEvaluator.cpp

    r291398 r291474  
    7979    };
    8080
     81    auto* cachedQueryContainers = m_selectorMatchingState ? &m_selectorMatchingState->queryContainers : nullptr;
     82
     83    auto* container = selectContainer(filteredContainerQuery.axisFilter, filteredContainerQuery.nameFilter, m_element.get(), cachedQueryContainers, m_pseudoId);
     84    if (!container)
     85        return { };
     86
     87    return makeSelectedContainer(*container);
     88}
     89
     90const Element* ContainerQueryEvaluator::selectContainer(OptionSet<CQ::Axis> axes, const String& name, const Element& element, const CachedQueryContainers* cachedQueryContainers, PseudoId pseudoId)
     91{
     92    // "For each element, the query container to be queried is selected from among the element’s
     93    // ancestor query containers that have a valid container-type for all the container features
     94    // in the <container-condition>. The optional <container-name> filters the set of query containers
     95    // considered to just those with a matching query container name."
     96    // https://drafts.csswg.org/css-contain-3/#container-rule
     97
    8198    auto isValidContainerForRequiredAxes = [&](ContainerType containerType, const RenderElement* principalBox) {
    8299        switch (containerType) {
    … …  
    87104            if (!principalBox)
    88105                return true;
    89             if (filteredContainerQuery.axisFilter.contains(CQ::Axis::Block))
     106            if (axes.contains(CQ::Axis::Block))
    90107                return false;
    91             return !filteredContainerQuery.axisFilter.contains(principalBox->isHorizontalWritingMode() ? CQ::Axis::Height : CQ::Axis::Width);
     108            return !axes.contains(principalBox->isHorizontalWritingMode() ? CQ::Axis::Height : CQ::Axis::Width);
    92109        case ContainerType::None:
    93110            return false;
    … …  
    102119        if (!isValidContainerForRequiredAxes(style->containerType(), element.renderer()))
    103120            return false;
    104         if (filteredContainerQuery.nameFilter.isEmpty())
     121        if (name.isEmpty())
    105122            return true;
    106         return style->containerNames().contains(filteredContainerQuery.nameFilter);
    107     };
    108 
    109     if (m_selectorMatchingState) {
    110         for (auto& container : makeReversedRange(m_selectorMatchingState->queryContainers)) {
     123        return style->containerNames().contains(name);
     124    };
     125
     126    if (cachedQueryContainers) {
     127        for (auto& container : makeReversedRange(*cachedQueryContainers)) {
    111128            if (isContainerForQuery(container))
    112                 return makeSelectedContainer(container);
     129                return container.ptr();
    113130        }
    114131        return { };
    115132    }
    116133
    117     if (m_pseudoId != PseudoId::None) {
    118         if (isContainerForQuery(m_element))
    119             return makeSelectedContainer(m_element);
    120     }
    121 
    122     for (auto& ancestor : composedTreeAncestors(const_cast<Element&>(m_element.get()))) {
     134    if (pseudoId != PseudoId::None) {
     135        if (isContainerForQuery(element))
     136            return &element;
     137    }
     138
     139    for (auto& ancestor : composedTreeAncestors(const_cast<Element&>(element))) {
    123140        if (isContainerForQuery(ancestor))
    124             return makeSelectedContainer(ancestor);
     141            return &ancestor;
    125142    }
    126143    return { };

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

    r291098 r291474  
    4343    bool evaluate(const FilteredContainerQuery&) const;
    4444
     45    static const Element* selectContainer(OptionSet<CQ::Axis>, const String& name, const Element&, const CachedQueryContainers*, PseudoId = PseudoId::None);
     46
    4547private:
    4648    struct SelectedContainer;

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

    r288813 r291474  
    2525#pragma once
    2626
     27#include "ContainerQuery.h"
    2728#include "HasSelectorFilter.h"
    2829#include "SelectorFilter.h"
    … …  
    3940    SelectorFilter selectorFilter;
    4041
    41     Vector<Ref<const Element>> queryContainers;
     42    CachedQueryContainers queryContainers;
    4243
    4344    HashMap<HasPseudoClassCacheKey, HasPseudoClassMatch> hasPseudoClassMatchCache;
Note: See TracChangeset for help on using the changeset viewer.