summaryrefslogtreecommitdiff
path: root/Tests/LibWeb/Layout
diff options
context:
space:
mode:
authorAndreas Kling <kling@serenityos.org>2023-04-16 19:48:40 +0200
committerAndreas Kling <kling@serenityos.org>2023-04-16 21:45:15 +0200
commite7f5b5a2f381e7677429edc8320d0257ef7fc1c7 (patch)
treeeb1d4e0c2234f7f829ddea703e07a7755ae108da /Tests/LibWeb/Layout
parentb9b6037d2ba312d5e31a7c10f0e9874a96d67936 (diff)
downloadserenity-e7f5b5a2f381e7677429edc8320d0257ef7fc1c7.zip
LibWeb: Fix multi-line flex column layouts with auto height on container
When sizing a flex container with flex-direction:column under a max-content height constraint, we were incorrectly truncating the infinite available height to 0 when collecting flex items into lines. This caused us to put every flex item in its own flex line, which is the complete opposite of what we want during max-content intrinsic sizing, as the layout would grow wide but not tall.
Diffstat (limited to 'Tests/LibWeb/Layout')
-rw-r--r--Tests/LibWeb/Layout/expected/flex/multi-line-column-container-with-automatic-height.txt7
-rw-r--r--Tests/LibWeb/Layout/input/flex/multi-line-column-container-with-automatic-height.html15
2 files changed, 22 insertions, 0 deletions
diff --git a/Tests/LibWeb/Layout/expected/flex/multi-line-column-container-with-automatic-height.txt b/Tests/LibWeb/Layout/expected/flex/multi-line-column-container-with-automatic-height.txt
new file mode 100644
index 0000000000..50b55e2e3c
--- /dev/null
+++ b/Tests/LibWeb/Layout/expected/flex/multi-line-column-container-with-automatic-height.txt
@@ -0,0 +1,7 @@
+Viewport <#document> at (0,0) content-size 800x600 children: not-inline
+ BlockContainer <html> at (1,1) content-size 798x176 children: not-inline
+ BlockContainer <body> at (10,10) content-size 780x158 children: not-inline
+ Box <div.flexbox> at (11,11) content-size 200x156 flex-container(column) children: not-inline
+ BlockContainer <div> at (12,12) content-size 50x50 flex-item children: not-inline
+ BlockContainer <div> at (12,64) content-size 50x50 flex-item children: not-inline
+ BlockContainer <div> at (12,116) content-size 50x50 flex-item children: not-inline
diff --git a/Tests/LibWeb/Layout/input/flex/multi-line-column-container-with-automatic-height.html b/Tests/LibWeb/Layout/input/flex/multi-line-column-container-with-automatic-height.html
new file mode 100644
index 0000000000..2df2347fbe
--- /dev/null
+++ b/Tests/LibWeb/Layout/input/flex/multi-line-column-container-with-automatic-height.html
@@ -0,0 +1,15 @@
+<!doctype html><style>
+* {
+ border: 1px solid black;
+}
+.flexbox {
+ display: flex;
+ flex-direction: column;
+ flex-wrap: wrap;
+ width: 200px;
+}
+.flexbox > div {
+ width: 50px;
+ height: 50px;
+}
+</style><div class="flexbox"><div></div><div></div><div></div> \ No newline at end of file