beenull/ladybird
1
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2024-11-29 11:00:29 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 7

LibWeb: Align with spec "stretch auto tracks" step in GFC

Browse source 
Now, we will evenly distribute the remaining free space across tracks
using the auto max-tracks sizing function, exactly as the specification
states. Many tests are affected, but they are not visually broken.

Fixes https://github.com/SerenityOS/serenity/issues/22798
This commit is contained in:
Aliaksandr Kalenik 2024-01-16 12:13:27 +01:00 committed by Andreas Kling
parent dd9f3c980f
commit 9e23503c9c
Notes: sideshowbarker 2024-07-17 00:23:42 +09:00 
Author: https://github.com/kalenikaliaksandr
Commit: https://github.com/SerenityOS/serenity/commit/9e23503c9c
Pull-request: https://github.com/SerenityOS/serenity/pull/22800
Issue: https://github.com/SerenityOS/serenity/issues/22798
21 changed files with 233 additions and 207 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
Tests/LibWeb/Layout/expected/grid/align-items.txt
View file

@ -4,34 +4,34 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <(anonymous)> at (10,10) content-size 780x0 children: inline
TextNode <#text>
Box <div.grid.start> at (31,31) content-size 738x39 [GFC] children: not-inline
BlockContainer <div> at (32,32) content-size 367x17 [BFC] children: inline
BlockContainer <div> at (32,32) content-size 355.765625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 6, rect: [32,32 50.203125x17] baseline: 13.296875
"Start1"
TextNode <#text>
BlockContainer <div.item-padding> at (411,42) content-size 347x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 6, rect: [411,42 52.671875x17] baseline: 13.296875
BlockContainer <div.item-padding> at (399.765625,42) content-size 358.234375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 6, rect: [399.765625,42 52.671875x17] baseline: 13.296875
"Start2"
TextNode <#text>
BlockContainer <(anonymous)> at (10,91) content-size 780x0 children: inline
TextNode <#text>
Box <div.grid.center> at (31,112) content-size 738x39 [GFC] children: not-inline
BlockContainer <div> at (32,123) content-size 367x17 [BFC] children: inline
BlockContainer <div> at (32,123) content-size 355.765625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 7, rect: [32,123 59.390625x17] baseline: 13.296875
"Center1"
TextNode <#text>
BlockContainer <div.item-padding> at (411,123) content-size 347x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 7, rect: [411,123 61.859375x17] baseline: 13.296875
BlockContainer <div.item-padding> at (399.765625,123) content-size 358.234375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 7, rect: [399.765625,123 61.859375x17] baseline: 13.296875
"Center2"
TextNode <#text>
BlockContainer <(anonymous)> at (10,172) content-size 780x0 children: inline
TextNode <#text>
Box <div.grid.end> at (31,193) content-size 738x39 [GFC] children: not-inline
BlockContainer <div> at (32,214) content-size 367x17 [BFC] children: inline
BlockContainer <div> at (32,214) content-size 355.765625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 4, rect: [32,214 35.671875x17] baseline: 13.296875
"End1"
TextNode <#text>
BlockContainer <div.item-padding> at (411,204) content-size 347x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 4, rect: [411,204 38.140625x17] baseline: 13.296875
BlockContainer <div.item-padding> at (399.765625,204) content-size 358.234375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 4, rect: [399.765625,204 38.140625x17] baseline: 13.296875
"End2"
TextNode <#text>
@ -40,19 +40,19 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [9,9 782x245]
PaintableWithLines (BlockContainer(anonymous)) [10,10 780x0]
PaintableBox (Box<DIV>.grid.start) [10,10 780x81]
PaintableWithLines (BlockContainer<DIV>) [31,31 369x19]
PaintableWithLines (BlockContainer<DIV>) [31,31 357.765625x19]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.item-padding) [400,31 369x39]
PaintableWithLines (BlockContainer<DIV>.item-padding) [388.765625,31 380.234375x39]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [10,91 780x0]
PaintableBox (Box<DIV>.grid.center) [10,91 780x81]
PaintableWithLines (BlockContainer<DIV>) [31,122 369x19]
PaintableWithLines (BlockContainer<DIV>) [31,122 357.765625x19]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.item-padding) [400,112 369x39]
PaintableWithLines (BlockContainer<DIV>.item-padding) [388.765625,112 380.234375x39]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [10,172 780x0]
PaintableBox (Box<DIV>.grid.end) [10,172 780x81]
PaintableWithLines (BlockContainer<DIV>) [31,213 369x19]
PaintableWithLines (BlockContainer<DIV>) [31,213 357.765625x19]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.item-padding) [400,193 369x39]
PaintableWithLines (BlockContainer<DIV>.item-padding) [388.765625,193 380.234375x39]
TextPaintable (TextNode<#text>)

30
Tests/LibWeb/Layout/expected/grid/align-self.txt
View file

@ -4,34 +4,34 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <(anonymous)> at (10,10) content-size 780x0 children: inline
TextNode <#text>
Box <div.grid> at (31,31) content-size 738x39 [GFC] children: not-inline
BlockContainer <div.start> at (32,32) content-size 367x17 [BFC] children: inline
BlockContainer <div.start> at (32,32) content-size 355.765625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 6, rect: [32,32 50.203125x17] baseline: 13.296875
"Start1"
TextNode <#text>
BlockContainer <div.item-padding> at (411,42) content-size 347x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 6, rect: [411,42 52.671875x17] baseline: 13.296875
BlockContainer <div.item-padding> at (399.765625,42) content-size 358.234375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 6, rect: [399.765625,42 52.671875x17] baseline: 13.296875
"Start2"
TextNode <#text>
BlockContainer <(anonymous)> at (10,91) content-size 780x0 children: inline
TextNode <#text>
Box <div.grid> at (31,112) content-size 738x39 [GFC] children: not-inline
BlockContainer <div.center> at (32,123) content-size 367x17 [BFC] children: inline
BlockContainer <div.center> at (32,123) content-size 355.765625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 7, rect: [32,123 59.390625x17] baseline: 13.296875
"Center1"
TextNode <#text>
BlockContainer <div.item-padding> at (411,123) content-size 347x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 7, rect: [411,123 61.859375x17] baseline: 13.296875
BlockContainer <div.item-padding> at (399.765625,123) content-size 358.234375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 7, rect: [399.765625,123 61.859375x17] baseline: 13.296875
"Center2"
TextNode <#text>
BlockContainer <(anonymous)> at (10,172) content-size 780x0 children: inline
TextNode <#text>
Box <div.grid> at (31,193) content-size 738x39 [GFC] children: not-inline
BlockContainer <div.end> at (32,214) content-size 367x17 [BFC] children: inline
BlockContainer <div.end> at (32,214) content-size 355.765625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 4, rect: [32,214 35.671875x17] baseline: 13.296875
"End1"
TextNode <#text>
BlockContainer <div.item-padding> at (411,204) content-size 347x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 4, rect: [411,204 38.140625x17] baseline: 13.296875
BlockContainer <div.item-padding> at (399.765625,204) content-size 358.234375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 4, rect: [399.765625,204 38.140625x17] baseline: 13.296875
"End2"
TextNode <#text>
@ -40,19 +40,19 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [9,9 782x245]
PaintableWithLines (BlockContainer(anonymous)) [10,10 780x0]
PaintableBox (Box<DIV>.grid) [10,10 780x81]
PaintableWithLines (BlockContainer<DIV>.start) [31,31 369x19]
PaintableWithLines (BlockContainer<DIV>.start) [31,31 357.765625x19]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.item-padding) [400,31 369x39]
PaintableWithLines (BlockContainer<DIV>.item-padding) [388.765625,31 380.234375x39]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [10,91 780x0]
PaintableBox (Box<DIV>.grid) [10,91 780x81]
PaintableWithLines (BlockContainer<DIV>.center) [31,122 369x19]
PaintableWithLines (BlockContainer<DIV>.center) [31,122 357.765625x19]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.item-padding) [400,112 369x39]
PaintableWithLines (BlockContainer<DIV>.item-padding) [388.765625,112 380.234375x39]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [10,172 780x0]
PaintableBox (Box<DIV>.grid) [10,172 780x81]
PaintableWithLines (BlockContainer<DIV>.end) [31,213 369x19]
PaintableWithLines (BlockContainer<DIV>.end) [31,213 357.765625x19]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.item-padding) [400,193 369x39]
PaintableWithLines (BlockContainer<DIV>.item-padding) [388.765625,193 380.234375x39]
TextPaintable (TextNode<#text>)

20
Tests/LibWeb/Layout/expected/grid/all-implicit-rows.txt
View file

@ -4,26 +4,26 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.grid-container> at (8,8) content-size 784x200 [GFC] children: not-inline
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (8,8) content-size 392x100 [BFC] children: inline
BlockContainer <div.grid-item> at (8,8) content-size 392.140625x100 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [8,8 6.34375x17] baseline: 13.296875
"1"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (400,8) content-size 392x100 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [400,8 8.8125x17] baseline: 13.296875
BlockContainer <div.grid-item> at (400.140625,8) content-size 391.859375x100 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [400.140625,8 8.8125x17] baseline: 13.296875
"2"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (8,108) content-size 392x100 [BFC] children: inline
BlockContainer <div.grid-item> at (8,108) content-size 392.140625x100 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [8,108 9.09375x17] baseline: 13.296875
"3"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (400,108) content-size 392x100 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [400,108 7.75x17] baseline: 13.296875
BlockContainer <div.grid-item> at (400.140625,108) content-size 391.859375x100 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [400.140625,108 7.75x17] baseline: 13.296875
"4"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
@ -35,12 +35,12 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x200]
PaintableBox (Box<DIV>.grid-container) [8,8 784x200]
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,8 392x100]
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,8 392.140625x100]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item) [400,8 392x100]
PaintableWithLines (BlockContainer<DIV>.grid-item) [400.140625,8 391.859375x100]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,108 392x100]
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,108 392.140625x100]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item) [400,108 392x100]
PaintableWithLines (BlockContainer<DIV>.grid-item) [400.140625,108 391.859375x100]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [8,208 784x0]

10
Tests/LibWeb/Layout/expected/grid/auto-flow-column-spanning-item.txt
View file

@ -1,15 +1,15 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x33 [BFC] children: not-inline
Box <body> at (8,8) content-size 784x17 [GFC] children: not-inline
BlockContainer <div> at (8,8) content-size 156.796875x17 [BFC] children: not-inline
BlockContainer <div.item> at (164.796875,8) content-size 627.1875x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 3, rect: [164.796875,8 27.15625x17] baseline: 13.296875
BlockContainer <div> at (8,8) content-size 151.359375x17 [BFC] children: not-inline
BlockContainer <div.item> at (159.359375,8) content-size 632.59375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 3, rect: [159.359375,8 27.15625x17] baseline: 13.296875
"foo"
TextNode <#text>
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x33]
PaintableBox (Box<BODY>) [8,8 784x17]
PaintableWithLines (BlockContainer<DIV>) [8,8 156.796875x17]
PaintableWithLines (BlockContainer<DIV>.item) [164.796875,8 627.1875x17]
PaintableWithLines (BlockContainer<DIV>) [8,8 151.359375x17]
PaintableWithLines (BlockContainer<DIV>.item) [159.359375,8 632.59375x17]
TextPaintable (TextNode<#text>)

10
Tests/LibWeb/Layout/expected/grid/auto-flow-column.txt
View file

@ -1,19 +1,19 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (1,1) content-size 798x37 [BFC] children: not-inline
Box <body> at (10,10) content-size 200x19 [GFC] children: not-inline
BlockContainer <div> at (11,11) content-size 98x17 [BFC] children: inline
BlockContainer <div> at (11,11) content-size 88.734375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 5, rect: [11,11 36.84375x17] baseline: 13.296875
"hello"
TextNode <#text>
BlockContainer <div> at (111,11) content-size 98x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 7, rect: [111,11 55.359375x17] baseline: 13.296875
BlockContainer <div> at (101.734375,11) content-size 107.25x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 7, rect: [101.734375,11 55.359375x17] baseline: 13.296875
"friends"
TextNode <#text>
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x39]
PaintableBox (Box<BODY>) [9,9 202x21]
PaintableWithLines (BlockContainer<DIV>) [10,10 100x19]
PaintableWithLines (BlockContainer<DIV>) [10,10 90.734375x19]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>) [110,10 100x19]
PaintableWithLines (BlockContainer<DIV>) [100.734375,10 109.25x19]
TextPaintable (TextNode<#text>)

20
Tests/LibWeb/Layout/expected/grid/basic.txt
View file

@ -4,26 +4,26 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.grid-container> at (8,8) content-size 784x34 [GFC] children: not-inline
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (8,8) content-size 392x17 [BFC] children: inline
BlockContainer <div.grid-item> at (8,8) content-size 392.140625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [8,8 6.34375x17] baseline: 13.296875
"1"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (400,8) content-size 392x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [400,8 8.8125x17] baseline: 13.296875
BlockContainer <div.grid-item> at (400.140625,8) content-size 391.859375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [400.140625,8 8.8125x17] baseline: 13.296875
"2"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (8,25) content-size 392x17 [BFC] children: inline
BlockContainer <div.grid-item> at (8,25) content-size 392.140625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [8,25 9.09375x17] baseline: 13.296875
"3"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (400,25) content-size 392x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [400,25 7.75x17] baseline: 13.296875
BlockContainer <div.grid-item> at (400.140625,25) content-size 391.859375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [400.140625,25 7.75x17] baseline: 13.296875
"4"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
@ -33,11 +33,11 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x34]
PaintableBox (Box<DIV>.grid-container) [8,8 784x34]
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,8 392x17]
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,8 392.140625x17]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item) [400,8 392x17]
PaintableWithLines (BlockContainer<DIV>.grid-item) [400.140625,8 391.859375x17]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,25 392x17]
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,25 392.140625x17]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item) [400,25 392x17]
PaintableWithLines (BlockContainer<DIV>.grid-item) [400.140625,25 391.859375x17]
TextPaintable (TextNode<#text>)

70
Tests/LibWeb/Layout/expected/grid/borders.txt
View file

@ -4,26 +4,26 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.grid-container> at (8,8) content-size 784x74 [GFC] children: not-inline
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (18,18) content-size 372x17 [BFC] children: inline
BlockContainer <div.grid-item> at (18,18) content-size 372.140625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [18,18 6.34375x17] baseline: 13.296875
"1"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (410,18) content-size 372x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [410,18 8.8125x17] baseline: 13.296875
BlockContainer <div.grid-item> at (410.140625,18) content-size 371.859375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [410.140625,18 8.8125x17] baseline: 13.296875
"2"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (18,55) content-size 372x17 [BFC] children: inline
BlockContainer <div.grid-item> at (18,55) content-size 372.140625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [18,55 9.09375x17] baseline: 13.296875
"3"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (410,55) content-size 372x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [410,55 7.75x17] baseline: 13.296875
BlockContainer <div.grid-item> at (410.140625,55) content-size 371.859375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [410.140625,55 7.75x17] baseline: 13.296875
"4"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
@ -33,26 +33,26 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.grid-container> at (8,82) content-size 784x107 [GFC] children: not-inline
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (18,92) content-size 372x50 [BFC] children: inline
BlockContainer <div.grid-item> at (18,92) content-size 372.140625x50 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [18,92 6.34375x17] baseline: 13.296875
"1"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (410,92) content-size 372x50 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [410,92 8.8125x17] baseline: 13.296875
BlockContainer <div.grid-item> at (410.140625,92) content-size 371.859375x50 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [410.140625,92 8.8125x17] baseline: 13.296875
"2"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (18,162) content-size 372x17 [BFC] children: inline
BlockContainer <div.grid-item> at (18,162) content-size 372.140625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [18,162 9.09375x17] baseline: 13.296875
"3"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (410,162) content-size 372x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [410,162 7.75x17] baseline: 13.296875
BlockContainer <div.grid-item> at (410.140625,162) content-size 371.859375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [410.140625,162 7.75x17] baseline: 13.296875
"4"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
@ -62,26 +62,26 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.grid-container> at (8,189) content-size 784x84 [GFC] children: not-inline
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (18,199) content-size 347x17 [BFC] children: inline
BlockContainer <div.grid-item> at (18,199) content-size 347.140625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [18,199 6.34375x17] baseline: 13.296875
"1"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (435,199) content-size 347x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [435,199 8.8125x17] baseline: 13.296875
BlockContainer <div.grid-item> at (435.140625,199) content-size 346.859375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [435.140625,199 8.8125x17] baseline: 13.296875
"2"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (18,246) content-size 347x17 [BFC] children: inline
BlockContainer <div.grid-item> at (18,246) content-size 347.140625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [18,246 9.09375x17] baseline: 13.296875
"3"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (435,246) content-size 347x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [435,246 7.75x17] baseline: 13.296875
BlockContainer <div.grid-item> at (435.140625,246) content-size 346.859375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [435.140625,246 7.75x17] baseline: 13.296875
"4"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
@ -91,13 +91,13 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.grid-container> at (8,273) content-size 784x90 [GFC] children: not-inline
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (444.203125,283) content-size 337.796875x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [444.203125,283 6.34375x17] baseline: 13.296875
BlockContainer <div.grid-item> at (445.4375,283) content-size 336.5625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [445.4375,283 6.34375x17] baseline: 13.296875
"1"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (18,336) content-size 337.796875x17 [BFC] children: inline
BlockContainer <div.grid-item> at (18,336) content-size 339.03125x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [18,336 8.8125x17] baseline: 13.296875
"2"
TextNode <#text>
@ -148,39 +148,39 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x425] overflow: [8,8 784x432]
PaintableBox (Box<DIV>.grid-container) [8,8 784x74]
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,8 392x37]
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,8 392.140625x37]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item) [400,8 392x37]
PaintableWithLines (BlockContainer<DIV>.grid-item) [400.140625,8 391.859375x37]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,45 392x37]
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,45 392.140625x37]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item) [400,45 392x37]
PaintableWithLines (BlockContainer<DIV>.grid-item) [400.140625,45 391.859375x37]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [8,82 784x0]
PaintableBox (Box<DIV>.grid-container) [8,82 784x107]
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,82 392x70]
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,82 392.140625x70]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item) [400,82 392x70]
PaintableWithLines (BlockContainer<DIV>.grid-item) [400.140625,82 391.859375x70]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,152 392x37]
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,152 392.140625x37]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item) [400,152 392x37]
PaintableWithLines (BlockContainer<DIV>.grid-item) [400.140625,152 391.859375x37]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [8,189 784x0]
PaintableBox (Box<DIV>.grid-container) [8,189 784x84]
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,189 367x37]
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,189 367.140625x37]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item) [425,189 367x37]
PaintableWithLines (BlockContainer<DIV>.grid-item) [425.140625,189 366.859375x37]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,236 367x37]
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,236 367.140625x37]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item) [425,236 367x37]
PaintableWithLines (BlockContainer<DIV>.grid-item) [425.140625,236 366.859375x37]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [8,273 784x0]
PaintableBox (Box<DIV>.grid-container) [8,273 784x90]
PaintableWithLines (BlockContainer<DIV>.grid-item) [434.203125,273 357.796875x37]
PaintableWithLines (BlockContainer<DIV>.grid-item) [435.4375,273 356.5625x37]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,326 357.796875x37]
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,326 359.03125x37]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [8,363 784x0]
PaintableBox (Box<DIV>.grid-container) [8,363 784x50] overflow: [8,363 784x52]

20
Tests/LibWeb/Layout/expected/grid/grid-gap-1.txt
View file

@ -2,20 +2,20 @@ 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 children: not-inline
Box <div.grid-container> at (8,8) content-size 784x84 [GFC] children: not-inline
BlockContainer <div.one> at (8,8) content-size 342x17 [BFC] children: inline
BlockContainer <div.one> at (8,8) content-size 342.140625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [8,8 6.34375x17] baseline: 13.296875
"1"
TextNode <#text>
BlockContainer <div.two> at (450,8) content-size 342x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [450,8 8.8125x17] baseline: 13.296875
BlockContainer <div.two> at (450.140625,8) content-size 341.859375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [450.140625,8 8.8125x17] baseline: 13.296875
"2"
TextNode <#text>
BlockContainer <div.three> at (8,75) content-size 342x17 [BFC] children: inline
BlockContainer <div.three> at (8,75) content-size 342.140625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [8,75 9.09375x17] baseline: 13.296875
"3"
TextNode <#text>
BlockContainer <div.four> at (450,75) content-size 342x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [450,75 7.75x17] baseline: 13.296875
BlockContainer <div.four> at (450.140625,75) content-size 341.859375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [450.140625,75 7.75x17] baseline: 13.296875
"4"
TextNode <#text>
@ -23,11 +23,11 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x84]
PaintableBox (Box<DIV>.grid-container) [8,8 784x84]
PaintableWithLines (BlockContainer<DIV>.one) [8,8 342x17]
PaintableWithLines (BlockContainer<DIV>.one) [8,8 342.140625x17]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.two) [450,8 342x17]
PaintableWithLines (BlockContainer<DIV>.two) [450.140625,8 341.859375x17]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.three) [8,75 342x17]
PaintableWithLines (BlockContainer<DIV>.three) [8,75 342.140625x17]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.four) [450,75 342x17]
PaintableWithLines (BlockContainer<DIV>.four) [450.140625,75 341.859375x17]
TextPaintable (TextNode<#text>)

10
Tests/LibWeb/Layout/expected/grid/grid-gap-2.txt
View file

@ -2,11 +2,11 @@ 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.item> at (434.203125,8) content-size 357.796875x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [434.203125,8 6.34375x17] baseline: 13.296875
BlockContainer <div.item> at (435.4375,8) content-size 356.5625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [435.4375,8 6.34375x17] baseline: 13.296875
"1"
TextNode <#text>
BlockContainer <div.item> at (8,41) content-size 357.796875x17 [BFC] children: inline
BlockContainer <div.item> at (8,41) content-size 359.03125x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [8,41 8.8125x17] baseline: 13.296875
"2"
TextNode <#text>
@ -15,7 +15,7 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x50]
PaintableBox (Box<DIV>.container) [8,8 784x50]
PaintableWithLines (BlockContainer<DIV>.item) [434.203125,8 357.796875x17]
PaintableWithLines (BlockContainer<DIV>.item) [435.4375,8 356.5625x17]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.item) [8,41 357.796875x17]
PaintableWithLines (BlockContainer<DIV>.item) [8,41 359.03125x17]
TextPaintable (TextNode<#text>)

10
Tests/LibWeb/Layout/expected/grid/grid-item-percentage-width.txt
View file

@ -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 784x17 children: not-inline
Box <div.grid-container> at (8,8) content-size 784x17 [GFC] children: not-inline
BlockContainer <div.first> at (8,8) content-size 313.59375x17 [BFC] children: inline
BlockContainer <div.first> at (8,8) content-size 307.484375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 5, rect: [8,8 42.140625x17] baseline: 13.296875
"First"
TextNode <#text>
BlockContainer <div.second> at (400,8) content-size 78.390625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 6, rect: [400,8 57.40625x17] baseline: 13.296875
BlockContainer <div.second> at (392.359375,8) content-size 79.921875x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 6, rect: [392.359375,8 57.40625x17] baseline: 13.296875
"Second"
TextNode <#text>
@ -15,7 +15,7 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x17]
PaintableBox (Box<DIV>.grid-container) [8,8 784x17]
PaintableWithLines (BlockContainer<DIV>.first) [8,8 313.59375x17]
PaintableWithLines (BlockContainer<DIV>.first) [8,8 307.484375x17]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.second) [400,8 78.390625x17]
PaintableWithLines (BlockContainer<DIV>.second) [392.359375,8 79.921875x17]
TextPaintable (TextNode<#text>)

50
Tests/LibWeb/Layout/expected/grid/negative-grid-item-column-index.txt
View file

@ -4,56 +4,56 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.grid> at (8,8) content-size 784x68 [GFC] children: not-inline
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.a> at (8,8) content-size 196x17 [BFC] children: inline
BlockContainer <div.a> at (8,8) content-size 196.453125x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [8,8 9.34375x17] baseline: 13.296875
"a"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.c> at (204,8) content-size 196x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [204,8 8.890625x17] baseline: 13.296875
BlockContainer <div.c> at (204.453125,8) content-size 196x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [204.453125,8 8.890625x17] baseline: 13.296875
"c"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.b> at (400,8) content-size 196x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [400,8 9.46875x17] baseline: 13.296875
BlockContainer <div.b> at (400.453125,8) content-size 196.578125x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [400.453125,8 9.46875x17] baseline: 13.296875
"b"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.b> at (400,25) content-size 196x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [400,25 9.46875x17] baseline: 13.296875
BlockContainer <div.b> at (400.453125,25) content-size 196.578125x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [400.453125,25 9.46875x17] baseline: 13.296875
"b"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.d> at (596,25) content-size 196x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [596,25 7.859375x17] baseline: 13.296875
BlockContainer <div.d> at (597.03125,25) content-size 194.96875x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [597.03125,25 7.859375x17] baseline: 13.296875
"d"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.c> at (204,42) content-size 196x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [204,42 8.890625x17] baseline: 13.296875
BlockContainer <div.c> at (204.453125,42) content-size 196x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [204.453125,42 8.890625x17] baseline: 13.296875
"c"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.d> at (596,42) content-size 196x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [596,42 7.859375x17] baseline: 13.296875
BlockContainer <div.d> at (597.03125,42) content-size 194.96875x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [597.03125,42 7.859375x17] baseline: 13.296875
"d"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.e> at (8,59) content-size 196x17 [BFC] children: inline
BlockContainer <div.e> at (8,59) content-size 196.453125x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [8,59 8.71875x17] baseline: 13.296875
"e"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.f> at (204,59) content-size 196x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [204,59 6.4375x17] baseline: 13.296875
BlockContainer <div.f> at (204.453125,59) content-size 196x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [204.453125,59 6.4375x17] baseline: 13.296875
"f"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
@ -65,22 +65,22 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x68]
PaintableBox (Box<DIV>.grid) [8,8 784x68]
PaintableWithLines (BlockContainer<DIV>.a) [8,8 196x17]
PaintableWithLines (BlockContainer<DIV>.a) [8,8 196.453125x17]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.c) [204,8 196x17]
PaintableWithLines (BlockContainer<DIV>.c) [204.453125,8 196x17]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.b) [400,8 196x17]
PaintableWithLines (BlockContainer<DIV>.b) [400.453125,8 196.578125x17]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.b) [400,25 196x17]
PaintableWithLines (BlockContainer<DIV>.b) [400.453125,25 196.578125x17]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.d) [596,25 196x17]
PaintableWithLines (BlockContainer<DIV>.d) [597.03125,25 194.96875x17]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.c) [204,42 196x17]
PaintableWithLines (BlockContainer<DIV>.c) [204.453125,42 196x17]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.d) [596,42 196x17]
PaintableWithLines (BlockContainer<DIV>.d) [597.03125,42 194.96875x17]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.e) [8,59 196x17]
PaintableWithLines (BlockContainer<DIV>.e) [8,59 196.453125x17]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.f) [204,59 196x17]
PaintableWithLines (BlockContainer<DIV>.f) [204.453125,59 196x17]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [8,76 784x0]

30
Tests/LibWeb/Layout/expected/grid/place-self.txt
View file

@ -6,30 +6,30 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
frag 0 from TextNode start: 0, length: 6, rect: [32,32 50.203125x17] baseline: 13.296875
"Start1"
TextNode <#text>
BlockContainer <div.item-padding> at (411,42) content-size 347x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 6, rect: [411,42 52.671875x17] baseline: 13.296875
BlockContainer <div.item-padding> at (399.765625,42) content-size 358.234375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 6, rect: [399.765625,42 52.671875x17] baseline: 13.296875
"Start2"
TextNode <#text>
BlockContainer <(anonymous)> at (10,91) content-size 780x0 children: inline
TextNode <#text>
Box <div.grid> at (31,112) content-size 738x39 [GFC] children: not-inline
BlockContainer <div.center> at (185.796875,123) content-size 59.390625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 7, rect: [185.796875,123 59.390625x17] baseline: 13.296875
BlockContainer <div.center> at (180.1875,123) content-size 59.390625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 7, rect: [180.1875,123 59.390625x17] baseline: 13.296875
"Center1"
TextNode <#text>
BlockContainer <div.item-padding> at (411,123) content-size 347x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 7, rect: [411,123 61.859375x17] baseline: 13.296875
BlockContainer <div.item-padding> at (399.765625,123) content-size 358.234375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 7, rect: [399.765625,123 61.859375x17] baseline: 13.296875
"Center2"
TextNode <#text>
BlockContainer <(anonymous)> at (10,172) content-size 780x0 children: inline
TextNode <#text>
Box <div.grid> at (31,193) content-size 738x39 [GFC] children: not-inline
BlockContainer <div.end> at (363.328125,214) content-size 35.671875x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 4, rect: [363.328125,214 35.671875x17] baseline: 13.296875
BlockContainer <div.end> at (352.09375,214) content-size 35.671875x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 4, rect: [352.09375,214 35.671875x17] baseline: 13.296875
"End1"
TextNode <#text>
BlockContainer <div.item-padding> at (411,204) content-size 347x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 4, rect: [411,204 38.140625x17] baseline: 13.296875
BlockContainer <div.item-padding> at (399.765625,204) content-size 358.234375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 4, rect: [399.765625,204 38.140625x17] baseline: 13.296875
"End2"
TextNode <#text>
@ -39,17 +39,17 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableBox (Box<DIV>.grid) [10,10 780x81]
PaintableWithLines (BlockContainer<DIV>.start) [31,31 52.203125x19]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.item-padding) [400,31 369x39]
PaintableWithLines (BlockContainer<DIV>.item-padding) [388.765625,31 380.234375x39]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [10,91 780x0]
PaintableBox (Box<DIV>.grid) [10,91 780x81]
PaintableWithLines (BlockContainer<DIV>.center) [184.796875,122 61.390625x19]
PaintableWithLines (BlockContainer<DIV>.center) [179.1875,122 61.390625x19]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.item-padding) [400,112 369x39]
PaintableWithLines (BlockContainer<DIV>.item-padding) [388.765625,112 380.234375x39]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [10,172 780x0]
PaintableBox (Box<DIV>.grid) [10,172 780x81]
PaintableWithLines (BlockContainer<DIV>.end) [362.328125,213 37.671875x19]
PaintableWithLines (BlockContainer<DIV>.end) [351.09375,213 37.671875x19]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.item-padding) [400,193 369x39]
PaintableWithLines (BlockContainer<DIV>.item-padding) [388.765625,193 380.234375x39]
TextPaintable (TextNode<#text>)

10
Tests/LibWeb/Layout/expected/grid/placement-using-named-tracks-1.txt
View file

@ -2,12 +2,12 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (1,1) content-size 798x600 [BFC] children: not-inline
BlockContainer <body> at (10,10) content-size 780x21 children: not-inline
Box <div.grid-container> at (11,11) content-size 778x19 [GFC] children: not-inline
BlockContainer <div.a> at (12,12) content-size 387x17 [BFC] children: inline
BlockContainer <div.a> at (12,12) content-size 385.765625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [12,12 6.34375x17] baseline: 13.296875
"1"
TextNode <#text>
BlockContainer <div.b> at (401,12) content-size 387x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [401,12 8.8125x17] baseline: 13.296875
BlockContainer <div.b> at (399.765625,12) content-size 388.234375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [399.765625,12 8.8125x17] baseline: 13.296875
"2"
TextNode <#text>
@ -15,7 +15,7 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600] overflow: [0,0 800x602]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x602]
PaintableWithLines (BlockContainer<BODY>) [9,9 782x23]
PaintableBox (Box<DIV>.grid-container) [10,10 780x21]
PaintableWithLines (BlockContainer<DIV>.a) [11,11 389x19]
PaintableWithLines (BlockContainer<DIV>.a) [11,11 387.765625x19]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.b) [400,11 389x19]
PaintableWithLines (BlockContainer<DIV>.b) [398.765625,11 390.234375x19]
TextPaintable (TextNode<#text>)

20
Tests/LibWeb/Layout/expected/grid/row-height.txt
View file

@ -4,26 +4,26 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.grid-container> at (8,8) content-size 784x67 [GFC] children: not-inline
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (8,8) content-size 392x50 [BFC] children: inline
BlockContainer <div.grid-item> at (8,8) content-size 392.140625x50 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [8,8 6.34375x17] baseline: 13.296875
"1"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (400,8) content-size 392x50 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [400,8 8.8125x17] baseline: 13.296875
BlockContainer <div.grid-item> at (400.140625,8) content-size 391.859375x50 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [400.140625,8 8.8125x17] baseline: 13.296875
"2"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (8,58) content-size 392x17 [BFC] children: inline
BlockContainer <div.grid-item> at (8,58) content-size 392.140625x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [8,58 9.09375x17] baseline: 13.296875
"3"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item> at (400,58) content-size 392x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [400,58 7.75x17] baseline: 13.296875
BlockContainer <div.grid-item> at (400.140625,58) content-size 391.859375x17 [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [400.140625,58 7.75x17] baseline: 13.296875
"4"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
@ -33,11 +33,11 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x67]
PaintableBox (Box<DIV>.grid-container) [8,8 784x67]
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,8 392x50]
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,8 392.140625x50]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item) [400,8 392x50]
PaintableWithLines (BlockContainer<DIV>.grid-item) [400.140625,8 391.859375x50]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,58 392x17]
PaintableWithLines (BlockContainer<DIV>.grid-item) [8,58 392.140625x17]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item) [400,58 392x17]
PaintableWithLines (BlockContainer<DIV>.grid-item) [400.140625,58 391.859375x17]
TextPaintable (TextNode<#text>)

12
Tests/LibWeb/Layout/expected/grid/row-span-2-maxcontent.txt
View file

@ -4,7 +4,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.grid-container> at (8,8) content-size 784x306 [GFC] children: not-inline
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item.item-span-one-one> at (401.46875,8) content-size 392x127.5 [BFC] children: inline
BlockContainer <div.grid-item.item-span-one-one> at (401.46875,8) content-size 390.53125x127.5 [BFC] children: inline
frag 0 from TextNode start: 1, length: 40, rect: [401.46875,8 319.171875x17] baseline: 13.296875
"In a sollicitudin augue. Sed ante augue,"
frag 1 from TextNode start: 42, length: 42, rect: [401.46875,25 335.125x17] baseline: 13.296875
@ -16,7 +16,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item.item-span-one-two> at (401.46875,135.5) content-size 392x178.5 [BFC] children: inline
BlockContainer <div.grid-item.item-span-one-two> at (401.46875,135.5) content-size 390.53125x178.5 [BFC] children: inline
frag 0 from TextNode start: 1, length: 43, rect: [401.46875,135.5 359.15625x17] baseline: 13.296875
"Suspendisse potenti. Pellentesque at varius"
frag 1 from TextNode start: 45, length: 41, rect: [401.46875,152.5 318.5625x17] baseline: 13.296875
@ -77,11 +77,11 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x306] overflow: [8,8 785.46875x306]
PaintableBox (Box<DIV>.grid-container) [8,8 784x306] overflow: [8,8 785.46875x306]
PaintableWithLines (BlockContainer<DIV>.grid-item.item-span-one-one) [401.46875,8 392x127.5]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x306]
PaintableBox (Box<DIV>.grid-container) [8,8 784x306]
PaintableWithLines (BlockContainer<DIV>.grid-item.item-span-one-one) [401.46875,8 390.53125x127.5]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item.item-span-one-two) [401.46875,135.5 392x178.5]
PaintableWithLines (BlockContainer<DIV>.grid-item.item-span-one-two) [401.46875,135.5 390.53125x178.5]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item.item-span-two) [8,8 393.46875x306]
TextPaintable (TextNode<#text>)

12
Tests/LibWeb/Layout/expected/grid/row-span-2-with-gaps.txt
View file

@ -4,7 +4,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.grid-container> at (8,8) content-size 784x323 [GFC] children: not-inline
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item.item-span-one-one> at (411.46875,8) content-size 382x126 [BFC] children: inline
BlockContainer <div.grid-item.item-span-one-one> at (411.46875,8) content-size 380.53125x126 [BFC] children: inline
frag 0 from TextNode start: 1, length: 40, rect: [411.46875,8 319.171875x17] baseline: 13.296875
"In a sollicitudin augue. Sed ante augue,"
frag 1 from TextNode start: 42, length: 42, rect: [411.46875,25 335.125x17] baseline: 13.296875
@ -16,7 +16,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item.item-span-one-two> at (411.46875,154) content-size 382x177 [BFC] children: inline
BlockContainer <div.grid-item.item-span-one-two> at (411.46875,154) content-size 380.53125x177 [BFC] children: inline
frag 0 from TextNode start: 1, length: 43, rect: [411.46875,154 359.15625x17] baseline: 13.296875
"Suspendisse potenti. Pellentesque at varius"
frag 1 from TextNode start: 45, length: 41, rect: [411.46875,171 318.5625x17] baseline: 13.296875
@ -79,11 +79,11 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x323] overflow: [8,8 785.46875x323]
PaintableBox (Box<DIV>.grid-container) [8,8 784x323] overflow: [8,8 785.46875x323]
PaintableWithLines (BlockContainer<DIV>.grid-item.item-span-one-one) [411.46875,8 382x126]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x323]
PaintableBox (Box<DIV>.grid-container) [8,8 784x323]
PaintableWithLines (BlockContainer<DIV>.grid-item.item-span-one-one) [411.46875,8 380.53125x126]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item.item-span-one-two) [411.46875,154 382x177]
PaintableWithLines (BlockContainer<DIV>.grid-item.item-span-one-two) [411.46875,154 380.53125x177]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item.item-span-two) [8,8 383.46875x323]
TextPaintable (TextNode<#text>)

12
Tests/LibWeb/Layout/expected/grid/row-span-2.txt
View file

@ -4,7 +4,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
Box <div.grid-container> at (8,8) content-size 784x306 [GFC] children: not-inline
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item.item-span-one-one> at (401.46875,8) content-size 392x127.5 [BFC] children: inline
BlockContainer <div.grid-item.item-span-one-one> at (401.46875,8) content-size 390.53125x127.5 [BFC] children: inline
frag 0 from TextNode start: 1, length: 40, rect: [401.46875,8 319.171875x17] baseline: 13.296875
"In a sollicitudin augue. Sed ante augue,"
frag 1 from TextNode start: 42, length: 42, rect: [401.46875,25 335.125x17] baseline: 13.296875
@ -16,7 +16,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
BlockContainer <div.grid-item.item-span-one-two> at (401.46875,135.5) content-size 392x178.5 [BFC] children: inline
BlockContainer <div.grid-item.item-span-one-two> at (401.46875,135.5) content-size 390.53125x178.5 [BFC] children: inline
frag 0 from TextNode start: 1, length: 43, rect: [401.46875,135.5 359.15625x17] baseline: 13.296875
"Suspendisse potenti. Pellentesque at varius"
frag 1 from TextNode start: 45, length: 41, rect: [401.46875,152.5 318.5625x17] baseline: 13.296875
@ -77,11 +77,11 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x306] overflow: [8,8 785.46875x306]
PaintableBox (Box<DIV>.grid-container) [8,8 784x306] overflow: [8,8 785.46875x306]
PaintableWithLines (BlockContainer<DIV>.grid-item.item-span-one-one) [401.46875,8 392x127.5]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x306]
PaintableBox (Box<DIV>.grid-container) [8,8 784x306]
PaintableWithLines (BlockContainer<DIV>.grid-item.item-span-one-one) [401.46875,8 390.53125x127.5]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item.item-span-one-two) [401.46875,135.5 392x178.5]
PaintableWithLines (BlockContainer<DIV>.grid-item.item-span-one-two) [401.46875,135.5 390.53125x178.5]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>.grid-item.item-span-two) [8,8 393.46875x306]
TextPaintable (TextNode<#text>)

8
Tests/LibWeb/Layout/expected/grid/should-not-hang-in-size-distribution.txt
View file

@ -1,8 +1,8 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x33 [BFC] children: not-inline
Box <body> at (8,8) content-size 784x17 [GFC] children: not-inline
BlockContainer <div#item> at (8,8) content-size 784x17 [BFC] children: not-inline
BlockContainer <div#block> at (8,8) content-size 784x17 children: inline
BlockContainer <div#item> at (8,8) content-size 783.984375x17 [BFC] children: not-inline
BlockContainer <div#block> at (8,8) content-size 783.984375x17 children: inline
frag 0 from TextNode start: 0, length: 26, rect: [8,8 210.484375x17] baseline: 13.296875
"Taika Waititi's Best Roles"
TextNode <#text>
@ -10,6 +10,6 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x33]
PaintableBox (Box<BODY>) [8,8 784x17]
PaintableWithLines (BlockContainer<DIV>#item) [8,8 784x17]
PaintableWithLines (BlockContainer<DIV>#block) [8,8 784x17]
PaintableWithLines (BlockContainer<DIV>#item) [8,8 783.984375x17]
PaintableWithLines (BlockContainer<DIV>#block) [8,8 783.984375x17]
TextPaintable (TextNode<#text>)

13
Tests/LibWeb/Layout/expected/grid/stretch-auto-tracks.txt Normal file
View file

@ -0,0 +1,13 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x116 [BFC] children: not-inline
Box <body> at (8,8) content-size 784x100 [GFC] children: not-inline
Box <section> at (8,8) content-size 784x100 [GFC] children: not-inline
BlockContainer <div#one> at (8,8) content-size 784x0 [BFC] children: not-inline
BlockContainer <div#two> at (8,8) content-size 784x100 [BFC] children: not-inline
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x116]
PaintableBox (Box<BODY>) [8,8 784x100]
PaintableBox (Box<SECTION>) [8,8 784x100]
PaintableWithLines (BlockContainer<DIV>#one) [8,8 784x0]
PaintableWithLines (BlockContainer<DIV>#two) [8,8 784x100]

19
Tests/LibWeb/Layout/input/grid/stretch-auto-tracks.html Normal file
View file

@ -0,0 +1,19 @@
<!DOCTYPE html><style>
* {
outline: 1px solid black;
}
body {
display: grid;
}
section {
display: grid;
background: pink;
}
#one {
background: green;
}
#two {
height: 100px;
background: orange;
}
</style><body><section><div id="one"></div><div id="two"></div>

24
Userland/Libraries/LibWeb/Layout/GridFormattingContext.cpp
View file

@ -1302,13 +1302,11 @@ void GridFormattingContext::expand_flexible_tracks(GridDimension const dimension
void GridFormattingContext::stretch_auto_tracks(GridDimension const dimension)
{
// https://drafts.csswg.org/css-grid/#algo-stretch
// https://www.w3.org/TR/css-grid-2/#algo-stretch
// 12.8. Stretch auto Tracks
// When the content-distribution property of the grid container is normal or stretch in this axis,
// this step expands tracks that have an auto max track sizing function by dividing any remaining
// positive, definite free space equally amongst them. If the free space is indefinite, but the grid
// container has a definite min-width/height, use that size to calculate the free space for this
// step instead.
// This step expands tracks that have an auto max track sizing function by dividing any remaining positive,
// definite free space equally amongst them. If the free space is indefinite, but the grid container has a
// definite min-width/height, use that size to calculate the free space for this step instead.
auto content_distribution_property_is_normal_or_stretch = false;
if (dimension == GridDimension::Column) {
@ -1325,22 +1323,18 @@ void GridFormattingContext::stretch_auto_tracks(GridDimension const dimension)
auto& tracks_and_gaps = dimension == GridDimension::Column ? m_grid_columns_and_gaps : m_grid_rows_and_gaps;
auto& available_size = dimension == GridDimension::Column ? m_available_space->width : m_available_space->height;
CSSPixels used_space = 0;
for (auto& track : tracks_and_gaps) {
if (!track.max_track_sizing_function.is_auto(available_size))
used_space += track.base_size;
}
CSSPixels remaining_space = available_size.is_definite() ? available_size.to_px_or_zero() - used_space : 0;
auto count_of_auto_max_sizing_tracks = 0;
for (auto& track : tracks_and_gaps) {
if (track.max_track_sizing_function.is_auto(available_size))
count_of_auto_max_sizing_tracks++;
}
CSSPixels remaining_space = get_free_space(*m_available_space, dimension).to_px_or_zero();
auto remaining_space_to_distribute_per_track = remaining_space / count_of_auto_max_sizing_tracks;
for (auto& track : tracks_and_gaps) {
if (track.max_track_sizing_function.is_auto(available_size))
track.base_size = max(track.base_size, remaining_space / count_of_auto_max_sizing_tracks);
if (!track.max_track_sizing_function.is_auto(available_size))
continue;
track.base_size += remaining_space_to_distribute_per_track;
}
}