Detect all unappealing breaks for column balancing.
If we insert a break at any unappealing breakpoint, and column balancing
is enabled, we should attempt to stretch the columns. We were already
handling orphans / widows / break-{after,before,inside}:avoid
violations, but were skipping last-resort breaks, as that would have
broken some tests. But it's actually the tests that are invalid: they
assumed that breaking between the margin and the border of a child is a
good place to break, but it it's not (no valid breakpoint there). Remove
those invalid tests.
Furthermore, also detect if the box itself (not a child) breaks at an
unappealing breakpoint when finishing fragmentation in a node. This
happens e.g. after block-start border/padding and before block-end
border/padding.
fast/multicol/infinite-height-causing-fractional-row-height-crash.html
will now time out, so skip it (like we already do for similar tests).
This is a known problem (crbug.com/1225630) which is now also affecting
this test, because we stretch the columns (because of a tall margin) in
the row preceding the spanner so much there's hardly any room left for
columns after the spanner (so we end up with millions of columns).
Also had to update a unit test, since it will no longer break between
the block-start margin and border of the spanner parent.
Bug: 1193966, 829028
Change-Id: I5529a5a029f18cf684f2f646f68fb680d2aaec94
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3122185
Commit-Queue: Morten Stenshorne <mstensho@chromium.org>
Reviewed-by: Alison Maher <almaher@microsoft.com>
Reviewed-by: Ian Kilpatrick <ikilpatrick@chromium.org>
Cr-Commit-Position: refs/heads/main@{#915657}
diff --git a/css/css-multicol/multicol-fill-balance-008.html b/css/css-multicol/multicol-fill-balance-008.html
new file mode 100644
index 0000000..b930e71
--- /dev/null
+++ b/css/css-multicol/multicol-fill-balance-008.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://www.w3.org/TR/css-multicol-1/#cf">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1193966">
+<style>
+ #container {
+ columns: 2;
+ width: 100px;
+ column-gap: 0;
+ background: green;
+ }
+</style>
+<p>Test passes if there is a filled green square below.</p>
+<div id="container" data-expected-height="100">
+ <div style="padding:25px 0;">
+ <div style="contain:size; height:50px;"></div>
+ </div>
+</div>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/check-layout-th.js"></script>
+<script>
+ checkLayout("#container");
+</script>
diff --git a/css/css-multicol/multicol-fill-balance-009.html b/css/css-multicol/multicol-fill-balance-009.html
new file mode 100644
index 0000000..e8b53bf
--- /dev/null
+++ b/css/css-multicol/multicol-fill-balance-009.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://www.w3.org/TR/css-multicol-1/#cf">
+<style>
+ #container {
+ columns: 4;
+ width: 100px;
+ column-gap: 0;
+ background: green;
+ }
+</style>
+<p>Test passes if there is a filled green square below.</p>
+<div id="container" data-expected-height="100">
+ <div style="margin-top:50px;">
+ <div style="contain:size; height:50px;"></div>
+ <div style="contain:size; height:25px;"></div>
+ </div>
+</div>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/check-layout-th.js"></script>
+<script>
+ checkLayout("#container");
+</script>
diff --git a/css/css-multicol/multicol-fill-balance-012.html b/css/css-multicol/multicol-fill-balance-012.html
new file mode 100644
index 0000000..877cdc9
--- /dev/null
+++ b/css/css-multicol/multicol-fill-balance-012.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://www.w3.org/TR/css-multicol-1/#cf">
+<style>
+ #container {
+ columns: 10;
+ width: 100px;
+ column-gap: 0;
+ background: green;
+ }
+</style>
+<p>Test passes if there is a filled green square below.</p>
+<div id="container" data-expected-height="100">
+ <div style="padding:40px 0; border-style:solid; border-color:green; border-width:40px 0;">
+ <div style="contain:size; height:20px;"></div>
+ <div style="contain:size; height:20px;"></div>
+ </div>
+</div>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/check-layout-th.js"></script>
+<script>
+ checkLayout("#container");
+</script>
diff --git a/css/css-multicol/multicol-fill-balance-013.html b/css/css-multicol/multicol-fill-balance-013.html
new file mode 100644
index 0000000..7a443b3
--- /dev/null
+++ b/css/css-multicol/multicol-fill-balance-013.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://www.w3.org/TR/css-multicol-1/#cf">
+<style>
+ #container {
+ columns: 10;
+ width: 100px;
+ column-gap: 0;
+ background: green;
+ }
+</style>
+<p>Test passes if there is a filled green square below.</p>
+<div id="container" data-expected-height="100">
+ <div style="padding:20px 0; border-style:solid; border-color:green; border-width:20px 0;">
+ <div style="contain:size; height:20px;"></div>
+ </div>
+</div>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/check-layout-th.js"></script>
+<script>
+ checkLayout("#container");
+</script>
