LibWeb: Don't insert out-of-flow elements into block pseudo elements

Like 1132c858e9, out-of-flow elements such
as float elements would get inserted into block level `::before` and
`::after` pseudo-element nodes when they should instead be inserted as a
sibling to the pseudo element. This change fixes that.

This fixes a few layout issues on the swedish tax agency website
(skatteverket.se). :^)

(cherry picked from commit 9ed2669fc801a3475c9f383ae7221b6a2b1a7fa5)
This commit is contained in:
Arthur Hartwig Carlsson 2024-07-05 12:57:03 +02:00 committed by Nico Weber
parent f11f4927c2
commit fd35cb2730
3 changed files with 29 additions and 0 deletions

View file

@ -0,0 +1,19 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x42 [BFC] children: not-inline
BlockContainer <body> at (8,8) content-size 784x17 children: not-inline
BlockContainer <(anonymous)> at (8,8) content-size 784x17 children: inline
frag 0 from TextNode start: 0, length: 3, rect: [8,8 27.15625x17] baseline: 13.296875
"foo"
TextNode <#text>
BlockContainer <div> at (8,25) content-size 27.640625x17 floating [BFC] children: inline
frag 0 from TextNode start: 0, length: 3, rect: [8,25 27.640625x17] baseline: 13.296875
"bar"
TextNode <#text>
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x42]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x17] overflow: [8,8 784x34]
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x17]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer<DIV>) [8,25 27.640625x17]
TextPaintable (TextNode<#text>)

View file

@ -0,0 +1,9 @@
<!DOCTYPE html><style>
body::before {
content: "foo";
display: block;
}
div {
float: left;
}
</style><body><div>bar

View file

@ -99,6 +99,7 @@ static Layout::Node& insertion_parent_for_block_node(Layout::NodeWithStyle& layo
if (layout_node.is_out_of_flow()
&& !layout_parent.display().is_flex_inside()
&& !layout_parent.display().is_grid_inside()
&& !layout_parent.last_child()->is_generated()
&& layout_parent.last_child()->is_anonymous()
&& layout_parent.last_child()->children_are_inline()) {
// Block is out-of-flow & previous sibling was wrapped in an anonymous block.