diff --git a/Tests/LibWeb/Layout/expected/grid/basic.txt b/Tests/LibWeb/Layout/expected/grid/basic.txt index 517c143baa..499a31afc4 100644 --- a/Tests/LibWeb/Layout/expected/grid/basic.txt +++ b/Tests/LibWeb/Layout/expected/grid/basic.txt @@ -4,30 +4,30 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline Box at (8,8) content-size 784x34.9375 [GFC] children: not-inline BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (8,8) content-size 392.140625x17.46875 [BFC] children: inline + BlockContainer at (8,8) content-size 392x17.46875 [BFC] children: inline line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 frag 0 from TextNode start: 0, length: 1, rect: [8,8 6.34375x17.46875] "1" TextNode <#text> BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (400.140625,8) content-size 392x17.46875 [BFC] children: inline + BlockContainer at (400,8) content-size 392x17.46875 [BFC] children: inline line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 - frag 0 from TextNode start: 0, length: 1, rect: [400.140625,8 8.8125x17.46875] + frag 0 from TextNode start: 0, length: 1, rect: [400,8 8.8125x17.46875] "2" TextNode <#text> BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (8,25.46875) content-size 392.140625x17.46875 [BFC] children: inline + BlockContainer at (8,25.46875) content-size 392x17.46875 [BFC] children: inline line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 frag 0 from TextNode start: 0, length: 1, rect: [8,25.46875 9.09375x17.46875] "3" TextNode <#text> BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (400.140625,25.46875) content-size 392x17.46875 [BFC] children: inline + BlockContainer at (400,25.46875) content-size 392x17.46875 [BFC] children: inline line 0 width: 7.75, height: 17.46875, bottom: 17.46875, baseline: 13.53125 - frag 0 from TextNode start: 0, length: 1, rect: [400.140625,25.46875 7.75x17.46875] + frag 0 from TextNode start: 0, length: 1, rect: [400,25.46875 7.75x17.46875] "4" TextNode <#text> BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline diff --git a/Tests/LibWeb/Layout/expected/grid/borders.txt b/Tests/LibWeb/Layout/expected/grid/borders.txt index ac82923265..1ed18bc3ee 100644 --- a/Tests/LibWeb/Layout/expected/grid/borders.txt +++ b/Tests/LibWeb/Layout/expected/grid/borders.txt @@ -4,30 +4,30 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline Box at (8,8) content-size 784x74.9375 [GFC] children: not-inline BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (18,18) content-size 372.140625x17.46875 [BFC] children: inline + BlockContainer at (18,18) content-size 372x17.46875 [BFC] children: inline line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 frag 0 from TextNode start: 0, length: 1, rect: [18,18 6.34375x17.46875] "1" TextNode <#text> BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (410.140625,18) content-size 372x17.46875 [BFC] children: inline + BlockContainer at (410,18) content-size 372x17.46875 [BFC] children: inline line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 - frag 0 from TextNode start: 0, length: 1, rect: [410.140625,18 8.8125x17.46875] + frag 0 from TextNode start: 0, length: 1, rect: [410,18 8.8125x17.46875] "2" TextNode <#text> BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (18,55.46875) content-size 372.140625x17.46875 [BFC] children: inline + BlockContainer at (18,55.46875) content-size 372x17.46875 [BFC] children: inline line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 frag 0 from TextNode start: 0, length: 1, rect: [18,55.46875 9.09375x17.46875] "3" TextNode <#text> BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (410.140625,55.46875) content-size 372x17.46875 [BFC] children: inline + BlockContainer at (410,55.46875) content-size 372x17.46875 [BFC] children: inline line 0 width: 7.75, height: 17.46875, bottom: 17.46875, baseline: 13.53125 - frag 0 from TextNode start: 0, length: 1, rect: [410.140625,55.46875 7.75x17.46875] + frag 0 from TextNode start: 0, length: 1, rect: [410,55.46875 7.75x17.46875] "4" TextNode <#text> BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline @@ -37,30 +37,30 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline Box at (8,82.9375) content-size 784x107.46875 [GFC] children: not-inline BlockContainer <(anonymous)> at (8,82.9375) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (18,92.9375) content-size 372.140625x50 [BFC] children: inline + BlockContainer at (18,92.9375) content-size 372x50 [BFC] children: inline line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 frag 0 from TextNode start: 0, length: 1, rect: [18,92.9375 6.34375x17.46875] "1" TextNode <#text> BlockContainer <(anonymous)> at (8,82.9375) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (410.140625,92.9375) content-size 372x50 [BFC] children: inline + BlockContainer at (410,92.9375) content-size 372x50 [BFC] children: inline line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 - frag 0 from TextNode start: 0, length: 1, rect: [410.140625,92.9375 8.8125x17.46875] + frag 0 from TextNode start: 0, length: 1, rect: [410,92.9375 8.8125x17.46875] "2" TextNode <#text> BlockContainer <(anonymous)> at (8,82.9375) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (18,162.9375) content-size 372.140625x17.46875 [BFC] children: inline + BlockContainer at (18,162.9375) content-size 372x17.46875 [BFC] children: inline line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 frag 0 from TextNode start: 0, length: 1, rect: [18,162.9375 9.09375x17.46875] "3" TextNode <#text> BlockContainer <(anonymous)> at (8,82.9375) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (410.140625,162.9375) content-size 372x17.46875 [BFC] children: inline + BlockContainer at (410,162.9375) content-size 372x17.46875 [BFC] children: inline line 0 width: 7.75, height: 17.46875, bottom: 17.46875, baseline: 13.53125 - frag 0 from TextNode start: 0, length: 1, rect: [410.140625,162.9375 7.75x17.46875] + frag 0 from TextNode start: 0, length: 1, rect: [410,162.9375 7.75x17.46875] "4" TextNode <#text> BlockContainer <(anonymous)> at (8,82.9375) content-size 0x0 [BFC] children: inline @@ -70,30 +70,30 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline Box at (8,190.40625) content-size 784x84.9375 [GFC] children: not-inline BlockContainer <(anonymous)> at (8,190.40625) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (18,200.40625) content-size 347.140625x17.46875 [BFC] children: inline + BlockContainer at (18,200.40625) content-size 347x17.46875 [BFC] children: inline line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 frag 0 from TextNode start: 0, length: 1, rect: [18,200.40625 6.34375x17.46875] "1" TextNode <#text> BlockContainer <(anonymous)> at (8,190.40625) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (435.140625,200.40625) content-size 347x17.46875 [BFC] children: inline + BlockContainer at (435,200.40625) content-size 347x17.46875 [BFC] children: inline line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 - frag 0 from TextNode start: 0, length: 1, rect: [435.140625,200.40625 8.8125x17.46875] + frag 0 from TextNode start: 0, length: 1, rect: [435,200.40625 8.8125x17.46875] "2" TextNode <#text> BlockContainer <(anonymous)> at (8,190.40625) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (18,247.875) content-size 347.140625x17.46875 [BFC] children: inline + BlockContainer at (18,247.875) content-size 347x17.46875 [BFC] children: inline line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 frag 0 from TextNode start: 0, length: 1, rect: [18,247.875 9.09375x17.46875] "3" TextNode <#text> BlockContainer <(anonymous)> at (8,190.40625) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (435.140625,247.875) content-size 347x17.46875 [BFC] children: inline + BlockContainer at (435,247.875) content-size 347x17.46875 [BFC] children: inline line 0 width: 7.75, height: 17.46875, bottom: 17.46875, baseline: 13.53125 - frag 0 from TextNode start: 0, length: 1, rect: [435.140625,247.875 7.75x17.46875] + frag 0 from TextNode start: 0, length: 1, rect: [435,247.875 7.75x17.46875] "4" TextNode <#text> BlockContainer <(anonymous)> at (8,190.40625) content-size 0x0 [BFC] children: inline @@ -103,14 +103,14 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline Box at (8,275.34375) content-size 784x90.9375 [GFC] children: not-inline BlockContainer <(anonymous)> at (8,275.34375) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (445.934356,285.34375) content-size 337.300018x17.46875 [BFC] children: inline + BlockContainer at (444.699981,285.34375) content-size 337.300018x17.46875 [BFC] children: inline line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 - frag 0 from TextNode start: 0, length: 1, rect: [445.934356,285.34375 6.34375x17.46875] + frag 0 from TextNode start: 0, length: 1, rect: [444.699981,285.34375 6.34375x17.46875] "1" TextNode <#text> BlockContainer <(anonymous)> at (8,275.34375) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (18,338.8125) content-size 338.534362x17.46875 [BFC] children: inline + BlockContainer at (18,338.8125) content-size 337.299987x17.46875 [BFC] children: inline line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 frag 0 from TextNode start: 0, length: 1, rect: [18,338.8125 8.8125x17.46875] "2" diff --git a/Tests/LibWeb/Layout/expected/grid/grid-gap-1.txt b/Tests/LibWeb/Layout/expected/grid/grid-gap-1.txt index 0f271c9117..4b73827a4f 100644 --- a/Tests/LibWeb/Layout/expected/grid/grid-gap-1.txt +++ b/Tests/LibWeb/Layout/expected/grid/grid-gap-1.txt @@ -2,23 +2,23 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline BlockContainer at (0,0) content-size 800x600 [BFC] children: not-inline BlockContainer at (8,8) content-size 784x84.9375 children: not-inline Box at (8,8) content-size 784x84.9375 [GFC] children: not-inline - BlockContainer at (8,8) content-size 342.140625x17.46875 [BFC] children: inline + BlockContainer at (8,8) content-size 342x17.46875 [BFC] children: inline line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 frag 0 from TextNode start: 0, length: 1, rect: [8,8 6.34375x17.46875] "1" TextNode <#text> - BlockContainer at (450.140625,8) content-size 342x17.46875 [BFC] children: inline + BlockContainer at (450,8) content-size 342x17.46875 [BFC] children: inline line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 - frag 0 from TextNode start: 0, length: 1, rect: [450.140625,8 8.8125x17.46875] + frag 0 from TextNode start: 0, length: 1, rect: [450,8 8.8125x17.46875] "2" TextNode <#text> - BlockContainer at (8,75.46875) content-size 342.140625x17.46875 [BFC] children: inline + BlockContainer at (8,75.46875) content-size 342x17.46875 [BFC] children: inline line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 frag 0 from TextNode start: 0, length: 1, rect: [8,75.46875 9.09375x17.46875] "3" TextNode <#text> - BlockContainer at (450.140625,75.46875) content-size 342x17.46875 [BFC] children: inline + BlockContainer at (450,75.46875) content-size 342x17.46875 [BFC] children: inline line 0 width: 7.75, height: 17.46875, bottom: 17.46875, baseline: 13.53125 - frag 0 from TextNode start: 0, length: 1, rect: [450.140625,75.46875 7.75x17.46875] + frag 0 from TextNode start: 0, length: 1, rect: [450,75.46875 7.75x17.46875] "4" TextNode <#text> diff --git a/Tests/LibWeb/Layout/expected/grid/grid-gap-2.txt b/Tests/LibWeb/Layout/expected/grid/grid-gap-2.txt index 55959efe94..754f200f64 100644 --- a/Tests/LibWeb/Layout/expected/grid/grid-gap-2.txt +++ b/Tests/LibWeb/Layout/expected/grid/grid-gap-2.txt @@ -2,12 +2,12 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline BlockContainer at (0,0) content-size 800x600 [BFC] children: not-inline BlockContainer at (8,8) content-size 784x50.9375 children: not-inline Box at (8,8) content-size 784x50.9375 [GFC] children: not-inline - BlockContainer at (435.934356,8) content-size 357.300018x17.46875 [BFC] children: inline + BlockContainer at (434.699981,8) content-size 357.300018x17.46875 [BFC] children: inline line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 - frag 0 from TextNode start: 0, length: 1, rect: [435.934356,8 6.34375x17.46875] + frag 0 from TextNode start: 0, length: 1, rect: [434.699981,8 6.34375x17.46875] "1" TextNode <#text> - BlockContainer at (8,41.46875) content-size 358.534362x17.46875 [BFC] children: inline + BlockContainer at (8,41.46875) content-size 357.299987x17.46875 [BFC] children: inline line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 frag 0 from TextNode start: 0, length: 1, rect: [8,41.46875 8.8125x17.46875] "2" diff --git a/Tests/LibWeb/Layout/expected/grid/minmax-2.txt b/Tests/LibWeb/Layout/expected/grid/minmax-2.txt index 5c8b5715ee..949ffefa84 100644 --- a/Tests/LibWeb/Layout/expected/grid/minmax-2.txt +++ b/Tests/LibWeb/Layout/expected/grid/minmax-2.txt @@ -1,13 +1,13 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline BlockContainer at (0,0) content-size 800x600 [BFC] children: not-inline - BlockContainer at (8,8) content-size 784x50 children: not-inline - Box at (8,8) content-size 784x50 [GFC] children: not-inline - BlockContainer at (8,8) content-size 300x25 [BFC] children: inline + BlockContainer at (8,8) content-size 784x100 children: not-inline + Box at (8,8) content-size 784x100 [GFC] children: not-inline + BlockContainer at (8,8) content-size 300x50 [BFC] children: inline line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 frag 0 from TextNode start: 0, length: 1, rect: [8,8 6.34375x17.46875] "1" TextNode <#text> - BlockContainer at (308,8) content-size 300x25 [BFC] children: inline + BlockContainer at (308,8) content-size 300x50 [BFC] children: inline line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 frag 0 from TextNode start: 0, length: 1, rect: [308,8 8.8125x17.46875] "2" diff --git a/Tests/LibWeb/Layout/expected/grid/named-tracks.txt b/Tests/LibWeb/Layout/expected/grid/named-tracks.txt index e9d956475b..e0a0414077 100644 --- a/Tests/LibWeb/Layout/expected/grid/named-tracks.txt +++ b/Tests/LibWeb/Layout/expected/grid/named-tracks.txt @@ -11,7 +11,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline TextNode <#text> BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (400,8) content-size 393.234375x17.46875 [BFC] children: inline + BlockContainer at (400,8) content-size 392x17.46875 [BFC] children: inline line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 frag 0 from TextNode start: 0, length: 1, rect: [400,8 8.8125x17.46875] "2" diff --git a/Tests/LibWeb/Layout/expected/grid/positions-and-spans.txt b/Tests/LibWeb/Layout/expected/grid/positions-and-spans.txt index 44a106c94a..73e5b91230 100644 --- a/Tests/LibWeb/Layout/expected/grid/positions-and-spans.txt +++ b/Tests/LibWeb/Layout/expected/grid/positions-and-spans.txt @@ -4,16 +4,16 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline Box at (8,8) content-size 784x17.46875 [GFC] children: not-inline BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (8,8) content-size 522.666748x17.46875 [BFC] children: inline + BlockContainer at (8,8) content-size 2613.33374x17.46875 [BFC] children: inline line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 frag 0 from TextNode start: 0, length: 1, rect: [8,8 6.34375x17.46875] "1" TextNode <#text> BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (530.666748,8) content-size 261.333496x17.46875 [BFC] children: inline + BlockContainer at (2621.33374,8) content-size 1306.666992x17.46875 [BFC] children: inline line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 - frag 0 from TextNode start: 0, length: 1, rect: [530.666748,8 8.8125x17.46875] + frag 0 from TextNode start: 0, length: 1, rect: [2621.33374,8 8.8125x17.46875] "2" TextNode <#text> BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline @@ -25,16 +25,16 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline Box at (8,25.46875) content-size 784x17.46875 [GFC] children: not-inline BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (8,25.46875) content-size 261.333374x17.46875 [BFC] children: inline + BlockContainer at (8,25.46875) content-size 1306.666748x17.46875 [BFC] children: inline line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 frag 0 from TextNode start: 0, length: 1, rect: [8,25.46875 6.34375x17.46875] "1" TextNode <#text> BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (269.333374,25.46875) content-size 522.66687x17.46875 [BFC] children: inline + BlockContainer at (1314.666748,25.46875) content-size 2613.333984x17.46875 [BFC] children: inline line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 - frag 0 from TextNode start: 0, length: 1, rect: [269.333374,25.46875 8.8125x17.46875] + frag 0 from TextNode start: 0, length: 1, rect: [1314.666748,25.46875 8.8125x17.46875] "2" TextNode <#text> BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline diff --git a/Tests/LibWeb/Layout/expected/grid/row-height.txt b/Tests/LibWeb/Layout/expected/grid/row-height.txt index 5de281eb9d..fc69765e75 100644 --- a/Tests/LibWeb/Layout/expected/grid/row-height.txt +++ b/Tests/LibWeb/Layout/expected/grid/row-height.txt @@ -4,30 +4,30 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline Box at (8,8) content-size 784x67.46875 [GFC] children: not-inline BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (8,8) content-size 392.140625x50 [BFC] children: inline + BlockContainer at (8,8) content-size 392x50 [BFC] children: inline line 0 width: 6.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 frag 0 from TextNode start: 0, length: 1, rect: [8,8 6.34375x17.46875] "1" TextNode <#text> BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (400.140625,8) content-size 392x50 [BFC] children: inline + BlockContainer at (400,8) content-size 392x50 [BFC] children: inline line 0 width: 8.8125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 - frag 0 from TextNode start: 0, length: 1, rect: [400.140625,8 8.8125x17.46875] + frag 0 from TextNode start: 0, length: 1, rect: [400,8 8.8125x17.46875] "2" TextNode <#text> BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (8,58) content-size 392.140625x17.46875 [BFC] children: inline + BlockContainer at (8,58) content-size 392x17.46875 [BFC] children: inline line 0 width: 9.09375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 frag 0 from TextNode start: 0, length: 1, rect: [8,58 9.09375x17.46875] "3" TextNode <#text> BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline TextNode <#text> - BlockContainer at (400.140625,58) content-size 392x17.46875 [BFC] children: inline + BlockContainer at (400,58) content-size 392x17.46875 [BFC] children: inline line 0 width: 7.75, height: 17.46875, bottom: 17.46875, baseline: 13.53125 - frag 0 from TextNode start: 0, length: 1, rect: [400.140625,58 7.75x17.46875] + frag 0 from TextNode start: 0, length: 1, rect: [400,58 7.75x17.46875] "4" TextNode <#text> BlockContainer <(anonymous)> at (8,8) content-size 0x0 [BFC] children: inline diff --git a/Tests/LibWeb/Layout/input/grid/minmax-2.html b/Tests/LibWeb/Layout/input/grid/minmax-2.html index 3f0b214aea..430d4d34b4 100644 --- a/Tests/LibWeb/Layout/input/grid/minmax-2.html +++ b/Tests/LibWeb/Layout/input/grid/minmax-2.html @@ -3,7 +3,6 @@ display: grid; background-color: lightsalmon; grid-template-columns: minmax(150px, 300px) minmax(150px, 300px); - /* FIXME: We currently does not layout this correctly. Rows take 25px even if 50px are available. */ grid-template-rows: minmax(25px, 50px) minmax(25px, 50px); } diff --git a/Tests/LibWeb/Layout/layout_test.sh b/Tests/LibWeb/Layout/layout_test.sh index ddc2855783..e52103ac49 100755 --- a/Tests/LibWeb/Layout/layout_test.sh +++ b/Tests/LibWeb/Layout/layout_test.sh @@ -12,7 +12,7 @@ fi BROWSER_BINARY="./headless-browser" -find "${SCRIPT_DIR}/input/grid" -type f -name "*.html" -print0 | while IFS= read -r -d '' input_html_path; do +find "${SCRIPT_DIR}/input/" -type f -name "*.html" -print0 | while IFS= read -r -d '' input_html_path; do input_html_file=${input_html_path/${SCRIPT_DIR}"/input/"/} input_html_file=${input_html_file/".html"/} diff --git a/Userland/Libraries/LibWeb/Layout/GridFormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/GridFormattingContext.cpp index fbada30f13..868e41bcaa 100644 --- a/Userland/Libraries/LibWeb/Layout/GridFormattingContext.cpp +++ b/Userland/Libraries/LibWeb/Layout/GridFormattingContext.cpp @@ -95,7 +95,7 @@ int GridFormattingContext::count_of_repeated_auto_fill_or_fit_tracks(Vector((get_free_space(available_space.width, m_grid_columns) / sum_of_grid_track_sizes).value())); + return max(1, static_cast((get_free_space(available_space.width, m_grid_columns).to_px() / sum_of_grid_track_sizes).value())); // For the purpose of finding the number of auto-repeated tracks in a standalone axis, the UA must // floor the track size to a UA-specified value to avoid division by zero. It is suggested that this @@ -639,20 +639,24 @@ void GridFormattingContext::run_track_sizing(GridDimension const dimension, Avai switch (track.min_track_sizing_function.type()) { // - A fixed sizing function // Resolve to an absolute length and use that size as the track’s initial base size. - case CSS::GridSize::Type::Length: + case CSS::GridSize::Type::Length: { if (!track.min_track_sizing_function.length().is_auto()) track.base_size = track.min_track_sizing_function.length().to_px(grid_container()); break; - case CSS::GridSize::Type::Percentage: + } + case CSS::GridSize::Type::Percentage: { if (track_available_size.is_definite()) track.base_size = track.min_track_sizing_function.percentage().as_fraction() * track_available_size.to_px().value(); break; + } // - An intrinsic sizing function // Use an initial base size of zero. case CSS::GridSize::Type::FlexibleLength: case CSS::GridSize::Type::MaxContent: - case CSS::GridSize::Type::MinContent: + case CSS::GridSize::Type::MinContent: { + track.base_size = 0; break; + } default: VERIFY_NOT_REACHED(); } @@ -661,36 +665,40 @@ void GridFormattingContext::run_track_sizing(GridDimension const dimension, Avai switch (track.max_track_sizing_function.type()) { // - A fixed sizing function // Resolve to an absolute length and use that size as the track’s initial growth limit. - case CSS::GridSize::Type::Length: + case CSS::GridSize::Type::Length: { if (!track.max_track_sizing_function.length().is_auto()) track.growth_limit = track.max_track_sizing_function.length().to_px(grid_container()); else // - An intrinsic sizing function // Use an initial growth limit of infinity. - track.growth_limit = -1; + track.growth_limit = INFINITY; break; - case CSS::GridSize::Type::Percentage: + } + case CSS::GridSize::Type::Percentage: { if (track_available_size.is_definite()) track.growth_limit = track.max_track_sizing_function.percentage().as_fraction() * track_available_size.to_px().value(); break; + } // - A flexible sizing function // Use an initial growth limit of infinity. - case CSS::GridSize::Type::FlexibleLength: - track.growth_limit = -1; + case CSS::GridSize::Type::FlexibleLength: { + track.growth_limit = INFINITY; break; + } // - An intrinsic sizing function // Use an initial growth limit of infinity. case CSS::GridSize::Type::MaxContent: - case CSS::GridSize::Type::MinContent: - track.growth_limit = -1; + case CSS::GridSize::Type::MinContent: { + track.growth_limit = INFINITY; break; + } default: VERIFY_NOT_REACHED(); } // In all cases, if the growth limit is less than the base size, increase the growth limit to match // the base size. - if (track.growth_limit != -1 && track.growth_limit < track.base_size) + if (track.growth_limit < track.base_size) track.growth_limit = track.base_size; } @@ -834,7 +842,7 @@ void GridFormattingContext::run_track_sizing(GridDimension const dimension, Avai // In all cases, if a track’s growth limit is now less than its base size, increase the growth limit // to match the base size. - if (track.growth_limit != -1 && track.growth_limit < track.base_size) + if (track.growth_limit < track.base_size) track.growth_limit = track.base_size; ++index; @@ -918,6 +926,11 @@ void GridFormattingContext::run_track_sizing(GridDimension const dimension, Avai // FIXME: 5. If any track still has an infinite growth limit (because, for example, it had no items placed in // it or it is a flexible track), set its growth limit to its base size. + for (auto& track : tracks) { + if (track.growth_limit == INFINITY) { + track.growth_limit = track.base_size; + } + } // https://www.w3.org/TR/css-grid-2/#extra-space // 12.5.1. Distributing Extra Space Across Spanned Tracks @@ -945,7 +958,7 @@ void GridFormattingContext::run_track_sizing(GridDimension const dimension, Avai for (auto& track : tracks) { if (track.is_gap) continue; - track.space_to_distribute = max(CSSPixels(0), (track.growth_limit == -1 ? track.base_size : track.growth_limit) - track.base_size); + track.space_to_distribute = max(CSSPixels(0), track.growth_limit - track.base_size); } auto remaining_free_space = track_available_size.is_definite() ? track_available_size.to_px() - sum_of_track_sizes : 0; @@ -1018,27 +1031,36 @@ void GridFormattingContext::run_track_sizing(GridDimension const dimension, Avai // https://www.w3.org/TR/css-grid-2/#algo-grow-tracks // 12.6. Maximize Tracks + auto get_free_space_px = [&]() -> CSSPixels { + // For the purpose of this step: if sizing the grid container under a max-content constraint, the + // free space is infinite; if sizing under a min-content constraint, the free space is zero. + auto free_space = get_free_space(track_available_size, tracks); + if (free_space.is_max_content()) { + return INFINITY; + } else if (free_space.is_min_content()) { + return 0; + } else { + return free_space.to_px(); + } + }; + + auto free_space_px = get_free_space_px(); + // If the free space is positive, distribute it equally to the base sizes of all tracks, freezing // tracks as they reach their growth limits (and continuing to grow the unfrozen tracks as needed). - auto free_space = get_free_space(track_available_size, tracks); - while (free_space > 0) { - auto free_space_to_distribute_per_track = free_space / (tracks.size() - count_of_gap_tracks(tracks)); + while (free_space_px > 0) { + auto free_space_to_distribute_per_track = free_space_px / (tracks.size() - count_of_gap_tracks(tracks)); for (auto& track : tracks) { if (track.is_gap) continue; - if (track.growth_limit != -1) - track.base_size = min(track.growth_limit, track.base_size + free_space_to_distribute_per_track); - else - track.base_size = track.base_size + free_space_to_distribute_per_track; + VERIFY(track.growth_limit != INFINITY); + track.base_size = min(track.growth_limit, track.base_size + free_space_to_distribute_per_track); } - if (get_free_space(track_available_size, tracks) == free_space) + if (get_free_space_px() == free_space_px) break; - free_space = get_free_space(track_available_size, tracks); + free_space_px = get_free_space_px(); } - // For the purpose of this step: if sizing the grid container under a max-content constraint, the - // free space is infinite; if sizing under a min-content constraint, the free space is zero. - // If this would cause the grid to be larger than the grid container’s inner size as limited by its // max-width/height, then redo this step, treating the available grid space as equal to the grid // container’s inner size when it’s sized to its max-width/height. @@ -1048,84 +1070,65 @@ void GridFormattingContext::run_track_sizing(GridDimension const dimension, Avai // This step sizes flexible tracks using the largest value it can assign to an fr without exceeding // the available space. - // First, find the grid’s used flex fraction: - auto flex_factor_sum = 0; - for (auto& track : tracks) { - if (track.min_track_sizing_function.is_flexible_length()) - flex_factor_sum++; - } - // See 12.7.1. - // Let flex factor sum be the sum of the flex factors of the flexible tracks. If this value is less - // than 1, set it to 1 instead. - if (flex_factor_sum < 1) - flex_factor_sum = 1; + auto find_the_size_of_an_fr = [&]() -> CSSPixels { + // https://www.w3.org/TR/css-grid-2/#algo-find-fr-size - // See 12.7.1. - CSSPixels sized_column_widths = 0; - for (auto& track : tracks) { - if (!track.min_track_sizing_function.is_flexible_length()) - sized_column_widths += track.base_size; - } - // Let leftover space be the space to fill minus the base sizes of the non-flexible grid tracks. - CSSPixels leftover_space = track_available_size.is_definite() ? track_available_size.to_px() - sized_column_widths : 0; + VERIFY(track_available_size.is_definite()); - // If the free space is zero or if sizing the grid container under a min-content constraint: - // The used flex fraction is zero. - // FIXME: Add min-content constraint check. - - // Otherwise, if the free space is a definite length: - // The used flex fraction is the result of finding the size of an fr using all of the grid tracks - // and a space to fill of the available grid space. - if (leftover_space > 0) { + // 1. Let leftover space be the space to fill minus the base sizes of the non-flexible grid tracks. + auto leftover_space = track_available_size.to_px(); for (auto& track : tracks) { - if (track.min_track_sizing_function.is_flexible_length()) { - // See 12.7.1. - // Let the hypothetical fr size be the leftover space divided by the flex factor sum. - auto hypothetical_fr_size = leftover_space / flex_factor_sum; - // For each flexible track, if the product of the used flex fraction and the track’s flex factor is - // greater than the track’s base size, set its base size to that product. - track.base_size = max(track.base_size, hypothetical_fr_size); + if (!track.max_track_sizing_function.is_flexible_length()) { + leftover_space -= track.base_size; } } + + // 2. Let flex factor sum be the sum of the flex factors of the flexible tracks. + // If this value is less than 1, set it to 1 instead. + auto flex_factor_sum = 0; + for (auto& track : tracks) { + if (track.max_track_sizing_function.is_flexible_length()) + flex_factor_sum++; + } + if (flex_factor_sum < 1) + flex_factor_sum = 1; + + // 3. Let the hypothetical fr size be the leftover space divided by the flex factor sum. + auto hypothetical_fr_size = leftover_space / flex_factor_sum; + + // FIXME: 4. If the product of the hypothetical fr size and a flexible track’s flex factor is less than the track’s + // base size, restart this algorithm treating all such tracks as inflexible. + + // 5. Return the hypothetical fr size. + return hypothetical_fr_size; + }; + + // First, find the grid’s used flex fraction: + auto flex_fraction = [&]() { + auto free_space = get_free_space(track_available_size, tracks); + // If the free space is zero or if sizing the grid container under a min-content constraint: + if (free_space.to_px() == 0 || track_available_size.is_min_content()) { + // The used flex fraction is zero. + return CSSPixels(0); + // Otherwise, if the free space is a definite length: + } else if (free_space.is_definite()) { + // The used flex fraction is the result of finding the size of an fr using all of the grid tracks and a space + // to fill of the available grid space. + return find_the_size_of_an_fr(); + } else { + // FIXME + return CSSPixels(0); + } + }(); + + // For each flexible track, if the product of the used flex fraction and the track’s flex factor is greater than + // the track’s base size, set its base size to that product. + for (auto& track : tracks) { + if (track.max_track_sizing_function.flexible_length() * flex_fraction > track.base_size) { + track.base_size = track.max_track_sizing_function.flexible_length() * flex_fraction; + } } - // Otherwise, if the free space is an indefinite length: - // FIXME: No tracks will have indefinite length as per current implementation. - - // The used flex fraction is the maximum of: - // For each flexible track, if the flexible track’s flex factor is greater than one, the result of - // dividing the track’s base size by its flex factor; otherwise, the track’s base size. - - // For each grid item that crosses a flexible track, the result of finding the size of an fr using - // all the grid tracks that the item crosses and a space to fill of the item’s max-content - // contribution. - - // If using this flex fraction would cause the grid to be smaller than the grid container’s - // min-width/height (or larger than the grid container’s max-width/height), then redo this step, - // treating the free space as definite and the available grid space as equal to the grid container’s - // inner size when it’s sized to its min-width/height (max-width/height). - - // For each flexible track, if the product of the used flex fraction and the track’s flex factor is - // greater than the track’s base size, set its base size to that product. - - // https://drafts.csswg.org/css-grid/#algo-find-fr-size - // 12.7.1. Find the Size of an fr - - // This algorithm finds the largest size that an fr unit can be without exceeding the target size. - // It must be called with a set of grid tracks and some quantity of space to fill. - - // 1. Let leftover space be the space to fill minus the base sizes of the non-flexible grid tracks. - - // 2. Let flex factor sum be the sum of the flex factors of the flexible tracks. If this value is less - // than 1, set it to 1 instead. - - // 3. Let the hypothetical fr size be the leftover space divided by the flex factor sum. - - // FIXME: 4. If the product of the hypothetical fr size and a flexible track’s flex factor is less than the - // track’s base size, restart this algorithm treating all such tracks as inflexible. - - // 5. Return the hypothetical fr size. - // https://drafts.csswg.org/css-grid/#algo-stretch // 12.8. Stretch auto Tracks @@ -1505,19 +1508,20 @@ bool GridFormattingContext::is_auto_positioned_track(CSS::GridTrackPlacement con return grid_track_start.is_auto_positioned() && grid_track_end.is_auto_positioned(); } -CSSPixels GridFormattingContext::get_free_space(AvailableSize const& available_size, Vector const& tracks) const +AvailableSize GridFormattingContext::get_free_space(AvailableSize const& available_size, Vector const& tracks) const { // https://www.w3.org/TR/css-grid-2/#algo-terms // free space: Equal to the available grid space minus the sum of the base sizes of all the grid // tracks (including gutters), floored at zero. If available grid space is indefinite, the free // space is indefinite as well. - // FIXME: do indefinite space - if (!available_size.is_definite()) - return 0; - CSSPixels sum_base_sizes = 0; - for (auto& track : tracks) - sum_base_sizes += track.base_size; - return max(CSSPixels(0), available_size.to_px() - sum_base_sizes); + if (available_size.is_definite()) { + CSSPixels sum_base_sizes = 0; + for (auto& track : tracks) + sum_base_sizes += track.base_size; + return AvailableSize::make_definite(max(CSSPixels(0), available_size.to_px() - sum_base_sizes)); + } + + return available_size; } int GridFormattingContext::get_line_index_by_line_name(String const& needle, CSS::GridTrackSizeList grid_track_size_list) diff --git a/Userland/Libraries/LibWeb/Layout/GridFormattingContext.h b/Userland/Libraries/LibWeb/Layout/GridFormattingContext.h index 627931baa0..fa3feaa6f0 100644 --- a/Userland/Libraries/LibWeb/Layout/GridFormattingContext.h +++ b/Userland/Libraries/LibWeb/Layout/GridFormattingContext.h @@ -145,7 +145,7 @@ private: Vector m_grid_items; Vector> m_boxes_to_place; - CSSPixels get_free_space(AvailableSize const& available_size, Vector const& tracks) const; + AvailableSize get_free_space(AvailableSize const& available_size, Vector const& tracks) const; int get_line_index_by_line_name(String const& line_name, CSS::GridTrackSizeList); CSSPixels resolve_definite_track_size(CSS::GridSize const&, AvailableSpace const&);