LibWeb: Use grid area as available size for abspos contained in GFC

kalenikaliaksandr · kalenikaliaksandr · commit a64d182583c7 · 2024-09-12T21:07:41.000+02:00
Fixes incorrect percentage length resolution for abspos boxes contained
by a grid.
diff --git a/Tests/LibWeb/Layout/expected/grid/abspos-item-with-grid-area-and-percentage-size.txt b/Tests/LibWeb/Layout/expected/grid/abspos-item-with-grid-area-and-percentage-size.txt
@@ -0,0 +1,11 @@
+Viewport <#document> at (0,0) content-size 800x600 children: not-inline
+  BlockContainer <html> at (1,1) content-size 798x120 [BFC] children: not-inline
+    BlockContainer <body> at (10,10) content-size 780x102 children: not-inline
+      Box <div.grid> at (11,11) content-size 200x100 positioned [GFC] children: not-inline
+        BlockContainer <div.abspos-item> at (112,12) content-size 50x50 positioned [BFC] children: not-inline
+
+ViewportPaintable (Viewport<#document>) [0,0 800x600]
+  PaintableWithLines (BlockContainer<HTML>) [0,0 800x122]
+    PaintableWithLines (BlockContainer<BODY>) [9,9 782x104]
+      PaintableBox (Box<DIV>.grid) [10,10 202x102]
+        PaintableWithLines (BlockContainer<DIV>.abspos-item) [111,11 52x52]
diff --git a/Tests/LibWeb/Layout/input/grid/abspos-item-with-grid-area-and-percentage-size.html b/Tests/LibWeb/Layout/input/grid/abspos-item-with-grid-area-and-percentage-size.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html><style>
+* {
+    border: 1px solid black;
+}
+
+.grid {
+    display: grid;
+    grid-template-columns: 100px 100px;
+    grid-template-areas: "a b";
+    position: relative;
+    width: 200px;
+    height: 100px;
+}
+
+.abspos-item {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 50%;
+    height: 50%;
+    grid-area: b;
+}
+</style><div class="grid"><div class="abspos-item"></div></div>
diff --git a/Userland/Libraries/LibWeb/Layout/GridFormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/GridFormattingContext.cpp
@@ -1897,7 +1897,7 @@ void GridFormattingContext::run(AvailableSpace const& available_space)
     m_state.get_mutable(grid_container()).set_grid_template_rows(CSS::GridTrackSizeListStyleValue::create(move(grid_track_rows)));
 }
 
-void GridFormattingContext::layout_absolutely_positioned_element(Box const& box, AvailableSpace const& available_space)
+void GridFormattingContext::layout_absolutely_positioned_element(Box const& box)
 {
     auto& containing_block_state = m_state.get_mutable(*box.containing_block());
     auto& box_state = m_state.get_mutable(box);
@@ -1913,6 +1913,8 @@ void GridFormattingContext::layout_absolutely_positioned_element(Box const& box,
 
     GridItem item { box, row_start, row_span, column_start, column_span };
 
+    auto available_space = get_available_space_for_item(item);
+
     // The border computed values are not changed by the compute_height & width calculations below.
     // The spec only adjusts and computes sizes, insets and margins.
     box_state.border_left = box.computed_values().border_left().width;
@@ -2015,12 +2017,9 @@ void GridFormattingContext::parent_context_did_dimension_child_root_box()
         return IterationDecision::Continue;
     });
 
-    for (auto& child : grid_container().contained_abspos_children()) {
-        auto& box = verify_cast<Box>(*child);
-        auto& cb_state = m_state.get(*box.containing_block());
-        auto available_width = AvailableSize::make_definite(cb_state.content_width() + cb_state.padding_left + cb_state.padding_right);
-        auto available_height = AvailableSize::make_definite(cb_state.content_height() + cb_state.padding_top + cb_state.padding_bottom);
-        layout_absolutely_positioned_element(box, AvailableSpace(available_width, available_height));
+    for (auto const& child : grid_container().contained_abspos_children()) {
+        auto const& box = verify_cast<Box>(*child);
+        layout_absolutely_positioned_element(box);
     }
 }
 
diff --git a/Userland/Libraries/LibWeb/Layout/GridFormattingContext.h b/Userland/Libraries/LibWeb/Layout/GridFormattingContext.h
@@ -238,7 +238,7 @@ class GridFormattingContext final : public FormattingContext {
     void determine_grid_container_height();
     void determine_intrinsic_size_of_grid_container(AvailableSpace const& available_space);
 
-    void layout_absolutely_positioned_element(Box const&, AvailableSpace const&);
+    void layout_absolutely_positioned_element(Box const&);
     virtual void parent_context_did_dimension_child_root_box() override;
 
     void resolve_grid_item_widths();
