Changeset 207460 in webkit
- Timestamp:
- Oct 18, 2016 5:33:28 AM (8 years ago)
- Location:
- trunk
- Files:
-
- 2 added
- 5 edited
Legend:
- Unmodified
- Added
- Removed
-
trunk/LayoutTests/ChangeLog
r207457 r207460 1 2016-10-18 Javier Fernandez <jfernandez@igalia.com> 2 3 [css-grid] Different width of grid container between initial load and refresh 4 https://bugs.webkit.org/show_bug.cgi?id=163535 5 6 Reviewed by Manuel Rego Casasnovas. 7 8 Tests to ensure repeated layouts on grid elements produce the same results when using 9 orthogonal grid items. 10 11 * fast/css-grid-layout/repeating-layout-must-produce-the-same-results-expected.txt: Added. 12 * fast/css-grid-layout/repeating-layout-must-produce-the-same-results.html: Added. 13 1 14 2016-10-17 Sergio Villar Senin <svillar@igalia.com> 2 15 -
trunk/LayoutTests/fast/css-grid-layout/grid-track-sizing-with-orthogonal-flows.html
r203501 r207460 47 47 <div class="container"> 48 48 <p>Grid width under <b>min-content</b> constrain and <b>fixed</b> height.<br> All grid items sized with <b>min-{width, height} auto</b>.<br> Orthogonal green row track assumed as infinity, hence 10px for the column track. Actual row tracks size is different, hence overflowing. </p> 49 <div class="grid itemsStart contentStart min-content height200" data-expected-width=" 30" data-expected-height="200">49 <div class="grid itemsStart contentStart min-content height200" data-expected-width="50" data-expected-height="200"> 50 50 <div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="30" data-expected-height="50">XX XXX X XXX XX</div> 51 51 <div class="verticalLR firstRowSecondColumn" data-offset-x="30" data-offset-y="0" data-expected-width="40" data-expected-height="105">X XXX XX XXXXX XX XXX X XXXX X XX</div> … … 56 56 <div class="container"> 57 57 <p>Grid width under <b>max-content</b> constrain and <b>fixed</b> height.<br> All grid items sized with <b>min-{width, height} auto</b>.<br> Parallel blue column track sized as its max of 150x, while Orthogonal green row, assumed as infinity, sized as 10px. Since actual row tracks size is different, green column track will occupy some space initally assigned to the blue one.</p> 58 <div class="grid itemsStart contentStart max-content height200" data-expected-width="1 50" data-expected-height="200">59 <div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="1 10" data-expected-height="20">XX XXX X XXX XX</div>60 <div class="verticalLR firstRowSecondColumn" data-offset-x="1 10" data-offset-y="0" data-expected-width="40" data-expected-height="105">X XXX XX XXXXX XX XXX X XXXX X XX</div>58 <div class="grid itemsStart contentStart max-content height200" data-expected-width="170" data-expected-height="200"> 59 <div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="130" data-expected-height="20">XX XXX X XXX XX</div> 60 <div class="verticalLR firstRowSecondColumn" data-offset-x="130" data-offset-y="0" data-expected-width="40" data-expected-height="105">X XXX XX XXXXX XX XXX X XXXX X XX</div> 61 61 <div class="verticalLR secondRowFirstColumn" data-offset-x="0" data-offset-y="105" data-expected-width="20" data-expected-height="95">XXXX XX X XX XXX</div> 62 62 </div> … … 65 65 <div class="container"> 66 66 <p>Grid width under <b>fit-content</b> constrain and <b>fixed</b> height.<br >All grid items sized with <b>min-{width, height} auto</b>.<br> Since we use assumed row tracks sizes, minimum and maximum will be the same, hence fit-content will produce the same result than max-content.</p> 67 <div class="grid itemsStart contentStart fit-content height200" data-expected-width="1 50" data-expected-height="200">68 <div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="1 10" data-expected-height="20">XX XXX X XXX XX</div>69 <div class="verticalLR firstRowSecondColumn" data-offset-x="1 10" data-offset-y="0" data-expected-width="40" data-expected-height="105">X XXX XX XXXXX XX XXX X XXXX X XX</div>67 <div class="grid itemsStart contentStart fit-content height200" data-expected-width="170" data-expected-height="200"> 68 <div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="130" data-expected-height="20">XX XXX X XXX XX</div> 69 <div class="verticalLR firstRowSecondColumn" data-offset-x="130" data-offset-y="0" data-expected-width="40" data-expected-height="105">X XXX XX XXXXX XX XXX X XXXX X XX</div> 70 70 <div class="verticalLR secondRowFirstColumn" data-offset-x="0" data-offset-y="105" data-expected-width="20" data-expected-height="95">XXXX XX X XX XXX</div> 71 71 </div> … … 121 121 <div class="container"> 122 122 <p>Grid width under <b>max-content</b> constrain and <b>fixed</b> height.<br> All grid items sized with <b>min-width: 0px, min-height: auto</b>.<br> Since container is sized under max-content, tracks will use its maximum size.</p> 123 <div class="grid itemsStart contentStart max-content height200" data-expected-width="1 60" data-expected-height="200">124 <div class="minWidthZero firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="1 20" data-expected-height="20">XX XXX X XXX XX</div>125 <div class="minWidthZero verticalLR firstRowSecondColumn" data-offset-x="1 20" data-offset-y="0" data-expected-width="40" data-expected-height="105">X XXX XX XXXXX XX XXX X XXXX X XX</div>123 <div class="grid itemsStart contentStart max-content height200" data-expected-width="170" data-expected-height="200"> 124 <div class="minWidthZero firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="130" data-expected-height="20">XX XXX X XXX XX</div> 125 <div class="minWidthZero verticalLR firstRowSecondColumn" data-offset-x="130" data-offset-y="0" data-expected-width="40" data-expected-height="105">X XXX XX XXXXX XX XXX X XXXX X XX</div> 126 126 <div class="minWidthZero verticalLR secondRowFirstColumn" data-offset-x="0" data-offset-y="105" data-expected-width="20" data-expected-height="95">XXXX XX X XX XXX</div> 127 127 </div> -
trunk/LayoutTests/fast/css-grid-layout/grid-track-sizing-with-percentages-and-orthogonal-flows.html
r203501 r207460 25 25 <p>HORIZONTAL-TB container with VERTICAL-LR items.</p> 26 26 <div class="container"> 27 <div class="grid itemsStart contentStart fit-content" data-expected-width="1 00" data-expected-height="260">27 <div class="grid itemsStart contentStart fit-content" data-expected-width="110" data-expected-height="260"> 28 28 <div class="firstRowFirstColumn verticalLR" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="50">X X X</div> 29 29 <div class="firstRowSecondColumn verticalLR" data-offset-x="100" data-offset-y="0" data-expected-width="10" data-expected-height="110">X X X X X X</div> … … 35 35 <p>HORIZONTAL-TB container with VERTICAL-RL items.</p> 36 36 <div class="container"> 37 <div class="grid itemsStart contentStart fit-content" data-expected-width="1 00" data-expected-height="260">37 <div class="grid itemsStart contentStart fit-content" data-expected-width="110" data-expected-height="260"> 38 38 <div class="firstRowFirstColumn verticalRL" data-offset-x="0" data-offset-y="0" data-expected-width="10" data-expected-height="50">X X X</div> 39 39 <div class="firstRowSecondColumn verticalRL" data-offset-x="100" data-offset-y="0" data-expected-width="10" data-expected-height="110">X X X X X X</div> … … 45 45 <p>VERTICAL-LR container with HORIZONTAL-TB items.</p> 46 46 <div class="container"> 47 <div class="grid itemsStart contentStart verticalLR fit-content" data-expected-width="260" data-expected-height="1 20">47 <div class="grid itemsStart contentStart verticalLR fit-content" data-expected-width="260" data-expected-height="110"> 48 48 <div class="firstRowFirstColumn horizontalTB" data-offset-x="0" data-offset-y="0" data-expected-width="50" data-expected-height="10">X X X</div> 49 49 <div class="firstRowSecondColumn horizontalTB" data-offset-x="0" data-offset-y="100" data-expected-width="110" data-expected-height="10">X X X X X X</div> … … 55 55 <p>VERTICAL-RL container with HORIZONTAL-TB items.</p> 56 56 <div class="container"> 57 <div class="grid itemsStart contentStart verticalRL fit-content" data-expected-width="260" data-expected-height="1 00">57 <div class="grid itemsStart contentStart verticalRL fit-content" data-expected-width="260" data-expected-height="110"> 58 58 <div class="firstRowFirstColumn horizontalTB" data-offset-x="210" data-offset-y="0" data-expected-width="50" data-expected-height="10">X X X</div> 59 59 <div class="firstRowSecondColumn horizontalTB" data-offset-x="150" data-offset-y="100" data-expected-width="110" data-expected-height="10">X X X X X X</div> -
trunk/Source/WebCore/ChangeLog
r207459 r207460 1 2016-10-18 Javier Fernandez <jfernandez@igalia.com> 2 3 [css-grid] Different width of grid container between initial load and refresh 4 https://bugs.webkit.org/show_bug.cgi?id=163535 5 6 Reviewed by Manuel Rego Casasnovas. 7 8 Grid's layout logic manages two different override sizes; one it's 9 designed to implement the grid item's stretching behavior, identified 10 with the concept of 'overrideContentLogicalSize'; there is another 11 override size, known as overrideContainingBlockContentLogicalSize, 12 used to implement the Grid Area abstraction, which will behave as 13 the actual containing block of any grid item. 14 15 During grid's layout logic these override sizes are set according 16 to the CSS style rules. This affects how the grid container and its 17 children are going to be sized during layout. Grid Tracks sizing 18 algorithm depends on these override sizes. 19 20 In order to ensure that the tracks sizing algorithm produces the 21 same results when it's run consecutively several times, we need to 22 clear these override sizes and perform a layout of the affected grid 23 items. Otherwise, the affected items will return sizing values which 24 depend on the override values set in the previous layout, which in 25 some cases, like orthogonal flows, may change through different runs 26 of the sizing algorithm. 27 28 Test: fast/css-grid-layout/repeating-layout-must-produce-the-same-results.html 29 30 * rendering/RenderGrid.cpp: 31 (WebCore::RenderGrid::layoutBlock): 32 1 33 2016-10-18 Youenn Fablet <youenn@apple.com> 2 34 -
trunk/Source/WebCore/rendering/RenderGrid.cpp
r207457 r207460 460 460 461 461 LayoutSize previousSize = size(); 462 463 // We need to clear both own and containingBlock override sizes of orthogonal items to ensure we get the 464 // same result when grid's intrinsic size is computed again in the updateLogicalWidth call bellow. 465 if (sizesLogicalWidthToFitContent(MaxSize) || style().logicalWidth().isIntrinsicOrAuto()) { 466 for (auto* child = firstChildBox(); child; child = child->nextSiblingBox()) { 467 if (child->isOutOfFlowPositioned() || !isOrthogonalChild(*child)) 468 continue; 469 child->clearOverrideSize(); 470 child->clearContainingBlockOverrideSize(); 471 child->setNeedsLayout(); 472 child->layoutIfNeeded(); 473 } 474 } 462 475 463 476 setLogicalHeight(0);
Note: See TracChangeset
for help on using the changeset viewer.