LibWeb: Consolidate track sizing code for rows and columns in GFC

Although the algorithm for sizing tracks (rows or columns) is defined once for both dimensions in the specification (https://www.w3.org/TR/css-grid-2/#algo-track-sizing), we have implemented it twice separately for sizing rows and columns. In addition to code duplication, another issue is that these implementations of the same algorithm have already diverged in some places, and this divergence is likely to become even worse as our implementation evolves. This change unifies code for both dimension into one method that runs track sizing. While this change brings a bit of collateral damange (border.html and minmax.html got changes in layout snaphots) it ultimately brings more benefits because now we can evolve layout for both rows and colums without duplicating the code :)
author: Aliaksandr Kalenik <kalenik.aliaksandr@gmail.com> 2023-05-06 04:22:35 +0300
committer: Andreas Kling <kling@serenityos.org> 2023-05-06 07:01:27 +0200
commit: ced862e16f7c13c64c332838643e01033373b462 (patch)
tree: 94b8cfc7a0c248da8b5cc11d99915e129c90b97d /Tests/LibWeb
parent: 4c17f2273568a2220b3aae60a6dfc476fc15b814 (diff)
download: serenity-ced862e16f7c13c64c332838643e01033373b462.zip
2 files changed, 70 insertions, 70 deletions
diff --git a/Tests/LibWeb/Layout/expected/grid/borders.txt b/Tests/LibWeb/Layout/expected/grid/borders.txt
index f4061be61c..ac82923265 100644
--- a/Tests/LibWeb/Layout/expected/grid/borders.txt
+++ b/Tests/LibWeb/Layout/expected/grid/borders.txt
@@ -1,6 +1,6 @@
 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 784x428.28125 children: not-inline
+    BlockContainer <body> at (8,8) content-size 784x448.28125 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>
@@ -122,40 +122,40 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
       Box <div.grid-container> at (8,366.28125) content-size 784x50 [GFC] children: not-inline
         BlockContainer <(anonymous)> at (8,366.28125) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-        BlockContainer <div.grid-item> at (18,376.28125) content-size 280x5 [BFC] children: inline
+        BlockContainer <div.grid-item> at (18,376.28125) content-size 280x25 [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,376.28125 6.34375x17.46875]
               "1"
           TextNode <#text>
         BlockContainer <(anonymous)> at (8,366.28125) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-        BlockContainer <div.grid-item> at (318,376.28125) content-size 280x5 [BFC] children: inline
+        BlockContainer <div.grid-item> at (318,376.28125) content-size 280x25 [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: [318,376.28125 8.8125x17.46875]
               "2"
           TextNode <#text>
         BlockContainer <(anonymous)> at (8,366.28125) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-        BlockContainer <div.grid-item> at (18,401.28125) content-size 280x5 [BFC] children: inline
+        BlockContainer <div.grid-item> at (18,421.28125) content-size 280x25 [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,401.28125 8.8125x17.46875]
+            frag 0 from TextNode start: 0, length: 1, rect: [18,421.28125 8.8125x17.46875]
               "2"
           TextNode <#text>
         BlockContainer <(anonymous)> at (8,366.28125) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-        BlockContainer <div.grid-item> at (318,401.28125) content-size 280x5 [BFC] children: inline
+        BlockContainer <div.grid-item> at (318,421.28125) content-size 280x25 [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: [318,401.28125 8.8125x17.46875]
+            frag 0 from TextNode start: 0, length: 1, rect: [318,421.28125 8.8125x17.46875]
               "2"
           TextNode <#text>
         BlockContainer <(anonymous)> at (8,366.28125) content-size 0x0 [BFC] children: inline
           TextNode <#text>
       BlockContainer <(anonymous)> at (8,416.28125) content-size 784x0 children: inline
         TextNode <#text>
-      Box <div.grid-container> at (8,416.28125) content-size 784x20 [GFC] children: not-inline
+      Box <div.grid-container> at (8,416.28125) content-size 784x40 [GFC] children: not-inline
         BlockContainer <(anonymous)> at (8,416.28125) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-        BlockContainer <div.grid-item> at (18,426.28125) content-size 764x0 [BFC] children: inline
+        BlockContainer <div.grid-item> at (18,426.28125) content-size 764x20 [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,426.28125 6.34375x17.46875]
               "1"
diff --git a/Tests/LibWeb/Layout/expected/grid/minmax.txt b/Tests/LibWeb/Layout/expected/grid/minmax.txt
index 1150a2f3c7..25afce72a9 100644
--- a/Tests/LibWeb/Layout/expected/grid/minmax.txt
+++ b/Tests/LibWeb/Layout/expected/grid/minmax.txt
@@ -1,6 +1,6 @@
 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 784x272.28125 children: not-inline
+    BlockContainer <body> at (8,8) content-size 784x222.28125 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>
@@ -21,148 +21,148 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
       BlockContainer <(anonymous)> at (8,25.46875) content-size 784x0 children: inline
         TextNode <#text>
         TextNode <#text>
-      Box <div.grid-container> at (8,25.46875) content-size 784x100 [GFC] children: not-inline
+      Box <div.grid-container> at (8,25.46875) content-size 784x50 [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 300x50 [BFC] children: inline
+        BlockContainer <div.grid-item> at (8,25.46875) content-size 300x25 [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 (308,25.46875) content-size 300x50 [BFC] children: inline
+        BlockContainer <div.grid-item> at (308,25.46875) content-size 300x25 [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,25.46875 8.8125x17.46875]
               "2"
           TextNode <#text>
         BlockContainer <(anonymous)> at (8,25.46875) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-      BlockContainer <(anonymous)> at (8,125.46875) content-size 784x0 children: inline
+      BlockContainer <(anonymous)> at (8,75.46875) content-size 784x0 children: inline
         TextNode <#text>
         TextNode <#text>
-      Box <div.grid-container> at (8,125.46875) content-size 784x34.9375 [GFC] children: not-inline
-        BlockContainer <(anonymous)> at (8,125.46875) content-size 0x0 [BFC] children: inline
+      Box <div.grid-container> at (8,75.46875) content-size 784x34.9375 [GFC] children: not-inline
+        BlockContainer <(anonymous)> at (8,75.46875) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-        BlockContainer <div.grid-item> at (8,125.46875) content-size 784x17.46875 [BFC] children: inline
+        BlockContainer <div.grid-item> at (8,75.46875) content-size 784x17.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,125.46875 6.34375x17.46875]
+            frag 0 from TextNode start: 0, length: 1, rect: [8,75.46875 6.34375x17.46875]
               "1"
           TextNode <#text>
-        BlockContainer <(anonymous)> at (8,125.46875) content-size 0x0 [BFC] children: inline
+        BlockContainer <(anonymous)> at (8,75.46875) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-        BlockContainer <div.grid-item> at (8,142.9375) content-size 784x17.46875 [BFC] children: inline
+        BlockContainer <div.grid-item> at (8,92.9375) content-size 784x17.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,142.9375 8.8125x17.46875]
+            frag 0 from TextNode start: 0, length: 1, rect: [8,92.9375 8.8125x17.46875]
               "2"
           TextNode <#text>
-        BlockContainer <(anonymous)> at (8,125.46875) content-size 0x0 [BFC] children: inline
+        BlockContainer <(anonymous)> at (8,75.46875) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-      BlockContainer <(anonymous)> at (8,160.40625) content-size 784x0 children: inline
+      BlockContainer <(anonymous)> at (8,110.40625) content-size 784x0 children: inline
         TextNode <#text>
         TextNode <#text>
-      Box <div.grid-container> at (8,160.40625) content-size 784x34.9375 [GFC] children: not-inline
-        BlockContainer <(anonymous)> at (8,160.40625) content-size 0x0 [BFC] children: inline
+      Box <div.grid-container> at (8,110.40625) content-size 784x34.9375 [GFC] children: not-inline
+        BlockContainer <(anonymous)> at (8,110.40625) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-        BlockContainer <div.grid-item> at (8,160.40625) content-size 784x17.46875 [BFC] children: inline
+        BlockContainer <div.grid-item> at (8,110.40625) content-size 784x17.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,160.40625 6.34375x17.46875]
+            frag 0 from TextNode start: 0, length: 1, rect: [8,110.40625 6.34375x17.46875]
               "1"
           TextNode <#text>
-        BlockContainer <(anonymous)> at (8,160.40625) content-size 0x0 [BFC] children: inline
+        BlockContainer <(anonymous)> at (8,110.40625) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-        BlockContainer <div.grid-item> at (8,177.875) content-size 784x17.46875 [BFC] children: inline
+        BlockContainer <div.grid-item> at (8,127.875) content-size 784x17.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,177.875 8.8125x17.46875]
+            frag 0 from TextNode start: 0, length: 1, rect: [8,127.875 8.8125x17.46875]
               "2"
           TextNode <#text>
-        BlockContainer <(anonymous)> at (8,160.40625) content-size 0x0 [BFC] children: inline
+        BlockContainer <(anonymous)> at (8,110.40625) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-      BlockContainer <(anonymous)> at (8,195.34375) content-size 784x0 children: inline
+      BlockContainer <(anonymous)> at (8,145.34375) content-size 784x0 children: inline
         TextNode <#text>
         TextNode <#text>
-      Box <div.grid-container> at (8,195.34375) content-size 784x50 [GFC] children: not-inline
-        BlockContainer <(anonymous)> at (8,195.34375) content-size 0x0 [BFC] children: inline
+      Box <div.grid-container> at (8,145.34375) content-size 784x50 [GFC] children: not-inline
+        BlockContainer <(anonymous)> at (8,145.34375) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-        BlockContainer <div.grid-item> at (8,195.34375) content-size 300x25 [BFC] children: inline
+        BlockContainer <div.grid-item> at (8,145.34375) content-size 300x25 [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,195.34375 6.34375x17.46875]
+            frag 0 from TextNode start: 0, length: 1, rect: [8,145.34375 6.34375x17.46875]
               "1"
           TextNode <#text>
-        BlockContainer <(anonymous)> at (8,195.34375) content-size 0x0 [BFC] children: inline
+        BlockContainer <(anonymous)> at (8,145.34375) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-        BlockContainer <div.grid-item> at (308,195.34375) content-size 300x25 [BFC] children: inline
+        BlockContainer <div.grid-item> at (308,145.34375) content-size 300x25 [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,195.34375 8.8125x17.46875]
+            frag 0 from TextNode start: 0, length: 1, rect: [308,145.34375 8.8125x17.46875]
               "2"
           TextNode <#text>
-        BlockContainer <(anonymous)> at (8,195.34375) content-size 0x0 [BFC] children: inline
+        BlockContainer <(anonymous)> at (8,145.34375) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-        BlockContainer <div.grid-item> at (8,220.34375) content-size 300x25 [BFC] children: inline
+        BlockContainer <div.grid-item> at (8,170.34375) content-size 300x25 [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,220.34375 9.09375x17.46875]
+            frag 0 from TextNode start: 0, length: 1, rect: [8,170.34375 9.09375x17.46875]
               "3"
           TextNode <#text>
-        BlockContainer <(anonymous)> at (8,195.34375) content-size 0x0 [BFC] children: inline
+        BlockContainer <(anonymous)> at (8,145.34375) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-        BlockContainer <div.grid-item> at (308,220.34375) content-size 300x25 [BFC] children: inline
+        BlockContainer <div.grid-item> at (308,170.34375) content-size 300x25 [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: [308,220.34375 7.75x17.46875]
+            frag 0 from TextNode start: 0, length: 1, rect: [308,170.34375 7.75x17.46875]
               "4"
           TextNode <#text>
-        BlockContainer <(anonymous)> at (8,195.34375) content-size 0x0 [BFC] children: inline
+        BlockContainer <(anonymous)> at (8,145.34375) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-      BlockContainer <(anonymous)> at (8,245.34375) content-size 784x0 children: inline
+      BlockContainer <(anonymous)> at (8,195.34375) content-size 784x0 children: inline
         TextNode <#text>
         TextNode <#text>
-      Box <div.grid-container> at (8,245.34375) content-size 784x17.46875 [GFC] children: not-inline
-        BlockContainer <(anonymous)> at (8,245.34375) content-size 0x0 [BFC] children: inline
+      Box <div.grid-container> at (8,195.34375) content-size 784x17.46875 [GFC] children: not-inline
+        BlockContainer <(anonymous)> at (8,195.34375) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-        BlockContainer <div.grid-item> at (8,245.34375) content-size 261.333343x17.46875 [BFC] children: inline
+        BlockContainer <div.grid-item> at (8,195.34375) content-size 261.333343x17.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,245.34375 6.34375x17.46875]
+            frag 0 from TextNode start: 0, length: 1, rect: [8,195.34375 6.34375x17.46875]
               "1"
           TextNode <#text>
-        BlockContainer <(anonymous)> at (8,245.34375) content-size 0x0 [BFC] children: inline
+        BlockContainer <(anonymous)> at (8,195.34375) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-        BlockContainer <div.grid-item> at (269.333343,245.34375) content-size 261.333343x17.46875 [BFC] children: inline
+        BlockContainer <div.grid-item> at (269.333343,195.34375) content-size 261.333343x17.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.333343,245.34375 8.8125x17.46875]
+            frag 0 from TextNode start: 0, length: 1, rect: [269.333343,195.34375 8.8125x17.46875]
               "2"
           TextNode <#text>
-        BlockContainer <(anonymous)> at (8,245.34375) content-size 0x0 [BFC] children: inline
+        BlockContainer <(anonymous)> at (8,195.34375) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-        BlockContainer <div.grid-item> at (530.666687,245.34375) content-size 261.333312x17.46875 [BFC] children: inline
+        BlockContainer <div.grid-item> at (530.666687,195.34375) content-size 261.333312x17.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: [530.666687,245.34375 9.09375x17.46875]
+            frag 0 from TextNode start: 0, length: 1, rect: [530.666687,195.34375 9.09375x17.46875]
               "3"
           TextNode <#text>
-        BlockContainer <(anonymous)> at (8,245.34375) content-size 0x0 [BFC] children: inline
+        BlockContainer <(anonymous)> at (8,195.34375) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-      BlockContainer <(anonymous)> at (8,262.8125) content-size 784x0 children: inline
+      BlockContainer <(anonymous)> at (8,212.8125) content-size 784x0 children: inline
         TextNode <#text>
         TextNode <#text>
-      Box <div.grid-container> at (8,262.8125) content-size 784x17.46875 [GFC] children: not-inline
-        BlockContainer <(anonymous)> at (8,262.8125) content-size 0x0 [BFC] children: inline
+      Box <div.grid-container> at (8,212.8125) content-size 784x17.46875 [GFC] children: not-inline
+        BlockContainer <(anonymous)> at (8,212.8125) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-        BlockContainer <div.grid-item> at (8,262.8125) content-size 56.218711x17.46875 [BFC] children: inline
+        BlockContainer <div.grid-item> at (8,212.8125) content-size 56.218711x17.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,262.8125 6.34375x17.46875]
+            frag 0 from TextNode start: 0, length: 1, rect: [8,212.8125 6.34375x17.46875]
               "1"
           TextNode <#text>
-        BlockContainer <(anonymous)> at (8,262.8125) content-size 0x0 [BFC] children: inline
+        BlockContainer <(anonymous)> at (8,212.8125) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-        BlockContainer <div.grid-item> at (64.218711,262.8125) content-size 671.5625x17.46875 [BFC] children: inline
+        BlockContainer <div.grid-item> at (64.218711,212.8125) content-size 671.5625x17.46875 [BFC] children: inline
           line 0 width: 125.265625, height: 17.46875, bottom: 17.46875, baseline: 13.53125
-            frag 0 from TextNode start: 0, length: 15, rect: [64.218711,262.8125 125.265625x17.46875]
+            frag 0 from TextNode start: 0, length: 15, rect: [64.218711,212.8125 125.265625x17.46875]
               "Article content"
           TextNode <#text>
-        BlockContainer <(anonymous)> at (8,262.8125) content-size 0x0 [BFC] children: inline
+        BlockContainer <(anonymous)> at (8,212.8125) content-size 0x0 [BFC] children: inline
           TextNode <#text>
-        BlockContainer <div.grid-item> at (735.781188,262.8125) content-size 56.218688x17.46875 [BFC] children: inline
+        BlockContainer <div.grid-item> at (735.781188,212.8125) content-size 56.218688x17.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: [735.781188,262.8125 9.09375x17.46875]
+            frag 0 from TextNode start: 0, length: 1, rect: [735.781188,212.8125 9.09375x17.46875]
               "3"
           TextNode <#text>
-        BlockContainer <(anonymous)> at (8,262.8125) content-size 0x0 [BFC] children: inline
+        BlockContainer <(anonymous)> at (8,212.8125) content-size 0x0 [BFC] children: inline
           TextNode <#text>
author	Aliaksandr Kalenik <kalenik.aliaksandr@gmail.com>	2023-05-06 04:22:35 +0300
committer	Andreas Kling <kling@serenityos.org>	2023-05-06 07:01:27 +0200
commit	ced862e16f7c13c64c332838643e01033373b462 (patch)
tree	94b8cfc7a0c248da8b5cc11d99915e129c90b97d /Tests/LibWeb
parent	4c17f2273568a2220b3aae60a6dfc476fc15b814 (diff)
download	serenity-ced862e16f7c13c64c332838643e01033373b462.zip