Changeset 207457 in webkit


Ignore:
Timestamp:
Oct 18, 2016 2:21:58 AM (8 years ago)
Author:
svillar@igalia.com
Message:

[css-grid] Constrain by min|max-height on auto repeat computation
​https://bugs.webkit.org/show_bug.cgi?id=163540

Reviewed by Darin Adler.

Source/WebCore:

The max-height (if definite) is used to compute the number of auto repeat rows whenever the
height is indefinite. We were using the min-height only in case both values were indefinite.

Although not explicitly mentioned by grid specs, it's reasonable to assume that
the min-height trumps the used value of height/max-height like it always does, per CSS
2.2. Note that the number of rows still needs to fit within that size even if using
min-height, because we're just using min-height to compute the used value of the height
property. If both height and max-height are indefinite we keep doing the same, i.e., compute
the minimum number of rows that fulfill min-height (if definite).

  • rendering/RenderGrid.cpp:

(WebCore::RenderGrid::computeAutoRepeatTracksCount):

LayoutTests:

Some new test cases to verify that min-height is used on the auto repeat tracks computation
whenever the height is indefinite and max-height is not.

  • fast/css-grid-layout/grid-auto-fill-rows-expected.txt:
  • fast/css-grid-layout/grid-auto-fill-rows.html:
  • fast/css-grid-layout/grid-indefinite-size-auto-repeat-crash-expected.txt:
  • fast/css-grid-layout/grid-indefinite-size-auto-repeat-crash.html:
Location:
trunk
Files:
7 edited

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/ChangeLog

    r207447 r207457  
     12016-10-17  Sergio Villar Senin  <svillar@igalia.com>
     2
     3        [css-grid] Constrain by min|max-height on auto repeat computation
     4        https://bugs.webkit.org/show_bug.cgi?id=163540
     5
     6        Reviewed by Darin Adler.
     7
     8        Some new test cases to verify that min-height is used on the auto repeat tracks computation
     9        whenever the height is indefinite and max-height is not.
     10
     11        * fast/css-grid-layout/grid-auto-fill-rows-expected.txt:
     12        * fast/css-grid-layout/grid-auto-fill-rows.html:
     13        * fast/css-grid-layout/grid-indefinite-size-auto-repeat-crash-expected.txt:
     14        * fast/css-grid-layout/grid-indefinite-size-auto-repeat-crash.html:
     15
    1162016-10-17  Megan Gardner  <megan_gardner@apple.com>
    217

  • trunk/LayoutTests/fast/css-grid-layout/grid-auto-fill-rows-expected.txt

    r203717 r207457  
    3030PASS
    3131PASS
     32PASS
     33PASS

  • trunk/LayoutTests/fast/css-grid-layout/grid-auto-fill-rows.html

    r203717 r207457  
    2424.gridMultipleTracks { grid-template-rows: [start] 20px repeat(auto-fill, [a] 2em [b c] 10% [d]) [e] minmax(75px, 1fr) [last]; }
    2525
    26 .item { background-color: cyan; }
     26.item { background-color: blue; }
     27.item:nth-child(2) { background: green; }
     28.item:nth-child(3) { background: orange; }
    2729
    2830.gap { grid-row-gap: 20px; }
    … …  
    5052<div class="grid gridOnlyAutoRepeat gap">
    5153    <div class="item" style="grid-row: autobar 2 / span 3" data-offset-y="100" data-offset-x="0" data-expected-height="257" data-expected-width="25"></div>
     54</div>
     55
     56<div class="grid gridOnlyAutoRepeat gap" style="height: auto; max-height: 90px;" data-expected-height="94" data-expected-width="29">
     57    <div class="item" data-offset-y="0" data-offset-x="0" data-expected-height="30" data-expected-width="25"></div>
     58    <div class="item" data-offset-y="50" data-offset-x="0" data-expected-height="30" data-expected-width="25"></div>
     59    <div class="item" data-offset-y="100" data-offset-x="0" data-expected-height="157" data-expected-width="25"></div>
     60</div>
     61
     62<div class="grid gridOnlyAutoRepeat gap" style="height: auto; max-height: 90px; min-height: 130px;" data-expected-height="134" data-expected-width="29">
     63    <div class="item" data-offset-y="0" data-offset-x="0" data-expected-height="30" data-expected-width="25"></div>
     64    <div class="item" data-offset-y="50" data-offset-x="0" data-expected-height="30" data-expected-width="25"></div>
     65    <div class="item" data-offset-y="100" data-offset-x="0" data-expected-height="30" data-expected-width="25"></div>
    5266</div>
    5367

  • trunk/LayoutTests/fast/css-grid-layout/grid-indefinite-size-auto-repeat-crash-expected.txt

    r205114 r207457  
     1item
     2item
     3item
     4item
     5item
     6item
     7item
     8item
     9item
     10item
    111item
    212item

  • trunk/LayoutTests/fast/css-grid-layout/grid-indefinite-size-auto-repeat-crash.html

    r205114 r207457  
    4343<div class="grid autoFit min-width-max-content min-height-max-content">item</div>
    4444
     45<div class="min-height-max-content min-width-min-content">
     46    <div class="grid autoFill"></div>
     47</div>
     48
     49<div class="max-content">
     50    <div class="grid autoFit"></div>
     51</div>
     52
     53<div class="min-content min-width-min-content">
     54    <div class="grid autoFill"></div>
     55</div>
     56
     57<div class="max-content max-width-min-content">
     58    <div class="grid autoFit"></div>
     59</div>
     60
     61<div class="min-height-max-content min-content">
     62    <div class="grid autoFill"></div>
     63</div>
     64
     65<div class="min-height-min-content max-content">
     66    <div class="grid autoFit"></div>
     67</div>
     68
     69<div class="min-height-max-content min-width-min-content">
     70    <div class="grid autoFill min-width-min-content"></div>
     71</div>
     72
     73<div class="min-height-max-content min-width-min-content">
     74    <div class="grid autoFit min-height-min-content"></div>
     75</div>
     76
     77<div class="max-content min-width-min-content">
     78    <div class="grid autoFill"></div>
     79</div>
     80
     81<div class="max-height-min-content min-content">
     82    <div class="grid autoFit max-height-max-content"></div>
     83</div>
     84
     85<div class="min-height-max-content min-content">
     86    <div class="grid autoFill">item</div>
     87</div>
     88
     89<div class="min-height-min-content max-width-min-content">
     90    <div class="grid autoFit">item</div>
     91</div>
     92
     93<div class="max-height-max-content max-width-max-content">
     94    <div class="grid autoFill max-width-min-content">item</div>
     95</div>
     96
     97<div class="max-height-min-content min-content">
     98    <div class="grid autoFit min-height-max-content max-height-min-content">item</div>
     99</div>
     100
     101<div class="min-height-max-content max-content">
     102    <div class="grid autoFill max-height-max-content">item</div>
     103</div>
     104
     105<div class="min-content min-width-max-content">
     106    <div class="grid autoFit max-width-max-content">item</div>
     107</div>
     108
     109<div class="min-content max-width-max-content">
     110    <div class="grid autoFill min-height-min-content">item</div>
     111</div>
     112
     113<div class="min-height-min-content min-content">
     114    <div class="grid autoFit max-height-min-content">item</div>
     115</div>
     116
     117<div class="max-height-max-content max-content">
     118    <div class="grid autoFill max-height-min-content">item</div>
     119</div>
     120
     121<div class="min-content min-width-min-content">
     122    <div class="grid autoFit min-content min-height-min-content max-height-max-content">item</div>
     123</div>
     124
    45125<p>This test checks that the computation of auto repeat tracks works when the grid container width is indefinite.</p>
    46126<p>This test has PASSED if it didn't CRASH.</p>

  • trunk/Source/WebCore/ChangeLog

    r207456 r207457  
     12016-10-17  Sergio Villar Senin  <svillar@igalia.com>
     2
     3        [css-grid] Constrain by min|max-height on auto repeat computation
     4        https://bugs.webkit.org/show_bug.cgi?id=163540
     5
     6        Reviewed by Darin Adler.
     7
     8        The max-height (if definite) is used to compute the number of auto repeat rows whenever the
     9        height is indefinite. We were using the min-height only in case both values were indefinite.
     10
     11        Although not explicitly mentioned by grid specs, it's reasonable to assume that
     12        the min-height trumps the used value of height/max-height like it always does, per CSS
     13        2.2. Note that the number of rows still needs to fit within that size even if using
     14        min-height, because we're just using min-height to compute the used value of the height
     15        property. If both height and max-height are indefinite we keep doing the same, i.e., compute
     16        the minimum number of rows that fulfill min-height (if definite).
     17
     18        * rendering/RenderGrid.cpp:
     19        (WebCore::RenderGrid::computeAutoRepeatTracksCount):
     20
    1212016-10-17  Yusuke Suzuki  <utatane.tea@gmail.com>
    222

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

    r207290 r207457  
    14891489            availableSize =  availableLogicalWidth();
    14901490    } else {
    1491         availableSize = computeContentLogicalHeight(MainOrPreferredSize, style().logicalHeight(), LayoutUnit(-1));
     1491        availableSize = computeContentLogicalHeight(MainOrPreferredSize, style().logicalHeight(), Nullopt);
    14921492        if (!availableSize) {
    14931493            const Length& maxLength = style().logicalMaxHeight();
    14941494            if (!maxLength.isUndefined())
    1495                 availableSize = computeContentLogicalHeight(MaxSize, maxLength, LayoutUnit(-1));
    1496         } else {
    1497             availableSize = constrainLogicalHeightByMinMax(availableSize.value(), LayoutUnit(-1));
    1498         }
     1495                availableSize = computeContentLogicalHeight(MaxSize, maxLength, Nullopt);
     1496        }
     1497        if (availableSize)
     1498            availableSize = constrainContentBoxLogicalHeightByMinMax(availableSize.value(), Nullopt);
    14991499    }
    15001500
Note: See TracChangeset for help on using the changeset viewer.