Diff
Modified: trunk/LayoutTests/imported/w3c/ChangeLog (243217 => 243218)
--- trunk/LayoutTests/imported/w3c/ChangeLog 2019-03-20 18:10:32 UTC (rev 243217)
+++ trunk/LayoutTests/imported/w3c/ChangeLog 2019-03-20 18:26:40 UTC (rev 243218)
@@ -1,3 +1,20 @@
+2019-03-20 Oriol Brufau <[email protected]>
+
+ [css-grid] Always consider baseline shim for the minimum contribution
+ https://bugs.webkit.org/show_bug.cgi?id=195964
+
+ Reviewed by Javier Fernandez.
+
+ Import WPT tests.
+
+ * web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-expected.txt: Added.
+ * web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-lr-expected.txt: Added.
+ * web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-lr.html: Added.
+ * web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-rl-expected.txt: Added.
+ * web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-rl.html: Added.
+ * web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim.html: Added.
+ * web-platform-tests/css/css-grid/layout-algorithm/w3c-import.log:
+
2019-03-16 Youenn Fablet <[email protected]>
Update WPT WebRTC tests up to a22a149
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-expected.txt (0 => 243218)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-expected.txt (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-expected.txt 2019-03-20 18:26:40 UTC (rev 243218)
@@ -0,0 +1,8 @@
+
+PASS .grid 1
+PASS .grid 2
+PASS .grid 3
+PASS .grid 4
+PASS .grid 5
+PASS .grid 6
+
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-lr-expected.txt (0 => 243218)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-lr-expected.txt (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-lr-expected.txt 2019-03-20 18:26:40 UTC (rev 243218)
@@ -0,0 +1,8 @@
+
+PASS .grid 1
+PASS .grid 2
+PASS .grid 3
+PASS .grid 4
+PASS .grid 5
+PASS .grid 6
+
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-lr.html (0 => 243218)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-lr.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-lr.html 2019-03-20 18:26:40 UTC (rev 243218)
@@ -0,0 +1,96 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Grid Layout Test: minimum contribution with baseline-alignment shim</title>
+<link rel="author" title="Oriol Brufau" href=""
+<link rel="help" href="" title="11.5. Resolve Intrinsic Track Sizes">
+<meta name="assert" content="Checks that the minimum contribution takes the baseline-alignment shim into account when calculating the outer size that grid items would have if their preferred size were their minimum size. Also checks that the shim is used again when clamping the automatic minimum size to less than or equal to the stretch fit into the grid area.">
+<style>
+.grid {
+ display: grid;
+ position: relative;
+ font-size: 0;
+ height: 0;
+ width: 0;
+ margin-bottom: 125px;
+ grid-template-rows: 50px 50px;
+ justify-items: baseline;
+}
+.item1, .item2 {
+ writing-mode: vertical-lr;
+}
+.item1 {
+ padding-left: 25px;
+ background: yellow;
+}
+.item2 {
+ padding-right: 25px;
+ background: magenta;
+}
+.item1::before, .item2::before {
+ content: '';
+ display: inline-block;
+ width: 25px;
+ height: 25px;
+ vertical-align: top;
+}
+.item2::before {
+ vertical-align: bottom;
+}
+.area {
+ position: absolute;
+ z-index: -1;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ grid-column: 1 / 2;
+ grid-row: 1 / 3;
+ background: cyan;
+}
+</style>
+
+<script src=""
+<script src=""
+<script src=""
+
+<div id="log"></div>
+
+<div class="grid" style="grid-template-columns: minmax(auto, 0px);">
+ <div class="item1" data-offset-x="0" data-offset-y="0"></div>
+ <div class="item2" data-offset-x="50" data-offset-y="50"></div>
+ <div class="area" data-expected-width="75" data-expected-height="100"></div>
+</div>
+
+<div class="grid" style="grid-template-columns: minmax(auto, 75px);">
+ <div class="item1" data-offset-x="0" data-offset-y="0"></div>
+ <div class="item2" data-offset-x="50" data-offset-y="50"></div>
+ <div class="area" data-expected-width="75" data-expected-height="100"></div>
+</div>
+
+<div class="grid" style="grid-template-columns: minmax(auto, 88px);">
+ <div class="item1" data-offset-x="0" data-offset-y="0"></div>
+ <div class="item2" data-offset-x="50" data-offset-y="50"></div>
+ <div class="area" data-expected-width="88" data-expected-height="100"></div>
+</div>
+
+<div class="grid" style="grid-template-columns: minmax(auto, 100px);">
+ <div class="item1" data-offset-x="0" data-offset-y="0"></div>
+ <div class="item2" data-offset-x="50" data-offset-y="50"></div>
+ <div class="area" data-expected-width="100" data-expected-height="100"></div>
+</div>
+
+<div class="grid" style="grid-template-columns: minmax(auto, 150px);">
+ <div class="item1" data-offset-x="0" data-offset-y="0"></div>
+ <div class="item2" data-offset-x="50" data-offset-y="50"></div>
+ <div class="area" data-expected-width="100" data-expected-height="100"></div>
+</div>
+
+<div class="grid" style="grid-template-columns: minmax(auto, auto);">
+ <div class="item1" data-offset-x="0" data-offset-y="0"></div>
+ <div class="item2" data-offset-x="50" data-offset-y="50"></div>
+ <div class="area" data-expected-width="100" data-expected-height="100"></div>
+</div>
+
+<script>
+checkLayout(".grid");
+</script>
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-rl-expected.txt (0 => 243218)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-rl-expected.txt (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-rl-expected.txt 2019-03-20 18:26:40 UTC (rev 243218)
@@ -0,0 +1,8 @@
+
+PASS .grid 1
+PASS .grid 2
+PASS .grid 3
+PASS .grid 4
+PASS .grid 5
+PASS .grid 6
+
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-rl.html (0 => 243218)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-rl.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-rl.html 2019-03-20 18:26:40 UTC (rev 243218)
@@ -0,0 +1,96 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Grid Layout Test: minimum contribution with baseline-alignment shim</title>
+<link rel="author" title="Oriol Brufau" href=""
+<link rel="help" href="" title="11.5. Resolve Intrinsic Track Sizes">
+<meta name="assert" content="Checks that the minimum contribution takes the baseline-alignment shim into account when calculating the outer size that grid items would have if their preferred size were their minimum size. Also checks that the shim is used again when clamping the automatic minimum size to less than or equal to the stretch fit into the grid area.">
+<style>
+.grid {
+ display: grid;
+ position: relative;
+ font-size: 0;
+ height: 0;
+ width: 0;
+ margin-bottom: 125px;
+ grid-template-rows: 50px 50px;
+ justify-items: baseline;
+}
+.item1, .item2 {
+ writing-mode: vertical-rl;
+}
+.item1 {
+ padding-left: 25px;
+ background: yellow;
+}
+.item2 {
+ padding-right: 25px;
+ background: magenta;
+}
+.item1::before, .item2::before {
+ content: '';
+ display: inline-block;
+ width: 25px;
+ height: 25px;
+ vertical-align: top;
+}
+.item2::before {
+ vertical-align: bottom;
+}
+.area {
+ position: absolute;
+ z-index: -1;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ grid-column: 1 / 2;
+ grid-row: 1 / 3;
+ background: cyan;
+}
+</style>
+
+<script src=""
+<script src=""
+<script src=""
+
+<div id="log"></div>
+
+<div class="grid" style="grid-template-columns: minmax(auto, 0px);">
+ <div class="item1" data-offset-x="0" data-offset-y="0"></div>
+ <div class="item2" data-offset-x="50" data-offset-y="50"></div>
+ <div class="area" data-expected-width="75" data-expected-height="100"></div>
+</div>
+
+<div class="grid" style="grid-template-columns: minmax(auto, 75px);">
+ <div class="item1" data-offset-x="0" data-offset-y="0"></div>
+ <div class="item2" data-offset-x="50" data-offset-y="50"></div>
+ <div class="area" data-expected-width="75" data-expected-height="100"></div>
+</div>
+
+<div class="grid" style="grid-template-columns: minmax(auto, 88px);">
+ <div class="item1" data-offset-x="0" data-offset-y="0"></div>
+ <div class="item2" data-offset-x="50" data-offset-y="50"></div>
+ <div class="area" data-expected-width="88" data-expected-height="100"></div>
+</div>
+
+<div class="grid" style="grid-template-columns: minmax(auto, 100px);">
+ <div class="item1" data-offset-x="0" data-offset-y="0"></div>
+ <div class="item2" data-offset-x="50" data-offset-y="50"></div>
+ <div class="area" data-expected-width="100" data-expected-height="100"></div>
+</div>
+
+<div class="grid" style="grid-template-columns: minmax(auto, 150px);">
+ <div class="item1" data-offset-x="0" data-offset-y="0"></div>
+ <div class="item2" data-offset-x="50" data-offset-y="50"></div>
+ <div class="area" data-expected-width="100" data-expected-height="100"></div>
+</div>
+
+<div class="grid" style="grid-template-columns: minmax(auto, auto);">
+ <div class="item1" data-offset-x="0" data-offset-y="0"></div>
+ <div class="item2" data-offset-x="50" data-offset-y="50"></div>
+ <div class="area" data-expected-width="100" data-expected-height="100"></div>
+</div>
+
+<script>
+checkLayout(".grid");
+</script>
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim.html (0 => 243218)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim.html 2019-03-20 18:26:40 UTC (rev 243218)
@@ -0,0 +1,93 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Grid Layout Test: minimum contribution with baseline-alignment shim</title>
+<link rel="author" title="Oriol Brufau" href=""
+<link rel="help" href="" title="11.5. Resolve Intrinsic Track Sizes">
+<meta name="assert" content="Checks that the minimum contribution takes the baseline-alignment shim into account when calculating the outer size that grid items would have if their preferred size were their minimum size. Also checks that the shim is used again when clamping the automatic minimum size to less than or equal to the stretch fit into the grid area.">
+<style>
+.grid {
+ display: grid;
+ position: relative;
+ font-size: 0;
+ height: 0;
+ width: 0;
+ margin-bottom: 125px;
+ grid-template-columns: 50px 50px;
+ align-items: baseline;
+}
+.item1 {
+ padding-top: 25px;
+ background: yellow;
+}
+.item2 {
+ padding-bottom: 25px;
+ background: magenta;
+}
+.item1::before, .item2::before {
+ content: '';
+ display: inline-block;
+ width: 25px;
+ height: 25px;
+ vertical-align: bottom;
+}
+.item2::before {
+ vertical-align: top;
+}
+.area {
+ position: absolute;
+ z-index: -1;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ grid-column: 1 / 3;
+ grid-row: 1 / 2;
+ background: cyan;
+}
+</style>
+
+<script src=""
+<script src=""
+<script src=""
+
+<div id="log"></div>
+
+<div class="grid" style="grid-template-rows: minmax(auto, 0px);">
+ <div class="item1" data-offset-x="0" data-offset-y="0"></div>
+ <div class="item2" data-offset-x="50" data-offset-y="50"></div>
+ <div class="area" data-expected-width="100" data-expected-height="75"></div>
+</div>
+
+<div class="grid" style="grid-template-rows: minmax(auto, 75px);">
+ <div class="item1" data-offset-x="0" data-offset-y="0"></div>
+ <div class="item2" data-offset-x="50" data-offset-y="50"></div>
+ <div class="area" data-expected-width="100" data-expected-height="75"></div>
+</div>
+
+<div class="grid" style="grid-template-rows: minmax(auto, 88px);">
+ <div class="item1" data-offset-x="0" data-offset-y="0"></div>
+ <div class="item2" data-offset-x="50" data-offset-y="50"></div>
+ <div class="area" data-expected-width="100" data-expected-height="88"></div>
+</div>
+
+<div class="grid" style="grid-template-rows: minmax(auto, 100px);">
+ <div class="item1" data-offset-x="0" data-offset-y="0"></div>
+ <div class="item2" data-offset-x="50" data-offset-y="50"></div>
+ <div class="area" data-expected-width="100" data-expected-height="100"></div>
+</div>
+
+<div class="grid" style="grid-template-rows: minmax(auto, 150px);">
+ <div class="item1" data-offset-x="0" data-offset-y="0"></div>
+ <div class="item2" data-offset-x="50" data-offset-y="50"></div>
+ <div class="area" data-expected-width="100" data-expected-height="100"></div>
+</div>
+
+<div class="grid" style="grid-template-rows: minmax(auto, auto);">
+ <div class="item1" data-offset-x="0" data-offset-y="0"></div>
+ <div class="item2" data-offset-x="50" data-offset-y="50"></div>
+ <div class="area" data-expected-width="100" data-expected-height="100"></div>
+</div>
+
+<script>
+checkLayout(".grid");
+</script>
Modified: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/w3c-import.log (243217 => 243218)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/w3c-import.log 2019-03-20 18:10:32 UTC (rev 243217)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/w3c-import.log 2019-03-20 18:26:40 UTC (rev 243218)
@@ -24,6 +24,9 @@
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-intrinsic-size-with-orthogonal-items.html
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-layout-free-space-unit-expected.html
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-layout-free-space-unit.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-lr.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-rl.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim.html
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-percent-cols-filled-shrinkwrap-001-expected.html
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-percent-cols-filled-shrinkwrap-001.html
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-percent-cols-spanned-shrinkwrap-001-expected.html
Modified: trunk/Source/WebCore/ChangeLog (243217 => 243218)
--- trunk/Source/WebCore/ChangeLog 2019-03-20 18:10:32 UTC (rev 243217)
+++ trunk/Source/WebCore/ChangeLog 2019-03-20 18:26:40 UTC (rev 243218)
@@ -1,3 +1,27 @@
+2019-03-20 Oriol Brufau <[email protected]>
+
+ [css-grid] Always consider baseline shim for the minimum contribution
+ https://bugs.webkit.org/show_bug.cgi?id=195964
+
+ Reviewed by Javier Fernandez.
+
+ Tests: imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-lr.html
+ imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim-vertical-rl.html
+ imported/w3c/web-platform-tests/css/css-grid/layout-algorithm/grid-minimum-contribution-baseline-shim.html
+
+ Before this patch, the shim used for baseline alignment is not taken
+ into consideration when calculating the minimum contribution of a grid
+ item if its preferred size is auto, its minimum size is auto, and the
+ max track sizing function is a fixed small value. In this case, the
+ auto minimum size can produce a smaller track than if it was 0.
+
+ The specification needs to clarify how baseline shims interact with
+ minimum contributions (https://github.com/w3c/csswg-drafts/issues/3660),
+ but the above doesn't make sense.
+
+ * rendering/GridTrackSizingAlgorithm.cpp:
+ (WebCore::GridTrackSizingAlgorithmStrategy::minSizeForChild const):
+
2019-03-20 Simon Fraser <[email protected]>
Some elements lag behind async overflow scrolling on palace-games.com
Modified: trunk/Source/WebCore/rendering/GridTrackSizingAlgorithm.cpp (243217 => 243218)
--- trunk/Source/WebCore/rendering/GridTrackSizingAlgorithm.cpp 2019-03-20 18:10:32 UTC (rev 243217)
+++ trunk/Source/WebCore/rendering/GridTrackSizingAlgorithm.cpp 2019-03-20 18:26:40 UTC (rev 243218)
@@ -799,10 +799,14 @@
{
GridTrackSizingDirection childInlineDirection = GridLayoutFunctions::flowAwareDirectionForChild(*renderGrid(), child, ForColumns);
bool isRowAxis = direction() == childInlineDirection;
- const Length& childMinSize = isRowAxis ? child.style().logicalMinWidth() : child.style().logicalMinHeight();
const Length& childSize = isRowAxis ? child.style().logicalWidth() : child.style().logicalHeight();
+ if (!childSize.isAuto())
+ return minContentForChild(child);
+ const Length& childMinSize = isRowAxis ? child.style().logicalMinWidth() : child.style().logicalMinHeight();
bool overflowIsVisible = isRowAxis ? child.style().overflowInlineDirection() == Overflow::Visible : child.style().overflowBlockDirection() == Overflow::Visible;
+ LayoutUnit baselineShim = m_algorithm.baselineOffsetForChild(child, gridAxisForDirection(direction()));
+
if (childSize.isAuto() && childMinSize.isAuto() && overflowIsVisible) {
auto minSize = minContentForChild(child);
LayoutUnit maxBreadth;
@@ -815,15 +819,11 @@
if (minSize > maxBreadth) {
auto marginAndBorderAndPadding = GridLayoutFunctions::marginLogicalSizeForChild(*renderGrid(), direction(), child);
marginAndBorderAndPadding += isRowAxis ? child.borderAndPaddingLogicalWidth() : child.borderAndPaddingLogicalHeight();
- minSize = std::max(maxBreadth, marginAndBorderAndPadding);
+ minSize = std::max(maxBreadth, marginAndBorderAndPadding + baselineShim);
}
return minSize;
}
- if (!childSize.isAuto())
- return minContentForChild(child);
-
- LayoutUnit baselineShim = m_algorithm.baselineOffsetForChild(child, gridAxisForDirection(direction()));
LayoutUnit gridAreaSize = m_algorithm.gridAreaBreadthForChild(child, childInlineDirection);
if (isRowAxis)
return minLogicalWidthForChild(child, childMinSize, gridAreaSize) + baselineShim;
