mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2024-12-30 22:54:35 +03:00
LibWeb: Align GridFormattingContext::run_track_sizing() with the spec
1. Stop using -1 to indicate infinity value of growth limit. Just use INFINITY for that. 2. More complete implementation of "Expand Flexible Tracks" step. 3. Return AvailableSize from get_free_space: spec says that this function can return indefinite size and it is ok.
This commit is contained in:
Aliaksandr Kalenik
Andreas Kling
parent
f2323b5b99
commit
fb6b52b3fb
Notes:
sideshowbarker
2024-07-17 07:14:09 +09:00
Author: https://github.com/kalenikaliaksandr Commit: https://github.com/SerenityOS/serenity/commit/fb6b52b3fb Pull-request: https://github.com/SerenityOS/serenity/pull/18739
@ -4,30 +4,30 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||
Box <div.grid-container> 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 <div.grid-item> at (8,8) content-size 392.140625x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-item> at (400.140625,8) content-size 392x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-item> at (8,25.46875) content-size 392.140625x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-item> at (400.140625,25.46875) content-size 392x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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
|
||||
|
||||
@ -4,30 +4,30 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||
Box <div.grid-container> 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 <div.grid-item> at (18,18) content-size 372.140625x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-item> at (410.140625,18) content-size 372x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-item> at (18,55.46875) content-size 372.140625x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-item> at (410.140625,55.46875) content-size 372x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-container> 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 <div.grid-item> at (18,92.9375) content-size 372.140625x50 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-item> at (410.140625,92.9375) content-size 372x50 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-item> at (18,162.9375) content-size 372.140625x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-item> at (410.140625,162.9375) content-size 372x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-container> 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 <div.grid-item> at (18,200.40625) content-size 347.140625x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-item> at (435.140625,200.40625) content-size 347x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-item> at (18,247.875) content-size 347.140625x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-item> at (435.140625,247.875) content-size 347x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-container> 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 <div.grid-item> at (445.934356,285.34375) content-size 337.300018x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-item> at (18,338.8125) content-size 338.534362x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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"
|
||||
|
||||
@ -2,23 +2,23 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||
BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline
|
||||
BlockContainer <body> at (8,8) content-size 784x84.9375 children: not-inline
|
||||
Box <div.grid-container> at (8,8) content-size 784x84.9375 [GFC] children: not-inline
|
||||
BlockContainer <div.one> at (8,8) content-size 342.140625x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.one> 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 <div.two> at (450.140625,8) content-size 342x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.two> 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 <div.three> at (8,75.46875) content-size 342.140625x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.three> 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 <div.four> at (450.140625,75.46875) content-size 342x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.four> 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>
|
||||
|
||||
@ -2,12 +2,12 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||
BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline
|
||||
BlockContainer <body> at (8,8) content-size 784x50.9375 children: not-inline
|
||||
Box <div.container> at (8,8) content-size 784x50.9375 [GFC] children: not-inline
|
||||
BlockContainer <div.item> at (435.934356,8) content-size 357.300018x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.item> 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 <div.item> at (8,41.46875) content-size 358.534362x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.item> 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"
|
||||
|
||||
@ -1,13 +1,13 @@
|
||||
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||
BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline
|
||||
BlockContainer <body> at (8,8) content-size 784x50 children: not-inline
|
||||
Box <div.container> at (8,8) content-size 784x50 [GFC] children: not-inline
|
||||
BlockContainer <div.one> at (8,8) content-size 300x25 [BFC] children: inline
|
||||
BlockContainer <body> at (8,8) content-size 784x100 children: not-inline
|
||||
Box <div.container> at (8,8) content-size 784x100 [GFC] children: not-inline
|
||||
BlockContainer <div.one> 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 <div.two> at (308,8) content-size 300x25 [BFC] children: inline
|
||||
BlockContainer <div.two> 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"
|
||||
|
||||
@ -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 <div.grid-item> at (400,8) content-size 393.234375x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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"
|
||||
|
||||
@ -4,16 +4,16 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||
Box <div.grid-container> 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 <div.grid-item> at (8,8) content-size 522.666748x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-item> at (530.666748,8) content-size 261.333496x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-container> 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 <div.grid-item> at (8,25.46875) content-size 261.333374x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-item> at (269.333374,25.46875) content-size 522.66687x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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
|
||||
|
||||
@ -4,30 +4,30 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||
Box <div.grid-container> 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 <div.grid-item> at (8,8) content-size 392.140625x50 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-item> at (400.140625,8) content-size 392x50 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-item> at (8,58) content-size 392.140625x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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 <div.grid-item> at (400.140625,58) content-size 392x17.46875 [BFC] children: inline
|
||||
BlockContainer <div.grid-item> 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
|
||||
|
||||
@ -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);
|
||||
}
|
||||
|
||||
|
||||
@ -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"/}
|
||||
|
||||
|
||||
@ -95,7 +95,7 @@ int GridFormattingContext::count_of_repeated_auto_fill_or_fit_tracks(Vector<CSS:
|
||||
sum_of_grid_track_sizes += min(resolve_definite_track_size(track_sizing_function.grid_size(), available_space), resolve_definite_track_size(track_sizing_function.grid_size(), available_space));
|
||||
}
|
||||
}
|
||||
return max(1, static_cast<int>((get_free_space(available_space.width, m_grid_columns) / sum_of_grid_track_sizes).value()));
|
||||
return max(1, static_cast<int>((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<TemporaryTrack> const& tracks) const
|
||||
AvailableSize GridFormattingContext::get_free_space(AvailableSize const& available_size, Vector<TemporaryTrack> 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)
|
||||
|
||||
@ -145,7 +145,7 @@ private:
|
||||
Vector<GridItem> m_grid_items;
|
||||
Vector<JS::NonnullGCPtr<Box const>> m_boxes_to_place;
|
||||
|
||||
CSSPixels get_free_space(AvailableSize const& available_size, Vector<TemporaryTrack> const& tracks) const;
|
||||
AvailableSize get_free_space(AvailableSize const& available_size, Vector<TemporaryTrack> 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&);
|
||||
|
||||
Loading…
Reference in New Issue
Block a user