summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/css/css-break
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 01:13:33 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 01:13:33 +0000
commit086c044dc34dfc0f74fbe41f4ecb402b2cd34884 (patch)
treea4f824bd33cb075dd5aa3eb5a0a94af221bbe83a /testing/web-platform/tests/css/css-break
parentAdding debian version 124.0.1-1. (diff)
downloadfirefox-086c044dc34dfc0f74fbe41f4ecb402b2cd34884.tar.xz
firefox-086c044dc34dfc0f74fbe41f4ecb402b2cd34884.zip
Merging upstream version 125.0.1.
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/css/css-break')
-rw-r--r--testing/web-platform/tests/css/css-break/grid/monolithic-overflow-print-ref.html19
-rw-r--r--testing/web-platform/tests/css/css-break/grid/monolithic-overflow-print.html19
-rw-r--r--testing/web-platform/tests/css/css-break/out-of-flow-in-multicolumn-117.html14
-rw-r--r--testing/web-platform/tests/css/css-break/overflowing-block-002-print-ref.html23
-rw-r--r--testing/web-platform/tests/css/css-break/overflowing-block-002-print.html25
-rw-r--r--testing/web-platform/tests/css/css-break/overflowing-block-003-ref.html31
-rw-r--r--testing/web-platform/tests/css/css-break/overflowing-block-003.html45
-rw-r--r--testing/web-platform/tests/css/css-break/table/table-fragmentation-001a-print-ref.html29
-rw-r--r--testing/web-platform/tests/css/css-break/table/table-fragmentation-001a-print.html35
-rw-r--r--testing/web-platform/tests/css/css-break/table/table-fragmentation-001b-print.html36
-rw-r--r--testing/web-platform/tests/css/css-break/table/table-fragmentation-001c-print-ref.html31
-rw-r--r--testing/web-platform/tests/css/css-break/table/table-fragmentation-001c-print.html36
-rw-r--r--testing/web-platform/tests/css/css-break/table/table-fragmentation-001d-print.html37
-rw-r--r--testing/web-platform/tests/css/css-break/table/table-fragmentation-002a-print-ref.html31
-rw-r--r--testing/web-platform/tests/css/css-break/table/table-fragmentation-002a-print.html37
-rw-r--r--testing/web-platform/tests/css/css-break/table/table-fragmentation-002b-print.html38
-rw-r--r--testing/web-platform/tests/css/css-break/table/table-fragmentation-002c-print-ref.html33
-rw-r--r--testing/web-platform/tests/css/css-break/table/table-fragmentation-002c-print.html38
-rw-r--r--testing/web-platform/tests/css/css-break/table/table-fragmentation-002d-print.html39
-rw-r--r--testing/web-platform/tests/css/css-break/table/table-fragmentation-003a-print-ref.html46
-rw-r--r--testing/web-platform/tests/css/css-break/table/table-fragmentation-003a-print.html56
-rw-r--r--testing/web-platform/tests/css/css-break/table/table-fragmentation-003b-print.html57
-rw-r--r--testing/web-platform/tests/css/css-break/table/table-fragmentation-003c-print-ref.html47
-rw-r--r--testing/web-platform/tests/css/css-break/table/table-fragmentation-003c-print.html57
-rw-r--r--testing/web-platform/tests/css/css-break/table/table-fragmentation-003d-print.html58
25 files changed, 917 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-break/grid/monolithic-overflow-print-ref.html b/testing/web-platform/tests/css/css-break/grid/monolithic-overflow-print-ref.html
new file mode 100644
index 0000000000..ba0372df06
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/grid/monolithic-overflow-print-ref.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<link rel="author" title="Psychpsyo" href="mailto:psychpsyo@gmail.com" />
+<p style="height: 50vh">Test passes if there is two purple rectangles at the start of both page 2 and 3 when printing the page (Ctrl+P).</p>
+<div style="display:grid; grid-template-columns:1fr 1fr; break-before:page;">
+ <div style="contain:size; height:75vh;">
+ <div style="height:75vh; width: 100px; background:purple;"></div>
+ </div>
+ <div style="contain:size; height:75vh;">
+ <div style="height:75vh; width: 100px; background:purple;"></div>
+ </div>
+</div>
+<div style="display:grid; grid-template-columns:1fr 1fr; break-before:page;">
+ <div style="contain:size; height:75vh;">
+ <div style="height:75vh; width: 100px; background:purple;"></div>
+ </div>
+ <div style="contain:size; height:75vh;">
+ <div style="height:75vh; width: 100px; background:purple;"></div>
+ </div>
+</div>
diff --git a/testing/web-platform/tests/css/css-break/grid/monolithic-overflow-print.html b/testing/web-platform/tests/css/css-break/grid/monolithic-overflow-print.html
new file mode 100644
index 0000000000..5a9e55973d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/grid/monolithic-overflow-print.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<link rel="author" title="Psychpsyo" href="mailto:psychpsyo@gmail.com">
+<link rel="help" href="https://issues.chromium.org/issues/327643792">
+<link rel="match" href="./monolithic-overflow-print-ref.html">
+<p style="height: 50vh">Test passes if there is two purple rectangles at the start of both page 2 and 3 when printing the page (Ctrl+P).</p>
+<div style="display:grid; grid-template-columns:1fr 1fr;">
+ <div style="contain:size; height:75vh;">
+ <div style="height:75vh; width: 100px; background:purple;"></div>
+ </div>
+ <div style="contain:size; height:75vh;">
+ <div style="height:75vh; width: 100px; background:purple;"></div>
+ </div>
+ <div style="contain:size; height:75vh;">
+ <div style="height:75vh; width: 100px; background:purple;"></div>
+ </div>
+ <div style="contain:size; height:75vh;">
+ <div style="height:75vh; width: 100px; background:purple;"></div>
+ </div>
+</div>
diff --git a/testing/web-platform/tests/css/css-break/out-of-flow-in-multicolumn-117.html b/testing/web-platform/tests/css/css-break/out-of-flow-in-multicolumn-117.html
new file mode 100644
index 0000000000..886a12acab
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/out-of-flow-in-multicolumn-117.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://issues.chromium.org/issues/40775119">
+<link rel="match" href="../reference/ref-filled-green-100px-square.xht">
+<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+<div style="columns:2; column-fill:auto; gap:0; width:200px; height:100px;">
+ <div style="height:40px; background:green;"></div>
+ <div style="columns:2; column-fill:auto; gap:0; height:40px; background:red;">
+ <div style="position:relative; height:20px; background:red;">
+ <div style="position:absolute; top:0; width:50px; height:40px; background:green;"></div>
+ </div>
+ <div style="column-span:all; height:40px; background:green;"></div>
+ </div>
+</div>
diff --git a/testing/web-platform/tests/css/css-break/overflowing-block-002-print-ref.html b/testing/web-platform/tests/css/css-break/overflowing-block-002-print-ref.html
new file mode 100644
index 0000000000..0322ba04a0
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/overflowing-block-002-print-ref.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+<link rel="help" href="https://drafts.csswg.org/css-break-3/#parallel-flows">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=563436">
+<link rel="stylesheet" href="/fonts/ahem.css">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+.content {
+ font: 0.5in/1 Ahem;
+ color: white;
+ word-break: break-all;
+ border: 0.5in solid purple;
+ margin-right: 2in;
+}
+</style>
+
+<!-- The content is printed in two pages. -->
+<div class="content">XXXXXXXXXXXX</div>
diff --git a/testing/web-platform/tests/css/css-break/overflowing-block-002-print.html b/testing/web-platform/tests/css/css-break/overflowing-block-002-print.html
new file mode 100644
index 0000000000..3cba4b421f
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/overflowing-block-002-print.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+<link rel="match" href="overflowing-block-002-print-ref.html">
+<link rel="help" href="https://drafts.csswg.org/css-break-3/#parallel-flows">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=563436">
+<link rel="stylesheet" href="/fonts/ahem.css">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+.content {
+ position: absolute;
+ font: 0.5in/1 Ahem;
+ color: white;
+ word-break: break-all;
+ border: 0.5in solid purple;
+ margin-right: 2in;
+}
+</style>
+
+<!-- The content is printed in two pages. -->
+<div class="content">XXXXXXXXXXXX</div>
diff --git a/testing/web-platform/tests/css/css-break/overflowing-block-003-ref.html b/testing/web-platform/tests/css/css-break/overflowing-block-003-ref.html
new file mode 100644
index 0000000000..a8f86d1cfe
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/overflowing-block-003-ref.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+
+<style>
+.multicol {
+ width: 150px;
+ height: 50px;
+ columns: 2;
+ column-gap: 0;
+ column-fill: auto;
+ border: 3px solid black;
+ margin: 10px;
+}
+.outer {
+ width: 50px;
+ height: 100px;
+ background: green;
+}
+</style>
+
+<p>This test passes if there are two 50x50 green squares in each black box.</p>
+
+<div class="multicol">
+ <div class="outer"></div>
+</div>
+
+<div class="multicol">
+ <div class="outer"></div>
+</div>
diff --git a/testing/web-platform/tests/css/css-break/overflowing-block-003.html b/testing/web-platform/tests/css/css-break/overflowing-block-003.html
new file mode 100644
index 0000000000..786a61a492
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/overflowing-block-003.html
@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+<link rel="match" href="overflowing-block-003-ref.html">
+<link rel="help" href="https://drafts.csswg.org/css-break-3/#parallel-flows">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=563436">
+<link rel="stylesheet" href="/fonts/ahem.css">
+
+<style>
+.multicol {
+ width: 150px;
+ height: 50px;
+ columns: 2;
+ column-gap: 0;
+ column-fill: auto;
+ border: 3px solid black;
+ margin: 10px;
+}
+.outer {
+ margin-right: 25px;
+}
+.inner {
+ background: green;
+ color: green;
+ font: 25px/1 Ahem;
+ word-break: break-all;
+}
+</style>
+
+<p>This test passes if there are two 50x50 green squares in each black box.</p>
+
+<div class="multicol">
+ <div class="outer">
+ <div class="inner" style="float: left">
+ AAAA BBBB
+ </div>
+ </div>
+</div>
+
+<div class="multicol">
+ <div class="outer" style="height: 0">
+ <div class="inner" style="height: 100px"></div>
+ </div>
+</div>
diff --git a/testing/web-platform/tests/css/css-break/table/table-fragmentation-001a-print-ref.html b/testing/web-platform/tests/css/css-break/table/table-fragmentation-001a-print-ref.html
new file mode 100644
index 0000000000..d4229ebb87
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/table/table-fragmentation-001a-print-ref.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+.table {
+ width: 3in;
+ box-sizing: border-box;
+ border: 0.25in solid black;
+ padding: 0.5in;
+}
+.td {
+ border: 0.25in solid orange;
+}
+.content {
+ height: 1.5in;
+ background: gold;
+}
+</style>
+
+<div class="table">
+ <div class="td">
+ <div class="content"></div>
+ </div>
+</div>
diff --git a/testing/web-platform/tests/css/css-break/table/table-fragmentation-001a-print.html b/testing/web-platform/tests/css/css-break/table/table-fragmentation-001a-print.html
new file mode 100644
index 0000000000..4f2123b648
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/table/table-fragmentation-001a-print.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1863421">
+<link rel="match" href="table-fragmentation-001a-print-ref.html">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+table {
+ inline-size: 3in;
+ border-spacing: 0.25in;
+ border: 0.25in solid black;
+ padding: 0.25in;
+}
+td {
+ vertical-align: top;
+ padding: 0;
+ border: 0.25in solid orange;
+}
+.content {
+ block-size: 1.5in;
+ background: gold;
+}
+</style>
+
+<table>
+ <tbody>
+ <tr>
+ <td><div class="content"></div></td>
+ </tr>
+ </tbody>
+</table>
diff --git a/testing/web-platform/tests/css/css-break/table/table-fragmentation-001b-print.html b/testing/web-platform/tests/css/css-break/table/table-fragmentation-001b-print.html
new file mode 100644
index 0000000000..d445206a2b
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/table/table-fragmentation-001b-print.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1863421">
+<link rel="match" href="table-fragmentation-001a-print-ref.html">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+table {
+ inline-size: 3in;
+ block-size: 3.5in;
+ border-spacing: 0.25in;
+ border: 0.25in solid black;
+ padding: 0.25in;
+}
+td {
+ vertical-align: top;
+ padding: 0;
+ border: 0.25in solid orange;
+}
+.content {
+ block-size: 1.5in;
+ background: gold;
+}
+</style>
+
+<table>
+ <tbody>
+ <tr>
+ <td><div class="content"></div></td>
+ </tr>
+ </tbody>
+</table>
diff --git a/testing/web-platform/tests/css/css-break/table/table-fragmentation-001c-print-ref.html b/testing/web-platform/tests/css/css-break/table/table-fragmentation-001c-print-ref.html
new file mode 100644
index 0000000000..d7778e340a
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/table/table-fragmentation-001c-print-ref.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+.table {
+ width: 3in;
+ box-sizing: border-box;
+ border: 0.25in solid black;
+ padding: 0.25in 0.5in;
+ box-decoration-break: clone;
+}
+.td {
+ margin: 0.25in 0;
+ border: 0.25in solid orange;
+}
+.content {
+ height: 2in;
+ background: gold;
+}
+</style>
+
+<div class="table">
+ <div class="td">
+ <div class="content"></div>
+ </div>
+</div>
diff --git a/testing/web-platform/tests/css/css-break/table/table-fragmentation-001c-print.html b/testing/web-platform/tests/css/css-break/table/table-fragmentation-001c-print.html
new file mode 100644
index 0000000000..4615270c40
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/table/table-fragmentation-001c-print.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1863421">
+<link rel="match" href="table-fragmentation-001c-print-ref.html">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+table {
+ inline-size: 3in;
+ border-spacing: 0.25in;
+ border: 0.25in solid black;
+ padding: 0.25in;
+ box-decoration-break: clone;
+}
+td {
+ vertical-align: top;
+ padding: 0;
+ border: 0.25in solid orange;
+}
+.content {
+ block-size: 2in;
+ background: gold;
+}
+</style>
+
+<table>
+ <tbody>
+ <tr>
+ <td><div class="content"></div></td>
+ </tr>
+ </tbody>
+</table>
diff --git a/testing/web-platform/tests/css/css-break/table/table-fragmentation-001d-print.html b/testing/web-platform/tests/css/css-break/table/table-fragmentation-001d-print.html
new file mode 100644
index 0000000000..ad120c2481
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/table/table-fragmentation-001d-print.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1863421">
+<link rel="match" href="table-fragmentation-001c-print-ref.html">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+table {
+ inline-size: 3in;
+ block-size: 4in;
+ border-spacing: 0.25in;
+ border: 0.25in solid black;
+ padding: 0.25in;
+ box-decoration-break: clone;
+}
+td {
+ vertical-align: top;
+ padding: 0;
+ border: 0.25in solid orange;
+}
+.content {
+ block-size: 2in;
+ background: gold;
+}
+</style>
+
+<table>
+ <tbody>
+ <tr>
+ <td><div class="content"></div></td>
+ </tr>
+ </tbody>
+</table>
diff --git a/testing/web-platform/tests/css/css-break/table/table-fragmentation-002a-print-ref.html b/testing/web-platform/tests/css/css-break/table/table-fragmentation-002a-print-ref.html
new file mode 100644
index 0000000000..d7272352a1
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/table/table-fragmentation-002a-print-ref.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+.table {
+ width: 3in;
+ box-sizing: border-box;
+ border: 0.25in solid black;
+ padding: 0.5in;
+}
+.td {
+ border: 0.25in solid orange;
+}
+.content {
+ height: 1.5in;
+ background: gold;
+}
+</style>
+
+<div style="height: 0.25in">BEFORE TABLE</div>
+<div class="table">
+ <div class="td">
+ <div class="content"></div>
+ </div>
+</div>
+<div style="height: 0.25in">AFTER TABLE</div>
diff --git a/testing/web-platform/tests/css/css-break/table/table-fragmentation-002a-print.html b/testing/web-platform/tests/css/css-break/table/table-fragmentation-002a-print.html
new file mode 100644
index 0000000000..88ea8cd697
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/table/table-fragmentation-002a-print.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1863421">
+<link rel="match" href="table-fragmentation-002a-print-ref.html">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+table {
+ inline-size: 3in;
+ border-spacing: 0.25in;
+ border: 0.25in solid black;
+ padding: 0.25in;
+}
+td {
+ vertical-align: top;
+ padding: 0;
+ border: 0.25in solid orange;
+}
+.content {
+ block-size: 1.5in;
+ background: gold;
+}
+</style>
+
+<div style="height: 0.25in">BEFORE TABLE</div>
+<table>
+ <tbody>
+ <tr>
+ <td><div class="content"></div></td>
+ </tr>
+ </tbody>
+</table>
+<div style="height: 0.25in">AFTER TABLE</div>
diff --git a/testing/web-platform/tests/css/css-break/table/table-fragmentation-002b-print.html b/testing/web-platform/tests/css/css-break/table/table-fragmentation-002b-print.html
new file mode 100644
index 0000000000..97e102e3cd
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/table/table-fragmentation-002b-print.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1863421">
+<link rel="match" href="table-fragmentation-002a-print-ref.html">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+table {
+ inline-size: 3in;
+ block-size: 3.5in;
+ border-spacing: 0.25in;
+ border: 0.25in solid black;
+ padding: 0.25in;
+}
+td {
+ vertical-align: top;
+ padding: 0;
+ border: 0.25in solid orange;
+}
+.content {
+ block-size: 1.5in;
+ background: gold;
+}
+</style>
+
+<div style="height: 0.25in">BEFORE TABLE</div>
+<table>
+ <tbody>
+ <tr>
+ <td><div class="content"></div></td>
+ </tr>
+ </tbody>
+</table>
+<div style="height: 0.25in">AFTER TABLE</div>
diff --git a/testing/web-platform/tests/css/css-break/table/table-fragmentation-002c-print-ref.html b/testing/web-platform/tests/css/css-break/table/table-fragmentation-002c-print-ref.html
new file mode 100644
index 0000000000..18c1e0d5a9
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/table/table-fragmentation-002c-print-ref.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+.table {
+ width: 3in;
+ box-sizing: border-box;
+ border: 0.25in solid black;
+ padding: 0.25in 0.5in;
+ box-decoration-break: clone;
+}
+.td {
+ margin: 0.25in 0;
+ border: 0.25in solid orange;
+}
+.content {
+ height: 1.5in;
+ background: gold;
+}
+</style>
+
+<div style="height: 0.25in">BEFORE TABLE</div>
+<div class="table">
+ <div class="td">
+ <div class="content"></div>
+ </div>
+</div>
+<div style="height: 0.25in">AFTER TABLE</div>
diff --git a/testing/web-platform/tests/css/css-break/table/table-fragmentation-002c-print.html b/testing/web-platform/tests/css/css-break/table/table-fragmentation-002c-print.html
new file mode 100644
index 0000000000..29fccdef99
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/table/table-fragmentation-002c-print.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1863421">
+<link rel="match" href="table-fragmentation-002c-print-ref.html">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+table {
+ inline-size: 3in;
+ border-spacing: 0.25in;
+ border: 0.25in solid black;
+ padding: 0.25in;
+ box-decoration-break: clone;
+}
+td {
+ vertical-align: top;
+ padding: 0;
+ border: 0.25in solid orange;
+}
+.content {
+ block-size: 1.5in;
+ background: gold;
+}
+</style>
+
+<div style="height: 0.25in">BEFORE TABLE</div>
+<table>
+ <tbody>
+ <tr>
+ <td><div class="content"></div></td>
+ </tr>
+ </tbody>
+</table>
+<div style="height: 0.25in">AFTER TABLE</div>
diff --git a/testing/web-platform/tests/css/css-break/table/table-fragmentation-002d-print.html b/testing/web-platform/tests/css/css-break/table/table-fragmentation-002d-print.html
new file mode 100644
index 0000000000..67aa7624b7
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/table/table-fragmentation-002d-print.html
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1863421">
+<link rel="match" href="table-fragmentation-002c-print-ref.html">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+table {
+ inline-size: 3in;
+ block-size: 3.5in;
+ border-spacing: 0.25in;
+ border: 0.25in solid black;
+ padding: 0.25in;
+ box-decoration-break: clone;
+}
+td {
+ vertical-align: top;
+ padding: 0;
+ border: 0.25in solid orange;
+}
+.content {
+ block-size: 1.5in;
+ background: gold;
+}
+</style>
+
+<div style="height: 0.25in">BEFORE TABLE</div>
+<table>
+ <tbody>
+ <tr>
+ <td><div class="content"></div></td>
+ </tr>
+ </tbody>
+</table>
+<div style="height: 0.25in">AFTER TABLE</div>
diff --git a/testing/web-platform/tests/css/css-break/table/table-fragmentation-003a-print-ref.html b/testing/web-platform/tests/css/css-break/table/table-fragmentation-003a-print-ref.html
new file mode 100644
index 0000000000..bf99e5b41e
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/table/table-fragmentation-003a-print-ref.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1863421">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+.table {
+ inline-size: 3in;
+ box-sizing: border-box;
+ border: 0.25in solid black;
+ padding: 0.25in;
+}
+.thead {
+ block-size: 0.25in;
+ background: blue;
+}
+.tbody {
+ border: 0 solid orange;
+ margin-block: 0.125in;
+ background: gold;
+}
+.tfoot {
+ block-size: 0.25in;
+ background: purple;
+}
+</style>
+
+<div class="table">
+ <!-- Page 1 -->
+ <div class="thead"></div>
+ <div class="tbody" style="border-block-start-width: 0.25in; block-size: 0.5in;"></div>
+ <div class="tfoot"></div>
+
+ <!-- Page 2 -->
+ <div class="thead"></div>
+ <div class="tbody" style="block-size: 1.25in;"></div>
+ <div class="tfoot"></div>
+
+ <!-- Page 3 -->
+ <div class="thead"></div>
+ <div class="tbody" style="border-block-end-width: 0.25in; block-size: 0.25in;"></div>
+ <div class="tfoot"></div>
+</div>
diff --git a/testing/web-platform/tests/css/css-break/table/table-fragmentation-003a-print.html b/testing/web-platform/tests/css/css-break/table/table-fragmentation-003a-print.html
new file mode 100644
index 0000000000..c6190855b0
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/table/table-fragmentation-003a-print.html
@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1863421">
+<link rel="match" href="table-fragmentation-003a-print-ref.html">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+table {
+ inline-size: 3in;
+ border-spacing: 0.125in;
+ border: 0.25in solid black;
+ padding: 0.125in;
+}
+td {
+ padding: 0;
+}
+thead td {
+ block-size: 0.25in;
+ background: blue;
+}
+tbody td {
+ vertical-align: top;
+ border: solid orange;
+ border-width: 0.25in 0;
+}
+.content {
+ block-size: 2in;
+ background: gold;
+}
+tfoot td {
+ block-size: 0.25in;
+ background: purple;
+}
+</style>
+
+<table>
+ <thead>
+ <tr>
+ <td></td>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td><div class="content"></div></td>
+ </tr>
+ </tbody>
+ <tfoot>
+ <tr>
+ <td></td>
+ </tr>
+ </tfoot>
+</table>
diff --git a/testing/web-platform/tests/css/css-break/table/table-fragmentation-003b-print.html b/testing/web-platform/tests/css/css-break/table/table-fragmentation-003b-print.html
new file mode 100644
index 0000000000..a1d3b21298
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/table/table-fragmentation-003b-print.html
@@ -0,0 +1,57 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1863421">
+<link rel="match" href="table-fragmentation-003a-print-ref.html">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+table {
+ inline-size: 3in;
+ block-size: 4.25in;
+ border-spacing: 0.125in;
+ border: 0.25in solid black;
+ padding: 0.125in;
+}
+td {
+ padding: 0;
+}
+thead td {
+ block-size: 0.25in;
+ background: blue;
+}
+tbody td {
+ vertical-align: top;
+ border: solid orange;
+ border-width: 0.25in 0;
+}
+.content {
+ block-size: 2in;
+ background: gold;
+}
+tfoot td {
+ block-size: 0.25in;
+ background: purple;
+}
+</style>
+
+<table>
+ <thead>
+ <tr>
+ <td></td>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td><div class="content"></div></td>
+ </tr>
+ </tbody>
+ <tfoot>
+ <tr>
+ <td></td>
+ </tr>
+ </tfoot>
+</table>
diff --git a/testing/web-platform/tests/css/css-break/table/table-fragmentation-003c-print-ref.html b/testing/web-platform/tests/css/css-break/table/table-fragmentation-003c-print-ref.html
new file mode 100644
index 0000000000..50738fbaa8
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/table/table-fragmentation-003c-print-ref.html
@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1863421">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+.table {
+ inline-size: 3in;
+ box-sizing: border-box;
+ border: 0.25in solid black;
+ padding: 0.125in 0.25in;
+ box-decoration-break: clone;
+}
+.thead {
+ block-size: 0.25in;
+ background: blue;
+}
+.tbody {
+ border: 0 solid orange;
+ margin-block: 0.125in;
+ background: gold;
+}
+.tfoot {
+ block-size: 0.25in;
+ background: purple;
+}
+</style>
+
+<div class="table">
+ <!-- Page 1 -->
+ <div class="thead" style="margin-block-start: 0.125in;"></div>
+ <div class="tbody" style="border-block-start-width: 0.25in; block-size: 0.125in;"></div>
+ <div class="tfoot"></div>
+
+ <!-- Page 2 -->
+ <div class="thead"></div>
+ <div class="tbody" style="block-size: 0.5in;"></div>
+ <div class="tfoot"></div>
+
+ <!-- Page 3 -->
+ <div class="thead"></div>
+ <div class="tbody" style="border-block-end-width: 0.25in; block-size: 0.125in;"></div>
+ <div class="tfoot" style="margin-block-end: 0.125in;"></div>
+</div>
diff --git a/testing/web-platform/tests/css/css-break/table/table-fragmentation-003c-print.html b/testing/web-platform/tests/css/css-break/table/table-fragmentation-003c-print.html
new file mode 100644
index 0000000000..9c4f8d3873
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/table/table-fragmentation-003c-print.html
@@ -0,0 +1,57 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1863421">
+<link rel="match" href="table-fragmentation-003c-print-ref.html">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+table {
+ inline-size: 3in;
+ border-spacing: 0.125in;
+ border: 0.25in solid black;
+ padding: 0.125in;
+ box-decoration-break: clone;
+}
+td {
+ padding: 0;
+}
+thead td {
+ block-size: 0.25in;
+ background: blue;
+}
+tbody td {
+ vertical-align: top;
+ border: solid orange;
+ border-width: 0.25in 0;
+}
+.content {
+ block-size: 0.75in;
+ background: gold;
+}
+tfoot td {
+ block-size: 0.25in;
+ background: purple;
+}
+</style>
+
+<table>
+ <thead>
+ <tr>
+ <td></td>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td><div class="content"></div></td>
+ </tr>
+ </tbody>
+ <tfoot>
+ <tr>
+ <td></td>
+ </tr>
+ </tfoot>
+</table>
diff --git a/testing/web-platform/tests/css/css-break/table/table-fragmentation-003d-print.html b/testing/web-platform/tests/css/css-break/table/table-fragmentation-003d-print.html
new file mode 100644
index 0000000000..1903a68c58
--- /dev/null
+++ b/testing/web-platform/tests/css/css-break/table/table-fragmentation-003d-print.html
@@ -0,0 +1,58 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1863421">
+<link rel="match" href="table-fragmentation-003c-print-ref.html">
+
+<style>
+@page { size: 5in 3in; margin: 0.5in; }
+body { margin: 0; }
+
+table {
+ inline-size: 3in;
+ block-size: 3in;
+ border-spacing: 0.125in;
+ border: 0.25in solid black;
+ padding: 0.125in;
+ box-decoration-break: clone;
+}
+td {
+ padding: 0;
+}
+thead td {
+ block-size: 0.25in;
+ background: blue;
+}
+tbody td {
+ vertical-align: top;
+ border: solid orange;
+ border-width: 0.25in 0;
+}
+.content {
+ block-size: 0.75in;
+ background: gold;
+}
+tfoot td {
+ block-size: 0.25in;
+ background: purple;
+}
+</style>
+
+<table>
+ <thead>
+ <tr>
+ <td></td>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td><div class="content"></div></td>
+ </tr>
+ </tbody>
+ <tfoot>
+ <tr>
+ <td></td>
+ </tr>
+ </tfoot>
+</table>