Commit 63680fae authored by Morten Stenshorne's avatar Morten Stenshorne Committed by Commit Bot

Web platform tests for break avoidance at class A breakpoints.

All the tests pass with LayoutNGBlockFragmentation enabled. The legacy
engine has no support for such break avoidance at all, although some of
these tests still pass there. The passing tests test that break
avoidance at class A breakpoints is ignored when it should (e.g. when
overridden by a forced break).

Bug: 829028
Change-Id: Ief589c29883d99c3e60ad40526ceb3460b4269ff
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2203068Reviewed-by: default avatarIan Kilpatrick <ikilpatrick@chromium.org>
Reviewed-by: default avatarAlison Maher <almaher@microsoft.com>
Commit-Queue: Morten Stenshorne <mstensho@chromium.org>
Cr-Commit-Position: refs/heads/master@{#769640}
parent a4ccf8c3
...@@ -853,6 +853,10 @@ crbug.com/591099 virtual/layout_ng_block_frag/fast/multicol/flowthread-with-floa ...@@ -853,6 +853,10 @@ crbug.com/591099 virtual/layout_ng_block_frag/fast/multicol/flowthread-with-floa
### With LayoutNGBlockFragmentation enabled: ### With LayoutNGBlockFragmentation enabled:
crbug.com/829028 virtual/layout_ng_block_frag/external/wpt/css/css-break/block-end-aligned-abspos-with-overflow.html [ Failure ] crbug.com/829028 virtual/layout_ng_block_frag/external/wpt/css/css-break/block-end-aligned-abspos-with-overflow.html [ Failure ]
crbug.com/829028 virtual/layout_ng_block_frag/external/wpt/css/css-break/break-between-avoid-000.html [ Pass ]
crbug.com/829028 virtual/layout_ng_block_frag/external/wpt/css/css-break/break-between-avoid-001.html [ Pass ]
crbug.com/829028 virtual/layout_ng_block_frag/external/wpt/css/css-break/break-between-avoid-003.html [ Pass ]
crbug.com/829028 virtual/layout_ng_block_frag/external/wpt/css/css-break/break-between-avoid-004.html [ Pass ]
crbug.com/1028595 virtual/layout_ng_block_frag/external/wpt/css/css-break/fieldset-001.html [ Failure ] crbug.com/1028595 virtual/layout_ng_block_frag/external/wpt/css/css-break/fieldset-001.html [ Failure ]
crbug.com/829028 virtual/layout_ng_block_frag/external/wpt/css/css-break/floats-and-text-narrow-and-short-dynamic.html [ Failure ] crbug.com/829028 virtual/layout_ng_block_frag/external/wpt/css/css-break/floats-and-text-narrow-and-short-dynamic.html [ Failure ]
crbug.com/829028 virtual/layout_ng_block_frag/external/wpt/css/css-break/line-after-unbreakable-float-after-padding.html [ Failure ] crbug.com/829028 virtual/layout_ng_block_frag/external/wpt/css/css-break/line-after-unbreakable-float-after-padding.html [ Failure ]
...@@ -3535,6 +3539,10 @@ crbug.com/1034807 [ Mac ] virtual/off-main-thread-css-paint/external/wpt/css/css ...@@ -3535,6 +3539,10 @@ crbug.com/1034807 [ Mac ] virtual/off-main-thread-css-paint/external/wpt/css/css
crbug.com/982116 http/tests/devtools/elements/styles-4/styles-new-API.js [ Pass Timeout ] crbug.com/982116 http/tests/devtools/elements/styles-4/styles-new-API.js [ Pass Timeout ]
crbug.com/829028 external/wpt/css/css-break/avoid-border-break.html [ Failure ] crbug.com/829028 external/wpt/css/css-break/avoid-border-break.html [ Failure ]
crbug.com/829028 external/wpt/css/css-break/break-between-avoid-000.html [ Failure ]
crbug.com/829028 external/wpt/css/css-break/break-between-avoid-001.html [ Failure ]
crbug.com/829028 external/wpt/css/css-break/break-between-avoid-003.html [ Failure ]
crbug.com/829028 external/wpt/css/css-break/break-between-avoid-004.html [ Failure ]
crbug.com/967329 external/wpt/css/css-multicol/columnfill-auto-max-height-001.html [ Failure ] crbug.com/967329 external/wpt/css/css-multicol/columnfill-auto-max-height-001.html [ Failure ]
crbug.com/967329 external/wpt/css/css-multicol/columnfill-auto-max-height-002.html [ Failure ] crbug.com/967329 external/wpt/css/css-multicol/columnfill-auto-max-height-002.html [ Failure ]
crbug.com/990240 external/wpt/css/css-multicol/multicol-breaking-000.html [ Failure ] crbug.com/990240 external/wpt/css/css-multicol/multicol-breaking-000.html [ Failure ]
......
<!DOCTYPE html>
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
<link rel="help" href="https://www.w3.org/TR/css-break-3/#unforced-breaks">
<link rel="match" href="../reference/ref-filled-green-100px-square-only.html">
<meta name="assert" content="Three blocks could fit in the first fragmentainer, but there's a break-before:avoid between the third and fourth block, so we should break between the second and third">
<style>
.square {
height: 50px;
break-inside: avoid;
background:green;
}
</style>
<p>Test passes if there is a filled green square.</p>
<div style="columns:2; column-fill:auto; column-gap:0; width:100px; height:160px;">
<div class="square"></div>
<div class="square"></div>
<div class="square"></div>
<div class="square" style="break-before:avoid;"></div>
</div>
<!DOCTYPE html>
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
<link rel="help" href="https://www.w3.org/TR/css-break-3/#unforced-breaks">
<link rel="match" href="../reference/ref-filled-green-100px-square-only.html">
<meta name="assert" content="Three blocks could fit in the first fragmentainer, but there's a break-after:avoid between the third and fourth block, so we should break between the second and third">
<style>
.square {
height: 50px;
break-inside: avoid;
background:green;
}
</style>
<p>Test passes if there is a filled green square.</p>
<div style="columns:2; column-fill:auto; column-gap:0; width:100px; height:160px;">
<div class="square"></div>
<div class="square"></div>
<div class="square" style="break-after:avoid;"></div>
<div class="square"></div>
</div>
<!DOCTYPE html>
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
<link rel="help" href="https://www.w3.org/TR/css-break-3/#unforced-breaks">
<link rel="match" href="../reference/ref-filled-green-100px-square-only.html">
<meta name="assert" content="Need to violate break-before:avoid and break-after:avoid if there are no better breakpoints">
<style>
.container {
break-before: avoid;
break-after: avoid;
}
.square {
display: inline-block;
vertical-align: top;
width: 100%;
height: 50px;
background:green;
}
</style>
<p>Test passes if there is a filled green square.</p>
<div style="columns:2; column-fill:auto; column-gap:0; width:100px; height:120px;">
<div class="container">
<div class="square"></div>
</div>
<div class="container">
<div class="square"></div>
</div>
<div class="container">
<div class="square"></div>
</div>
<div class="container">
<div class="square"></div>
</div>
</div>
<!DOCTYPE html>
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
<link rel="help" href="https://www.w3.org/TR/css-break-3/#unforced-breaks">
<link rel="match" href="../reference/ref-filled-green-100px-square-only.html">
<meta name="assert" content="The best breakpoint may be inside content we're already past when running out of space">
<style>
.square {
height: 50px;
break-inside: avoid;
background:green;
}
</style>
<p>Test passes if there is a filled green square.</p>
<div style="columns:2; column-fill:auto; column-gap:0; width:100px; height:160px;">
<div>
<div class="square"></div>
<div>
<div>
<div class="square"></div>
<div class="square"></div>
</div>
</div>
</div>
<div class="square" style="break-before:avoid;"></div>
</div>
<!DOCTYPE html>
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
<link rel="help" href="https://www.w3.org/TR/css-break-3/#unforced-breaks">
<link rel="match" href="../reference/ref-filled-green-100px-square-only.html">
<meta name="assert" content="Violate orphans/widows requirements rather than break-before:avoid and break-after:avoid">
<style>
.container {
break-before: avoid;
break-after: avoid;
}
.square {
display: inline-block;
vertical-align: top;
width: 100%;
height: 50px;
background:green;
}
</style>
<p>Test passes if there is a filled green square.</p>
<div style="columns:2; column-fill:auto; column-gap:0; width:100px; height:120px; orphans:2; widows:2;">
<div class="container">
<div class="square"></div>
</div>
<div class="container">
<div class="square"></div>
<div class="square"></div>
</div>
<div class="container">
<div class="square"></div>
</div>
</div>
<!DOCTYPE html>
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
<link rel="help" href="https://www.w3.org/TR/css-break-3/#unforced-breaks">
<link rel="match" href="../reference/ref-filled-green-100px-square-only.html">
<meta name="assert" content="A forced break trumps break avoidance preferences">
<style>
.square {
height: 50px;
break-inside: avoid;
background:green;
}
</style>
<p>Test passes if there is a filled green square.</p>
<div style="columns:2; column-fill:auto; column-gap:0; width:100px; height:110px;">
<div class="square"></div>
<div class="square" style="break-after:column;"></div>
<div class="square" style="break-before:avoid;"></div>
<div class="square"></div>
</div>
<!DOCTYPE html>
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
<link rel="help" href="https://www.w3.org/TR/css-break-3/#unforced-breaks">
<link rel="match" href="../reference/ref-filled-green-100px-square-only.html">
<meta name="assert" content="A forced break trumps break avoidance preferences">
<style>
.square {
height: 50px;
break-inside: avoid;
background:green;
}
</style>
<p>Test passes if there is a filled green square.</p>
<div style="columns:2; column-fill:auto; column-gap:0; width:100px; height:110px;">
<div class="square"></div>
<div>
<div>
<div class="square" style="break-after:column;"></div>
</div>
</div>
<div>
<div>
<div class="square" style="break-before:avoid;"></div>
</div>
</div>
<div class="square"></div>
</div>
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment