mirrors/ladybird
0
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-08-26 12:17:52 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

LibWeb: Handle correctly case when abspos and relpos GFC is interleaved

Browse source 
...by another GFC. When searching for grid item that contains an
abspos box positioned relative to GFC, it's incorrect to assume that the
closest ancestor box whose parent establishes GFC is always the one we
are looking for, because there may be non-positioned GFC in between.

Fixes regression introduced in 80c8e78.
This commit is contained in:
Aliaksandr Kalenik 2025-08-19 01:23:00 +02:00 • committed by Jelle Raaijmakers
commit d94b33e205
Notes: github-actions[bot] 2025-08-19 07:29:55 +00:00
3 changed files with 24 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

2
Libraries/LibWeb/Layout/GridFormattingContext.cpp
View file

@ -2120,7 +2120,7 @@ void GridFormattingContext::layout_absolutely_positioned_element(Box const& box)
// `Node::containing_block()` is not aware of that. Therefore, we need to // `Node::containing_block()` is not aware of that. Therefore, we need to
// find the closest grid item ancestor in order to identify grid area it belongs to. // find the closest grid item ancestor in order to identify grid area it belongs to.
NodeWithStyle const* containing_grid_item = &box; NodeWithStyle const* containing_grid_item = &box;
while (containing_grid_item->parent() && !containing_grid_item->parent()->display().is_grid_inside()) while (containing_grid_item->parent() && containing_grid_item->parent() != &grid_container())
containing_grid_item = containing_grid_item->parent(); containing_grid_item = containing_grid_item->parent();
auto const& computed_values = containing_grid_item->computed_values(); auto const& computed_values = containing_grid_item->computed_values();

18
Tests/LibWeb/Layout/expected/grid/gfc-between-relpos-gfc-and-abspos-item.txt Normal file
View file

@ -0,0 +1,18 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x16 [BFC] children: not-inline
BlockContainer <body> at (8,8) content-size 784x0 children: not-inline
Box <div.outer> at (8,8) content-size 784x0 positioned [GFC] children: not-inline
Box <div.middle> at (8,8) content-size 784x0 [GFC] children: not-inline
BlockContainer <div> at (8,8) content-size 784x0 [BFC] children: not-inline
BlockContainer <div.abs> at (8,8) content-size 0x0 positioned [BFC] children: not-inline
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x16]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x0]
PaintableBox (Box<DIV>.outer) [8,8 784x0]
PaintableBox (Box<DIV>.middle) [8,8 784x0]
PaintableWithLines (BlockContainer<DIV>) [8,8 784x0]
PaintableWithLines (BlockContainer<DIV>.abs) [8,8 0x0]
SC for Viewport<#document> [0,0 800x600] [children: 1] (z-index: auto)
SC for BlockContainer<HTML> [0,0 800x16] [children: 0] (z-index: auto)

5
Tests/LibWeb/Layout/input/grid/gfc-between-relpos-gfc-and-abspos-item.html Normal file
View file

@ -0,0 +1,5 @@
<!DOCTYPE html><style>
.outer { display: grid; position: relative; }
.middle { display: grid; }
.abs { position: absolute; }
</style><div class="outer"><div class="middle"><div><div class="abs"></div>