From f963bb4f3632358a79fc3744ee7c8eb141e1662b Mon Sep 17 00:00:00 2001 From: Andreas Kling Date: Mon, 29 Jan 2024 16:03:44 +0100 Subject: [PATCH] LibWeb: Don't mark heights as definite in set_content_height() Height definiteness is now preserved as intended by CSS-SIZING-3 (assuming I've understood it correctly) and not implicitly granted by layout algorithms when they assign height. For the specific special/magical cases where some sizes become definite during layout, the preceding commits have made them explicit in code. This fixes a number of flex layout issues where we were previously resolving percentage values against post-layout flex container heights, but other browsers don't. --- ...lex-item-with-cyclic-percentage-height.txt | 8 ++-- ...-intrinsic-aspect-ratio-and-max-height.txt | 4 +- ...-basis-with-indefinite-reference-value.txt | 37 +++++++++++++++++++ ...ith-indefinite-containing-block-height.txt | 13 +++++++ ...basis-with-indefinite-reference-value.html | 30 +++++++++++++++ ...th-indefinite-containing-block-height.html | 20 ++++++++++ .../Libraries/LibWeb/Layout/LayoutState.cpp | 1 - 7 files changed, 106 insertions(+), 7 deletions(-) create mode 100644 Tests/LibWeb/Layout/expected/flex/percentage-flex-basis-with-indefinite-reference-value.txt create mode 100644 Tests/LibWeb/Layout/expected/flex/percentage-flex-item-height-with-indefinite-containing-block-height.txt create mode 100644 Tests/LibWeb/Layout/input/flex/percentage-flex-basis-with-indefinite-reference-value.html create mode 100644 Tests/LibWeb/Layout/input/flex/percentage-flex-item-height-with-indefinite-containing-block-height.html diff --git a/Tests/LibWeb/Layout/expected/flex-item-with-cyclic-percentage-height.txt b/Tests/LibWeb/Layout/expected/flex-item-with-cyclic-percentage-height.txt index fd22b3641b9..5389b921f4d 100644 --- a/Tests/LibWeb/Layout/expected/flex-item-with-cyclic-percentage-height.txt +++ b/Tests/LibWeb/Layout/expected/flex-item-with-cyclic-percentage-height.txt @@ -2,7 +2,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline BlockContainer at (1,1) content-size 798x39 [BFC] children: not-inline BlockContainer at (10,10) content-size 780x21 children: not-inline Box at (11,11) content-size 778x19 flex-container(row) [FFC] children: not-inline - Box at (12,12) content-size 44.03125x19 flex-container(column) flex-item [FFC] children: not-inline + Box at (12,12) content-size 44.03125x17 flex-container(column) flex-item [FFC] children: not-inline BlockContainer <(anonymous)> at (12,12) content-size 44.03125x17 flex-item [BFC] children: inline frag 0 from TextNode start: 0, length: 6, rect: [12,12 44.03125x17] baseline: 13.296875 "pillow" @@ -10,8 +10,8 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline ViewportPaintable (Viewport<#document>) [0,0 800x600] PaintableWithLines (BlockContainer) [0,0 800x41] - PaintableWithLines (BlockContainer) [9,9 782x23] overflow: [10,10 780x22] - PaintableBox (Box
.flexrow) [10,10 780x21] overflow: [11,11 778x21] - PaintableBox (Box
.project) [11,11 46.03125x21] + PaintableWithLines (BlockContainer) [9,9 782x23] + PaintableBox (Box
.flexrow) [10,10 780x21] + PaintableBox (Box
.project) [11,11 46.03125x19] PaintableWithLines (BlockContainer(anonymous)) [12,12 44.03125x17] TextPaintable (TextNode<#text>) diff --git a/Tests/LibWeb/Layout/expected/flex/flex-item-with-intrinsic-aspect-ratio-and-max-height.txt b/Tests/LibWeb/Layout/expected/flex/flex-item-with-intrinsic-aspect-ratio-and-max-height.txt index 99f6d4198de..2e9004c14da 100644 --- a/Tests/LibWeb/Layout/expected/flex/flex-item-with-intrinsic-aspect-ratio-and-max-height.txt +++ b/Tests/LibWeb/Layout/expected/flex/flex-item-with-intrinsic-aspect-ratio-and-max-height.txt @@ -1,11 +1,11 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline BlockContainer at (1,1) content-size 798x69.984375 [BFC] children: not-inline Box at (10,10) content-size 780x51.984375 flex-container(row) [FFC] children: not-inline - ImageBox at (11,11) content-size 64x49.984375 flex-item children: not-inline + ImageBox at (11,11) content-size 66.65625x49.984375 flex-item children: not-inline BlockContainer <(anonymous)> (not painted) [BFC] children: inline TextNode <#text> ViewportPaintable (Viewport<#document>) [0,0 800x600] PaintableWithLines (BlockContainer) [0,0 800x71.984375] PaintableBox (Box) [9,9 782x53.984375] - ImagePaintable (ImageBox) [10,10 66x51.984375] + ImagePaintable (ImageBox) [10,10 68.65625x51.984375] diff --git a/Tests/LibWeb/Layout/expected/flex/percentage-flex-basis-with-indefinite-reference-value.txt b/Tests/LibWeb/Layout/expected/flex/percentage-flex-basis-with-indefinite-reference-value.txt new file mode 100644 index 00000000000..edcbe2b68e6 --- /dev/null +++ b/Tests/LibWeb/Layout/expected/flex/percentage-flex-basis-with-indefinite-reference-value.txt @@ -0,0 +1,37 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x153 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x137 children: not-inline + Box at (8,8) content-size 784x137 flex-container(column) [FFC] children: not-inline + BlockContainer <(anonymous)> (not painted) [BFC] children: inline + TextNode <#text> + BlockContainer at (8,8) content-size 784x120 flex-item [BFC] children: not-inline + BlockContainer <(anonymous)> at (8,8) content-size 784x0 children: inline + TextNode <#text> + BlockContainer at (8,8) content-size 120x120 children: not-inline + BlockContainer <(anonymous)> at (8,128) content-size 784x0 children: inline + TextNode <#text> + BlockContainer <(anonymous)> (not painted) [BFC] children: inline + TextNode <#text> + BlockContainer
at (8,128) content-size 784x17 flex-item [BFC] children: inline + frag 0 from TextNode start: 1, length: 14, rect: [8,128 112.421875x17] baseline: 13.296875 + "text text text" + TextNode <#text> + BlockContainer <(anonymous)> (not painted) [BFC] children: inline + TextNode <#text> + BlockContainer <(anonymous)> at (8,145) content-size 784x0 children: inline + TextNode <#text> + BlockContainer
at (8,145) content-size 784x0 children: inline + TextNode <#text> + +ViewportPaintable (Viewport<#document>) [0,0 800x600] + PaintableWithLines (BlockContainer) [0,0 800x153] + PaintableWithLines (BlockContainer) [8,8 784x137] + PaintableBox (Box
.outer) [8,8 784x137] + PaintableWithLines (BlockContainer
.item) [8,8 784x120] + PaintableWithLines (BlockContainer(anonymous)) [8,8 784x0] + PaintableWithLines (BlockContainer
.spacer) [8,8 120x120] + PaintableWithLines (BlockContainer(anonymous)) [8,128 784x0] + PaintableWithLines (BlockContainer
) [8,128 784x17] + TextPaintable (TextNode<#text>) + PaintableWithLines (BlockContainer(anonymous)) [8,145 784x0] + PaintableWithLines (BlockContainer
) [8,145 784x0] diff --git a/Tests/LibWeb/Layout/expected/flex/percentage-flex-item-height-with-indefinite-containing-block-height.txt b/Tests/LibWeb/Layout/expected/flex/percentage-flex-item-height-with-indefinite-containing-block-height.txt new file mode 100644 index 00000000000..c730df12e60 --- /dev/null +++ b/Tests/LibWeb/Layout/expected/flex/percentage-flex-item-height-with-indefinite-containing-block-height.txt @@ -0,0 +1,13 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x136 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x120 children: not-inline + Box at (8,8) content-size 784x120 flex-container(column) [FFC] children: not-inline + BlockContainer at (8,8) content-size 784x120 flex-item [BFC] children: not-inline + BlockContainer at (8,8) content-size 120x120 children: not-inline + +ViewportPaintable (Viewport<#document>) [0,0 800x600] + PaintableWithLines (BlockContainer) [0,0 800x136] + PaintableWithLines (BlockContainer) [8,8 784x120] + PaintableBox (Box
.flexContainer) [8,8 784x120] + PaintableWithLines (BlockContainer
.item) [8,8 784x120] + PaintableWithLines (BlockContainer
.green) [8,8 120x120] diff --git a/Tests/LibWeb/Layout/input/flex/percentage-flex-basis-with-indefinite-reference-value.html b/Tests/LibWeb/Layout/input/flex/percentage-flex-basis-with-indefinite-reference-value.html new file mode 100644 index 00000000000..ef1249a7797 --- /dev/null +++ b/Tests/LibWeb/Layout/input/flex/percentage-flex-basis-with-indefinite-reference-value.html @@ -0,0 +1,30 @@ + +
+
+
+
+
+ text text text +
+
+
diff --git a/Tests/LibWeb/Layout/input/flex/percentage-flex-item-height-with-indefinite-containing-block-height.html b/Tests/LibWeb/Layout/input/flex/percentage-flex-item-height-with-indefinite-containing-block-height.html new file mode 100644 index 00000000000..f6552ba6e75 --- /dev/null +++ b/Tests/LibWeb/Layout/input/flex/percentage-flex-item-height-with-indefinite-containing-block-height.html @@ -0,0 +1,20 @@ +
\ No newline at end of file diff --git a/Userland/Libraries/LibWeb/Layout/LayoutState.cpp b/Userland/Libraries/LibWeb/Layout/LayoutState.cpp index 0345500d62f..10243fb0e1e 100644 --- a/Userland/Libraries/LibWeb/Layout/LayoutState.cpp +++ b/Userland/Libraries/LibWeb/Layout/LayoutState.cpp @@ -509,7 +509,6 @@ void LayoutState::UsedValues::set_content_height(CSSPixels height) height = 0; } m_content_height = height; - m_has_definite_height = true; } void LayoutState::UsedValues::set_temporary_content_width(CSSPixels width)