From 142d498f147adeb3feeffa7409b2d66065b6b8a1 Mon Sep 17 00:00:00 2001 From: Karol Kosek Date: Tue, 11 Jul 2023 12:21:59 +0200 Subject: [PATCH] LibWeb: Include anonymous boxes with no lines into computing BFC height Pseudo-elements like ::before and ::after were discarded when their content property was an empty string (ignoring whitespace), because they are anonymous containers with no lines. Our previous way around it was to add an empty line box (see b062a0fb7c) however it didn't actually work for cases described in the previous commit. This makes avatars and cover arts square on last.fm and "fixes" the test css-pseudo-element-should-not-be-affected-by-presentational-hints.html. Unfortunately, this also regresses on block-and-inline/clearfix.html, but that hopefully will be handled in subsequent commit. --- ...should-not-be-affected-by-inline-style.txt | 3 --- ...ot-be-affected-by-presentational-hints.txt | 7 ++----- .../position-empty-pseudo-elements.txt | 11 ++++++++++ ...seudo-element-with-custom-properties-2.txt | 15 +++----------- .../pseudo-element-with-custom-properties.txt | 3 --- .../input/position-empty-pseudo-elements.html | 20 +++++++++++++++++++ .../LibWeb/Layout/BlockFormattingContext.cpp | 3 +-- 7 files changed, 37 insertions(+), 25 deletions(-) create mode 100644 Tests/LibWeb/Layout/expected/position-empty-pseudo-elements.txt create mode 100644 Tests/LibWeb/Layout/input/position-empty-pseudo-elements.html diff --git a/Tests/LibWeb/Layout/expected/css-pseudo-element-should-not-be-affected-by-inline-style.txt b/Tests/LibWeb/Layout/expected/css-pseudo-element-should-not-be-affected-by-inline-style.txt index cc6fcd87e3..49cea5a669 100644 --- a/Tests/LibWeb/Layout/expected/css-pseudo-element-should-not-be-affected-by-inline-style.txt +++ b/Tests/LibWeb/Layout/expected/css-pseudo-element-should-not-be-affected-by-inline-style.txt @@ -3,9 +3,6 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline BlockContainer at (10,10) content-size 780x102 children: not-inline BlockContainer at (11,11) content-size 100x100 children: not-inline BlockContainer <(anonymous)> at (12,12) content-size 50x50 children: inline - line 0 width: 0, height: 21.828125, bottom: 21.828125, baseline: 16.890625 - frag 0 from TextNode start: 0, length: 0, rect: [12,12 0x21.828125] - "" TextNode <#text> BlockContainer at (12,64) content-size 98x0 children: inline TextNode <#text> diff --git a/Tests/LibWeb/Layout/expected/css-pseudo-element-should-not-be-affected-by-presentational-hints.txt b/Tests/LibWeb/Layout/expected/css-pseudo-element-should-not-be-affected-by-presentational-hints.txt index 92f41f4f87..f10632ee22 100644 --- a/Tests/LibWeb/Layout/expected/css-pseudo-element-should-not-be-affected-by-presentational-hints.txt +++ b/Tests/LibWeb/Layout/expected/css-pseudo-element-should-not-be-affected-by-presentational-hints.txt @@ -5,9 +5,6 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline Box at (11,11) content-size 108x104 table-box [TFC] children: not-inline Box at (11,11) content-size 104x100 table-row-group children: not-inline Box at (13,13) content-size 104x100 table-row children: not-inline - BlockContainer
at (15,51.078125) content-size 100x23.828125 table-cell [BFC] children: not-inline - BlockContainer <(anonymous)> at (16,52.078125) content-size 98x21.828125 children: inline - line 0 width: 0, height: 21.828125, bottom: 21.828125, baseline: 16.890625 - frag 0 from TextNode start: 0, length: 0, rect: [16,52.078125 0x21.828125] - "" + BlockContainer at (15,62) content-size 100x2 table-cell [BFC] children: not-inline + BlockContainer <(anonymous)> at (16,63) content-size 98x0 children: inline TextNode <#text> diff --git a/Tests/LibWeb/Layout/expected/position-empty-pseudo-elements.txt b/Tests/LibWeb/Layout/expected/position-empty-pseudo-elements.txt new file mode 100644 index 0000000000..ff7c0ba6e9 --- /dev/null +++ b/Tests/LibWeb/Layout/expected/position-empty-pseudo-elements.txt @@ -0,0 +1,11 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x158 [BFC] children: not-inline + BlockContainer at (8,25) content-size 784x125 children: not-inline + BlockContainer at (33,25) content-size 50x50 children: not-inline + BlockContainer <(anonymous)> at (33,75) content-size 50x0 children: inline + TextNode <#text> + BlockContainer at (33,100) content-size 50x50 children: not-inline + BlockContainer <(anonymous)> at (33,150) content-size 50x0 children: inline + TextNode <#text> + BlockContainer <(anonymous)> at (8,175) content-size 784x0 children: inline + TextNode <#text> diff --git a/Tests/LibWeb/Layout/expected/pseudo-element-with-custom-properties-2.txt b/Tests/LibWeb/Layout/expected/pseudo-element-with-custom-properties-2.txt index d8bebe1b82..485cd46dd6 100644 --- a/Tests/LibWeb/Layout/expected/pseudo-element-with-custom-properties-2.txt +++ b/Tests/LibWeb/Layout/expected/pseudo-element-with-custom-properties-2.txt @@ -9,12 +9,9 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline BreakNode
TextNode <#text> BlockContainer at (8,29.828125) content-size 784x100 children: inline - line 0 width: 200, height: 100, bottom: 100, baseline: 16.890625 + line 0 width: 200, height: 100, bottom: 100, baseline: 100 frag 0 from BlockContainer start: 0, length: 0, rect: [8,29.828125 200x100] BlockContainer <(anonymous)> at (8,29.828125) content-size 200x100 inline-block [BFC] children: inline - line 0 width: 0, height: 21.828125, bottom: 21.828125, baseline: 16.890625 - frag 0 from TextNode start: 0, length: 0, rect: [8,29.828125 0x21.828125] - "" TextNode <#text> BlockContainer <(anonymous)> at (8,129.828125) content-size 784x65.484375 children: inline line 0 width: 0, height: 21.828125, bottom: 21.828125, baseline: 16.890625 @@ -29,12 +26,9 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline BreakNode
TextNode <#text> BlockContainer at (8,195.3125) content-size 784x100 children: inline - line 0 width: 200, height: 100, bottom: 100, baseline: 16.890625 + line 0 width: 200, height: 100, bottom: 100, baseline: 100 frag 0 from BlockContainer start: 0, length: 0, rect: [8,195.3125 200x100] BlockContainer <(anonymous)> at (8,195.3125) content-size 200x100 inline-block [BFC] children: inline - line 0 width: 0, height: 21.828125, bottom: 21.828125, baseline: 16.890625 - frag 0 from TextNode start: 0, length: 0, rect: [8,195.3125 0x21.828125] - "" TextNode <#text> BlockContainer <(anonymous)> at (8,295.3125) content-size 784x65.484375 children: inline line 0 width: 0, height: 21.828125, bottom: 21.828125, baseline: 16.890625 @@ -49,12 +43,9 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline BreakNode
TextNode <#text> BlockContainer at (8,360.796875) content-size 784x100 children: inline - line 0 width: 200, height: 100, bottom: 100, baseline: 16.890625 + line 0 width: 200, height: 100, bottom: 100, baseline: 100 frag 0 from BlockContainer start: 0, length: 0, rect: [8,360.796875 200x100] BlockContainer <(anonymous)> at (8,360.796875) content-size 200x100 inline-block [BFC] children: inline - line 0 width: 0, height: 21.828125, bottom: 21.828125, baseline: 16.890625 - frag 0 from TextNode start: 0, length: 0, rect: [8,360.796875 0x21.828125] - "" TextNode <#text> BlockContainer <(anonymous)> at (8,460.796875) content-size 784x0 children: inline TextNode <#text> diff --git a/Tests/LibWeb/Layout/expected/pseudo-element-with-custom-properties.txt b/Tests/LibWeb/Layout/expected/pseudo-element-with-custom-properties.txt index 96c858fec9..c0d1daea39 100644 --- a/Tests/LibWeb/Layout/expected/pseudo-element-with-custom-properties.txt +++ b/Tests/LibWeb/Layout/expected/pseudo-element-with-custom-properties.txt @@ -3,7 +3,4 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline BlockContainer at (8,8) content-size 784x0 children: not-inline BlockContainer at (8,8) content-size 784x0 children: not-inline BlockContainer <(anonymous)> at (8,8) content-size 500x100 positioned [BFC] children: inline - line 0 width: 0, height: 21.828125, bottom: 21.828125, baseline: 16.890625 - frag 0 from TextNode start: 0, length: 0, rect: [8,8 0x21.828125] - "" TextNode <#text> diff --git a/Tests/LibWeb/Layout/input/position-empty-pseudo-elements.html b/Tests/LibWeb/Layout/input/position-empty-pseudo-elements.html new file mode 100644 index 0000000000..cc774d25ef --- /dev/null +++ b/Tests/LibWeb/Layout/input/position-empty-pseudo-elements.html @@ -0,0 +1,20 @@ +
diff --git a/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp index 543bcc761c..8c896a5f87 100644 --- a/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp +++ b/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp @@ -568,8 +568,7 @@ CSSPixels BlockFormattingContext::compute_auto_height_for_block_level_element(Bo auto const& child_box_state = m_state.get(*child_box); - // Ignore anonymous block containers with no lines. These don't count as in-flow block boxes. - if (!child_box->is_table_wrapper() && child_box->is_anonymous() && child_box->is_block_container() && child_box_state.line_boxes.is_empty()) + if (margins_collapse_through(*child_box, m_state)) continue; auto margin_bottom = m_margin_state.current_collapsed_margin();