Skip to content

Commit

Permalink
[css-grid] Use transferred size over content size for automatic minim…
Browse files Browse the repository at this point in the history
…um size

https://bugs.webkit.org/show_bug.cgi?id=176688

Reviewed by Sergio Villar Senin.

LayoutTests/imported/w3c:

Import changes on the tests related to the new behavior.

* web-platform-tests/css/css-grid-1/grid-items/grid-minimum-size-grid-items-006.html:
* web-platform-tests/css/css-grid-1/grid-items/grid-minimum-size-grid-items-007.html:
* web-platform-tests/css/css-grid-1/grid-items/grid-minimum-size-grid-items-008.html:
* web-platform-tests/css/css-grid-1/grid-items/grid-minimum-size-grid-items-009.html:
* web-platform-tests/css/css-grid-1/grid-items/grid-minimum-size-grid-items-021.html:
* web-platform-tests/css/css-grid-1/grid-items/support/100x50-green.png: Removed.
* web-platform-tests/css/css-grid-1/grid-items/support/25x50-green.png: Added.
* web-platform-tests/css/css-grid-1/grid-items/support/50x100-green.png: Removed.
* web-platform-tests/css/css-grid-1/grid-items/support/50x25-green.png: Added.
* web-platform-tests/css/css-grid-1/grid-items/support/w3c-import.log:

Source/WebCore:

CSS WG has agreed to modify the spec so now the transferred size is used
(if it exists) independently if it's bigger or smaller
than the content size.
See: w3c/csswg-drafts#1149

The spec text (https://drafts.csswg.org/css-grid/#min-size-auto):
  "The automatic minimum size for a grid item in a given dimension is
   its specified size if it exists, otherwise its transferred size
   if that exists, else its content size"

This patch use the WPT tests updated to check the new behavior.

* rendering/GridTrackSizingAlgorithm.cpp:
(WebCore::GridTrackSizingAlgorithmStrategy::minSizeForChild const):
Modified so it always returns the transferred size (if any).


Canonical link: https://commits.webkit.org/193251@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@221910 268f45cc-cd09-0410-ab3c-d52691b4dbfc
  • Loading branch information
mrego committed Sep 12, 2017
1 parent 5982eb1 commit f86c527
Show file tree
Hide file tree
Showing 13 changed files with 63 additions and 24 deletions.
20 changes: 20 additions & 0 deletions LayoutTests/imported/w3c/ChangeLog
Original file line number Diff line number Diff line change
@@ -1,3 +1,23 @@
2017-09-12 Manuel Rego Casasnovas <rego@igalia.com>

[css-grid] Use transferred size over content size for automatic minimum size
https://bugs.webkit.org/show_bug.cgi?id=176688

Reviewed by Sergio Villar Senin.

Import changes on the tests related to the new behavior.

* web-platform-tests/css/css-grid-1/grid-items/grid-minimum-size-grid-items-006.html:
* web-platform-tests/css/css-grid-1/grid-items/grid-minimum-size-grid-items-007.html:
* web-platform-tests/css/css-grid-1/grid-items/grid-minimum-size-grid-items-008.html:
* web-platform-tests/css/css-grid-1/grid-items/grid-minimum-size-grid-items-009.html:
* web-platform-tests/css/css-grid-1/grid-items/grid-minimum-size-grid-items-021.html:
* web-platform-tests/css/css-grid-1/grid-items/support/100x50-green.png: Removed.
* web-platform-tests/css/css-grid-1/grid-items/support/25x50-green.png: Added.
* web-platform-tests/css/css-grid-1/grid-items/support/50x100-green.png: Removed.
* web-platform-tests/css/css-grid-1/grid-items/support/50x25-green.png: Added.
* web-platform-tests/css/css-grid-1/grid-items/support/w3c-import.log:

2017-09-11 Joseph Pecoraro <pecoraro@apple.com>

Make the WPT entry point for LayoutTests/http/wpt more discoverable
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<link rel="help" href="http://www.w3.org/TR/css-grid-1/#min-size-auto" title="6.6. Implied Minimum Size of Grid Items">
<link rel="match" href="ref-filled-green-100px-square-image.html">
<meta name="flags" content="image">
<meta name="assert" content="Checks that minimum size for grid items is the specified size for width (regardless the content size) and the transferred size for height (as it's smaller than the content size of the image).">
<meta name="assert" content="Checks that minimum size for grid items is the specified size for width (regardless the content size) and the transferred size of the image for height (even when content size is bigger).">
<style>
#reference-overlapped-red {
position: absolute;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<link rel="help" href="http://www.w3.org/TR/css-grid-1/#min-size-auto" title="6.6. Implied Minimum Size of Grid Items">
<link rel="match" href="ref-filled-green-100px-square-image.html">
<meta name="flags" content="image">
<meta name="assert" content="Checks that minimum size for grid items is the specified size for width (regardless the content size) and the content size for height (as it's smaller than the transferred size of the image).">
<meta name="assert" content="Checks that minimum size for grid items is the specified size for width (regardless the content size) and the transferred size of the image for height (even when content size is smaller).">
<style>
#reference-overlapped-red {
position: absolute;
Expand All @@ -17,12 +17,13 @@

#constrained-grid {
display: grid;
grid-template-columns: auto auto;
width: 10px;
height: 10px;
}

#test-grid-item-overlapping-green {
width: 100px;
.test-grid-item-overlapping-green {
width: 50px;
justify-self: stretch;
align-self: stretch;
}
Expand All @@ -31,6 +32,7 @@

<div id="reference-overlapped-red"></div>
<div id="constrained-grid">
<img id="test-grid-item-overlapping-green" src="support/50x100-green.png" alt="Image download support must be enabled" />
<img class="test-grid-item-overlapping-green" src="support/25x50-green.png" alt="Image download support must be enabled" />
<img class="test-grid-item-overlapping-green" src="support/25x50-green.png" alt="Image download support must be enabled" />
</div>

Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<link rel="help" href="http://www.w3.org/TR/css-grid-1/#min-size-auto" title="6.6. Implied Minimum Size of Grid Items">
<link rel="match" href="ref-filled-green-100px-square-image.html">
<meta name="flags" content="image">
<meta name="assert" content="Checks that minimum size for grid items is the specified size for height (regardless the content size) and the transferred size for width (as it's smaller than the content size of the image).">
<meta name="assert" content="Checks that minimum size for grid items is the specified size for height (regardless the content size) and the transferred size of the image for width (even when content size is bigger).">
<style>
#reference-overlapped-red {
position: absolute;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<link rel="help" href="http://www.w3.org/TR/css-grid-1/#min-size-auto" title="6.6. Implied Minimum Size of Grid Items">
<link rel="match" href="ref-filled-green-100px-square-image.html">
<meta name="flags" content="image">
<meta name="assert" content="Checks that minimum size for grid items is the specified size for height (regardless the content size) and the content size for width (as it's smaller than the transferred size of the image).">
<meta name="assert" content="Checks that minimum size for grid items is the specified size for height (regardless the content size) and the transferred size for width of the image (even when content size is smaller).">
<style>
#reference-overlapped-red {
position: absolute;
Expand All @@ -21,8 +21,8 @@
height: 10px;
}

#test-grid-item-overlapping-green {
height: 100px;
.test-grid-item-overlapping-green {
height: 50px;
justify-self: stretch;
align-self: stretch;
}
Expand All @@ -31,6 +31,7 @@

<div id="reference-overlapped-red"></div>
<div id="constrained-grid">
<img id="test-grid-item-overlapping-green" src="support/100x50-green.png" alt="Image download support must be enabled" />
<img class="test-grid-item-overlapping-green" src="support/50x25-green.png" alt="Image download support must be enabled" />
<img class="test-grid-item-overlapping-green" src="support/50x25-green.png" alt="Image download support must be enabled" />
</div>

Original file line number Diff line number Diff line change
Expand Up @@ -67,17 +67,17 @@

function runTests() {
checkGridSizeTracksAndImageSize("grid-1", "img-1", "200px", "200px", "200px", "200px", "200px", "200px");
checkGridSizeTracksAndImageSize("grid-2", "img-2", "10px", "10px", "200px", "50px", "200px", "200px");
checkGridSizeTracksAndImageSize("grid-2", "img-2", "10px", "10px", "200px", "200px", "200px", "200px");
checkGridSizeTracksAndImageSize("grid-3", "img-3", "200px", "50px", "200px", "50px", "200px", "200px");
checkGridSizeTracksAndImageSize("grid-4", "img-4", "200px", "10px", "200px", "50px", "200px", "200px");
checkGridSizeTracksAndImageSize("grid-5", "img-5", "200px", "50px", "50px", "50px", "50px", "50px");
checkGridSizeTracksAndImageSize("grid-6", "img-6", "200px", "10px", "50px", "50px", "50px", "50px");
checkGridSizeTracksAndImageSize("grid-7", "img-7", "200px", "225px", "200px", "200px 25px", "200px", "200px");
checkGridSizeTracksAndImageSize("grid-8", "img-8", "10px", "10px", "200px", "50px 25px", "200px", "200px");
checkGridSizeTracksAndImageSize("grid-8", "img-8", "10px", "10px", "200px", "200px 25px", "200px", "200px");
checkGridSizeTracksAndImageSize("grid-9", "img-9", "200px", "125px", "200px", "100px 25px", "200px", "200px");
checkGridSizeTracksAndImageSize("grid-10", "img-10", "200px", "10px", "200px", "50px 25px", "200px", "200px");
checkGridSizeTracksAndImageSize("grid-10", "img-10", "200px", "10px", "200px", "100px 25px", "200px", "200px");
checkGridSizeTracksAndImageSize("grid-11", "img-11", "200px", "125px", "100px", "100px 25px", "100px", "100px");
checkGridSizeTracksAndImageSize("grid-12", "img-12", "200px", "10px", "100px", "50px 25px", "100px", "100px");
checkGridSizeTracksAndImageSize("grid-12", "img-12", "200px", "10px", "100px", "100px 25px", "100px", "100px");
checkGridSizeTracksAndImageSize("grid-13", "img-13", "200px", "200px", "200px", "200px", "200px", "200px");
checkGridSizeTracksAndImageSize("grid-14", "img-14", "10px", "10px", "200px", "200px", "200px", "200px");
checkGridSizeTracksAndImageSize("grid-15", "img-15", "200px", "200px", "200px", "200px", "200px", "200px");
Expand Down
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Original file line number Diff line number Diff line change
Expand Up @@ -15,8 +15,8 @@ None
------------------------------------------------------------------------
List of files:
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid-1/grid-items/support/100x100-green.png
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid-1/grid-items/support/100x50-green.png
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid-1/grid-items/support/200x200-green.png
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid-1/grid-items/support/25x50-green.png
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid-1/grid-items/support/500x500-green.png
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid-1/grid-items/support/50x100-green.png
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid-1/grid-items/support/50x25-green.png
/LayoutTests/imported/w3c/web-platform-tests/css/css-grid-1/grid-items/support/50x50-green.png
23 changes: 23 additions & 0 deletions Source/WebCore/ChangeLog
Original file line number Diff line number Diff line change
@@ -1,3 +1,26 @@
2017-09-12 Manuel Rego Casasnovas <rego@igalia.com>

[css-grid] Use transferred size over content size for automatic minimum size
https://bugs.webkit.org/show_bug.cgi?id=176688

Reviewed by Sergio Villar Senin.

CSS WG has agreed to modify the spec so now the transferred size is used
(if it exists) independently if it's bigger or smaller
than the content size.
See: https://github.com/w3c/csswg-drafts/issues/1149

The spec text (https://drafts.csswg.org/css-grid/#min-size-auto):
"The automatic minimum size for a grid item in a given dimension is
its specified size if it exists, otherwise its transferred size
if that exists, else its content size"

This patch use the WPT tests updated to check the new behavior.

* rendering/GridTrackSizingAlgorithm.cpp:
(WebCore::GridTrackSizingAlgorithmStrategy::minSizeForChild const):
Modified so it always returns the transferred size (if any).

2017-09-12 Fujii Hironori <Hironori.Fujii@sony.com>

[Freetype] Doesn't support coloured fonts
Expand Down
9 changes: 1 addition & 8 deletions Source/WebCore/rendering/GridTrackSizingAlgorithm.cpp
Original file line number Diff line number Diff line change
Expand Up @@ -786,15 +786,8 @@ LayoutUnit GridTrackSizingAlgorithmStrategy::minSizeForChild(RenderBox& child) c
const Length& childSize = isRowAxis ? child.style().logicalWidth() : child.style().logicalHeight();

bool overflowIsVisible = isRowAxis ? child.style().overflowInlineDirection() == OVISIBLE : child.style().overflowBlockDirection() == OVISIBLE;
if (!childSize.isAuto() || (childMinSize.isAuto() && overflowIsVisible)) {
if (child.isRenderReplaced() && childSize.isAuto()) {
// If the box has an aspect ratio and no specified size, its automatic
// minimum size is the smaller of its content size and its transferred
// size.
return isRowAxis ? std::min(child.intrinsicLogicalWidth(), minContentForChild(child)) : std::min(child.intrinsicLogicalHeight(), minContentForChild(child));
}
if (!childSize.isAuto() || (childMinSize.isAuto() && overflowIsVisible))
return minContentForChild(child);
}

bool overrideSizeHasChanged = updateOverrideContainingBlockContentSizeForChild(child, childInlineDirection);

Expand Down

0 comments on commit f86c527

Please sign in to comment.