Changeset 273435 in webkit


Ignore:
Timestamp:
Feb 24, 2021 1:35:41 PM (17 months ago)
Author:
commit-queue@webkit.org
Message:

[css-grid] Fix min/max widths of grid affected by ancestor
​https://bugs.webkit.org/show_bug.cgi?id=222100

Patch by Ziran Sun <Ziran Sun> on 2021-02-24
Reviewed by Javier Fernandez.

LayoutTests/imported/w3c:

Updated test expectation files.

  • web-platform-tests/css/css-grid/grid-items/grid-items-percentage-paddings-002-expected.txt:
  • web-platform-tests/css/css-grid/grid-items/grid-items-percentage-paddings-vertical-lr-002-expected.txt:
  • web-platform-tests/css/css-grid/grid-items/grid-items-percentage-paddings-vertical-rl-002-expected.txt:

Source/WebCore:

We need to recalculate min/max widths of child that depend on the ancestor.
Before update logical-width, for element that needs preferredWidth recalcution,
it is necessary to make sure that min/max widths are set dirty.

This change is an import of chromium CL at
​https://chromium-review.googlesource.com/c/chromium/src/+/527640/
Only the parts that apply to this issue are imported.

Tests were already imported in WPT.

  • rendering/RenderBox.cpp:

(WebCore::shouldRecalculateMinMaxWidthsAffectedByAncestor):
(WebCore::RenderBox::updateLogicalWidth):

Location:
trunk
Files:
6 edited

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/imported/w3c/ChangeLog

    r273381 r273435  
     12021-02-24  Ziran Sun  <zsun@igalia.com>
     2
     3        [css-grid] Fix min/max widths of grid affected by ancestor
     4        https://bugs.webkit.org/show_bug.cgi?id=222100
     5
     6        Reviewed by Javier Fernandez.
     7
     8        Updated test expectation files.
     9
     10        * web-platform-tests/css/css-grid/grid-items/grid-items-percentage-paddings-002-expected.txt:
     11        * web-platform-tests/css/css-grid/grid-items/grid-items-percentage-paddings-vertical-lr-002-expected.txt:
     12        * web-platform-tests/css/css-grid/grid-items/grid-items-percentage-paddings-vertical-rl-002-expected.txt:
     13
    1142021-02-24  Imanol Fernandez  <ifernandez@igalia.com>
    215

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-items/grid-items-percentage-paddings-002-expected.txt

    r267650 r273435  
    11
    2 FAIL .grid 1 assert_equals:
    3 <div class="grid">
    4   <div class="paddingLeft50Percent" data-expected-padding-left="50" data-expected-width="60" data-expected-height="10">X</div>
    5   <div data-offset-x="0" data-offset-y="10" data-expected-width="100" data-expected-height="10"></div>
    6 </div>
    7 width expected 60 but got 50
    8 FAIL .grid 2 assert_equals:
    9 <div class="grid">
    10   <div class="paddingRight50Percent" data-expected-padding-right="50" data-expected-width="60" data-expected-height="10">X</div>
    11   <div data-offset-x="0" data-offset-y="10" data-expected-width="100" data-expected-height="10"></div>
    12 </div>
    13 width expected 60 but got 50
     2PASS .grid 1
     3PASS .grid 2
    144PASS .grid 3
    155PASS .grid 4
    16 FAIL .grid 5 assert_equals:
    17 <div class="grid directionRTL">
    18   <div class="paddingLeft50Percent" data-expected-padding-left="50" data-expected-width="60" data-expected-height="10">X</div>
    19   <div data-offset-x="400" data-offset-y="10" data-expected-width="100" data-expected-height="10"></div>
    20 </div>
    21 width expected 60 but got 50
    22 FAIL .grid 6 assert_equals:
    23 <div class="grid directionRTL">
    24   <div class="paddingRight50Percent" data-expected-padding-right="50" data-expected-width="60" data-expected-height="10">X</div>
    25   <div data-offset-x="400" data-offset-y="10" data-expected-width="100" data-expected-height="10"></div>
    26 </div>
    27 width expected 60 but got 50
     6PASS .grid 5
     7PASS .grid 6
    288PASS .grid 7
    299PASS .grid 8

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-items/grid-items-percentage-paddings-vertical-lr-002-expected.txt

    r267650 r273435  
    22PASS .grid 1
    33PASS .grid 2
    4 FAIL .grid 3 assert_equals:
    5 <div class="grid">
    6   <div class="paddingTop50Percent" data-expected-padding-top="50" data-expected-width="10" data-expected-height="60">X</div>
    7   <div data-offset-x="10" data-offset-y="0" data-expected-width="10" data-expected-height="100"></div>
    8 </div>
    9 height expected 60 but got 50
    10 FAIL .grid 4 assert_equals:
    11 <div class="grid">
    12   <div class="paddingBottom50Percent" data-expected-padding-bottom="50" data-expected-width="10" data-expected-height="60">X</div>
    13   <div data-offset-x="10" data-offset-y="0" data-expected-width="10" data-expected-height="100"></div>
    14 </div>
    15 height expected 60 but got 50
     4PASS .grid 3
     5PASS .grid 4
    166PASS .grid 5
    177PASS .grid 6
    18 FAIL .grid 7 assert_equals:
    19 <div class="grid directionRTL">
    20   <div class="paddingTop50Percent" data-expected-padding-top="50" data-expected-width="10" data-expected-height="60">X</div>
    21   <div data-offset-x="10" data-offset-y="400" data-expected-width="10" data-expected-height="100"></div>
    22 </div>
    23 height expected 60 but got 50
    24 FAIL .grid 8 assert_equals:
    25 <div class="grid directionRTL">
    26   <div class="paddingBottom50Percent" data-expected-padding-bottom="50" data-expected-width="10" data-expected-height="60">X</div>
    27   <div data-offset-x="10" data-offset-y="400" data-expected-width="10" data-expected-height="100"></div>
    28 </div>
    29 height expected 60 but got 50
     8PASS .grid 7
     9PASS .grid 8
    3010Direction LTR
    3111

  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/grid-items/grid-items-percentage-paddings-vertical-rl-002-expected.txt

    r267650 r273435  
    22PASS .grid 1
    33PASS .grid 2
    4 FAIL .grid 3 assert_equals:
    5 <div class="grid">
    6   <div class="paddingTop50Percent" data-expected-padding-top="50" data-expected-width="10" data-expected-height="60">X</div>
    7   <div data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="100"></div>
    8 </div>
    9 height expected 60 but got 50
    10 FAIL .grid 4 assert_equals:
    11 <div class="grid">
    12   <div class="paddingBottom50Percent" data-expected-padding-bottom="50" data-expected-width="10" data-expected-height="60">X</div>
    13   <div data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="100"></div>
    14 </div>
    15 height expected 60 but got 50
     4PASS .grid 3
     5PASS .grid 4
    166PASS .grid 5
    177PASS .grid 6
    18 FAIL .grid 7 assert_equals:
    19 <div class="grid directionRTL">
    20   <div class="paddingTop50Percent" data-expected-padding-top="50" data-expected-width="10" data-expected-height="60">X</div>
    21   <div data-offset-x="0" data-offset-y="400" data-expected-width="10" data-expected-height="100"></div>
    22 </div>
    23 height expected 60 but got 50
    24 FAIL .grid 8 assert_equals:
    25 <div class="grid directionRTL">
    26   <div class="paddingBottom50Percent" data-expected-padding-bottom="50" data-expected-width="10" data-expected-height="60">X</div>
    27   <div data-offset-x="0" data-offset-y="400" data-expected-width="10" data-expected-height="100"></div>
    28 </div>
    29 height expected 60 but got 50
     8PASS .grid 7
     9PASS .grid 8
    3010Direction LTR
    3111

  • trunk/Source/WebCore/ChangeLog

    r273428 r273435  
     12021-02-24  Ziran Sun  <zsun@igalia.com>
     2
     3        [css-grid] Fix min/max widths of grid affected by ancestor
     4        https://bugs.webkit.org/show_bug.cgi?id=222100
     5
     6        Reviewed by Javier Fernandez.
     7
     8        We need to recalculate min/max widths of child that depend on the ancestor.
     9        Before update logical-width, for element that needs preferredWidth recalcution,
     10        it is necessary to make sure that min/max widths are set dirty.
     11
     12        This change is an import of chromium CL at
     13        https://chromium-review.googlesource.com/c/chromium/src/+/527640/
     14        Only the parts that apply to this issue are imported.
     15
     16        Tests were already imported in WPT.       
     17
     18        * rendering/RenderBox.cpp:
     19        (WebCore::shouldRecalculateMinMaxWidthsAffectedByAncestor):
     20        (WebCore::RenderBox::updateLogicalWidth):
     21
    1222021-02-24  Michael Catanzaro  <mcatanzaro@gnome.org>
    223

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

    r273206 r273435  
    24762476}
    24772477
     2478static bool shouldRecalculateMinMaxWidthsAffectedByAncestor(const RenderBox* box)
     2479{
     2480    // If the preferred widths are already dirty at this point (during layout), it actually means that we never need to calculate them, since that should
     2481    // have been carried out by an ancestor that's sized based on preferred widths (a shrink-to-fit container, for instance). In such cases the
     2482    // object will be left as dirty indefinitely, and it would just be a waste of time to calculate the preferred withs when nobody needs them.
     2483    if (box->preferredLogicalWidthsDirty())
     2484        return false;
     2485    // If our containing block also has min/max widths that are affected by the ancestry, we have already dealt with this object as well. Avoid
     2486    // unnecessary work and O(n^2) time complexity.
     2487    if (const RenderBox* cb = box->containingBlock()) {
     2488        if (cb->needsPreferredWidthsRecalculation() && !cb->preferredLogicalWidthsDirty())
     2489            return false;
     2490    }
     2491    return true;
     2492}
     2493
    24782494void RenderBox::updateLogicalWidth()
    24792495{
     2496    // Laying out this object means that its containing block is also being laid out. This object is special, in that its min/max widths depend on
     2497    // the ancestry (min/max width calculation should ideally be strictly bottom-up, but that's not always the case), so since the containing
     2498    // block size may have changed, we need to recalculate the min/max widths of this object, and every child that has the same issue, recursively.
     2499    if (needsPreferredWidthsRecalculation() && shouldRecalculateMinMaxWidthsAffectedByAncestor(this)) {
     2500        setPreferredLogicalWidthsDirty(true, MarkOnlyThis);
     2501        const_cast<RenderBox&>(*this).computePreferredLogicalWidths();
     2502    }
     2503
    24802504    LogicalExtentComputedValues computedValues;
    24812505    computeLogicalWidthInFragment(computedValues);
Note: See TracChangeset for help on using the changeset viewer.