From b8fa355a21344ba0bcbbd96923d3da571a91cab0 Mon Sep 17 00:00:00 2001 From: Aliaksandr Kalenik Date: Tue, 18 Mar 2025 21:44:24 +0100 Subject: [PATCH] LibWeb: Implement "transferred size suggestion" part of GFC spec --- .../LibWeb/Layout/GridFormattingContext.cpp | 33 ++++++++++++++-- .../LibWeb/Layout/GridFormattingContext.h | 1 + .../ref-filled-green-100px-square-image.html | 8 ++++ .../grid-items/support/100x100-green.png | Bin 0 -> 91 bytes .../grid-minimum-size-grid-items-008.html | 34 ++++++++++++++++ .../grid-minimum-size-grid-items-009.html | 37 ++++++++++++++++++ .../grid-items/support/200x200-green.png | Bin 0 -> 120451 bytes .../grid-items/support/50x25-green.png | Bin 0 -> 100 bytes 8 files changed, 109 insertions(+), 4 deletions(-) create mode 100644 Tests/LibWeb/Ref/expected/wpt-import/css/css-grid/grid-items/ref-filled-green-100px-square-image.html create mode 100644 Tests/LibWeb/Ref/expected/wpt-import/css/css-grid/grid-items/support/100x100-green.png create mode 100644 Tests/LibWeb/Ref/input/wpt-import/css/css-grid/grid-items/grid-minimum-size-grid-items-008.html create mode 100644 Tests/LibWeb/Ref/input/wpt-import/css/css-grid/grid-items/grid-minimum-size-grid-items-009.html create mode 100644 Tests/LibWeb/Ref/input/wpt-import/css/css-grid/grid-items/support/200x200-green.png create mode 100644 Tests/LibWeb/Ref/input/wpt-import/css/css-grid/grid-items/support/50x25-green.png diff --git a/Libraries/LibWeb/Layout/GridFormattingContext.cpp b/Libraries/LibWeb/Layout/GridFormattingContext.cpp index 30bd5fd16fd..bec973d9521 100644 --- a/Libraries/LibWeb/Layout/GridFormattingContext.cpp +++ b/Libraries/LibWeb/Layout/GridFormattingContext.cpp @@ -2548,16 +2548,41 @@ Optional GridFormattingContext::specified_size_suggestion(GridItem co return {}; } +Optional GridFormattingContext::transferred_size_suggestion(GridItem const& item, GridDimension dimension) const +{ + // https://www.w3.org/TR/css-grid-2/#transferred-size-suggestion + // If the item has a preferred aspect ratio and its preferred size in the opposite axis is definite, then the transferred + // size suggestion is that size (clamped by the opposite-axis minimum and maximum sizes if they are definite), converted + // through the aspect ratio. It is otherwise undefined. + if (!item.box->preferred_aspect_ratio().has_value()) { + return {}; + } + + CSS::Size const& preferred_size_in_opposite_axis = get_item_preferred_size(item, dimension == GridDimension::Column ? GridDimension::Row : GridDimension::Column); + if (preferred_size_in_opposite_axis.is_length()) { + auto opposite_axis_size = preferred_size_in_opposite_axis.length().to_px(item.box); + // FIXME: Clamp by opposite-axis minimum and maximum sizes if they are definite + return opposite_axis_size * item.box->preferred_aspect_ratio().value(); + } + + return {}; +} + CSSPixels GridFormattingContext::content_based_minimum_size(GridItem const& item, GridDimension const dimension) const { // https://www.w3.org/TR/css-grid-1/#content-based-minimum-size - // The content-based minimum size for a grid item in a given dimension is its specified size suggestion if it exists, - // otherwise its transferred size suggestion if that exists, - // else its content size suggestion, see below. + CSSPixels result = 0; + // The content-based minimum size for a grid item in a given dimension is its specified size suggestion if it exists, if (auto specified_size_suggestion = this->specified_size_suggestion(item, dimension); specified_size_suggestion.has_value()) { result = specified_size_suggestion.value(); - } else { + } + // otherwise its transferred size suggestion if that exists, + else if (auto transferred_size_suggestion = this->transferred_size_suggestion(item, dimension); transferred_size_suggestion.has_value()) { + result = transferred_size_suggestion.value(); + } + // else its content size suggestion. + else { result = content_size_suggestion(item, dimension); } diff --git a/Libraries/LibWeb/Layout/GridFormattingContext.h b/Libraries/LibWeb/Layout/GridFormattingContext.h index 9da3fe7169a..f13078f8f0f 100644 --- a/Libraries/LibWeb/Layout/GridFormattingContext.h +++ b/Libraries/LibWeb/Layout/GridFormattingContext.h @@ -336,6 +336,7 @@ private: CSSPixels content_size_suggestion(GridItem const&, GridDimension const) const; Optional specified_size_suggestion(GridItem const&, GridDimension const) const; + Optional transferred_size_suggestion(GridItem const&, GridDimension const) const; CSSPixels content_based_minimum_size(GridItem const&, GridDimension const) const; CSSPixels automatic_minimum_size(GridItem const&, GridDimension const) const; CSSPixels calculate_minimum_contribution(GridItem const&, GridDimension const) const; diff --git a/Tests/LibWeb/Ref/expected/wpt-import/css/css-grid/grid-items/ref-filled-green-100px-square-image.html b/Tests/LibWeb/Ref/expected/wpt-import/css/css-grid/grid-items/ref-filled-green-100px-square-image.html new file mode 100644 index 00000000000..5906160218c --- /dev/null +++ b/Tests/LibWeb/Ref/expected/wpt-import/css/css-grid/grid-items/ref-filled-green-100px-square-image.html @@ -0,0 +1,8 @@ + + +CSS Reftest Reference: 100x100 green square image + + +

Test passes if there is a filled green square and no red.

+ +Image download support must be enabled diff --git a/Tests/LibWeb/Ref/expected/wpt-import/css/css-grid/grid-items/support/100x100-green.png b/Tests/LibWeb/Ref/expected/wpt-import/css/css-grid/grid-items/support/100x100-green.png new file mode 100644 index 0000000000000000000000000000000000000000..25b76c3c6f216793a36b1f29287dafd993898c67 GIT binary patch literal 91 zcmeAS@N?(olHy`uVBq!ia0y~yU`PRBMrH;E1}`0UaRvqk<^Z1%SB3_LIX{<9WME(r s_H=O!sbEZApe@0=I6 + +CSS Grid Layout Test: Minimum size of grid items + + + + + + +

Test passes if there is a filled green square and no red.

+ +
+
+ Image download support must be enabled +
+ diff --git a/Tests/LibWeb/Ref/input/wpt-import/css/css-grid/grid-items/grid-minimum-size-grid-items-009.html b/Tests/LibWeb/Ref/input/wpt-import/css/css-grid/grid-items/grid-minimum-size-grid-items-009.html new file mode 100644 index 00000000000..9fe7e98368c --- /dev/null +++ b/Tests/LibWeb/Ref/input/wpt-import/css/css-grid/grid-items/grid-minimum-size-grid-items-009.html @@ -0,0 +1,37 @@ + + +CSS Grid Layout Test: Minimum size of grid items + + + + + + +

Test passes if there is a filled green square and no red.

+ +
+
+ Image download support must be enabled + Image download support must be enabled +
+ diff --git a/Tests/LibWeb/Ref/input/wpt-import/css/css-grid/grid-items/support/200x200-green.png b/Tests/LibWeb/Ref/input/wpt-import/css/css-grid/grid-items/support/200x200-green.png new file mode 100644 index 0000000000000000000000000000000000000000..e8b591f05b5e052e562443050898abc734c9b153 GIT binary patch literal 120451 zcmeAS@N?(olHy`uVBq!ia0y~yU^oH7983%h3`$m(Cm9$N7(87ZLn;^<^(i_zc9W`(?1V$6qXd0kN2#h8yngr{pp`!_FG!4)s1V$4UO@ejQ(9wi7 zng(bR0;36wCc!#t=xD+kO#?IufzgCTlVBY+bTna&rU9CSz-YpvNwAI@I-0OX(*R9E zU^HRTBv|npx>-hr6}A=tufpLXIhx3ZOH2+je~c!qK^7sy#W|x1Yq-SZAoIs)!Wv`| zGF+T9ny`jTOb#-Cj3%r>79qpMIim?{xWwcj^T%ky8e|bNT%0qSu!c)a4l;j?Caggg zA;ZNvqX}!c#N;6J$7sSDWDzo4oHLrRhD%HiGJg!tgr)gYeesA|3oyu11(lsMI1?F_ zJvnL|{X<|hVbMR#M}&=|32Q_|GyOd|ny}~}<|D$!(S$W3qM81l98FmC5AzXW<7mPf z5z$P4PmU%m`iJ?5uyHhDjfiNbzb8i%7X8C~MA$f*utr2Q)8CV$35)(=J|b)!O;{r$ znu+(Ml4HLKwbufSCNko~e^ez2AuyV-NC>P^rNoE8Xu={stVUIm5CWqKi-f=$RZ4sa zj3zAN!)jC|2_Z0=ut*53QKiI(z-YoEKCDJnk`Mx;35$fl8dXYs2#h8y;=^iGB?%!g zny^R+tWl-JhrnpUB0j7}Rgw?_qX~EyJvN%K1~&YMt?i=;YuHBZ zz}?%QSi?Sw2gZY=32R`& zec0PNny`j_6c3CCM-$e-g!{0!bu?iO`zRh54~{0RfeH6vZ|i8n8a7es7_?n8CRgU~nZ0YP)7cB{FIU-l%!FLtr#v;SQTo845yRG+|K? zc%xczhrnpU!W}lFG8BZsXu_f(@J6-b4uR2xg*$9UWhe-N(S$`o;Eig<9Ri~X3wPLz z%1{sjqX~V89HV}xW(bTXENX`4s9Eq37)@C4pcrLPGXzEx z7Bxe2)GT-ij3z92P>eFD83LmTi<+T1Y8E^MMiUl1C`K9741v*vMa|G0H47dBqX`Qh z6r&7khQMgTqGo80ngtJm(S!vLictnNLtr#vQ8P40&4P!(Xu^UA#lSIK*NEf{=d}Q% ziEQA~*08pDG+_}+tZg153G3YKy9~p5Ex@o&V+=zikqz%i7>>RhO<2P*RtJHfMibT`h=k$jgwcdG z9AkA5_-Qm@4T4A*j!qa&Si><^2Z5hP6V@PzgyHCf(S$V|V|5VtX*6LCf=C#SP8dyC z!!cF|fuBYb)*y(4;pl|Xgf$#vbrASzG+_;bNEp;ksGJfbLE&0}(L^?=V|eH~ZZu&H z-MAanE+0);gF1SKuH!}%*3gZ+LGAL(2)k`GVGZHP8_Z50O<03Dc80LqMibT$ zj=aI_^wEShm}6%MyKOXK4dKWe%uXLoSc5rshOpacp0JpYwyzsq3owLJ2o;=8^F&4k zH;x)H1VdmnVGY4Z8wySyO;|%AmWH4kM-$c%jI^QP&0q7}OBxlVuXHd~%>4B