summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/css/printing
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 01:47:29 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-19 01:47:29 +0000
commit0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d (patch)
treea31f07c9bcca9d56ce61e9a1ffd30ef350d513aa /testing/web-platform/tests/css/printing
parentInitial commit. (diff)
downloadfirefox-esr-0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d.tar.xz
firefox-esr-0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d.zip
Adding upstream version 115.8.0esr.upstream/115.8.0esr
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/css/printing')
-rw-r--r--testing/web-platform/tests/css/printing/animated-image-print-image-orientation-none.html5
-rw-r--r--testing/web-platform/tests/css/printing/animated-image-print.html5
-rw-r--r--testing/web-platform/tests/css/printing/animations-print-ref.html11
-rw-r--r--testing/web-platform/tests/css/printing/animations-print.html18
-rw-r--r--testing/web-platform/tests/css/printing/animations-shadow-print-ref.html5
-rw-r--r--testing/web-platform/tests/css/printing/animations-shadow-print.html32
-rw-r--r--testing/web-platform/tests/css/printing/background-image-print-ref.html40
-rw-r--r--testing/web-platform/tests/css/printing/background-image-print.html44
-rw-r--r--testing/web-platform/tests/css/printing/emoji-print.html15
-rw-r--r--testing/web-platform/tests/css/printing/existing-transition-in-media-print.tentative.html22
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-001-print-ref.html17
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-001-print.html13
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-002-print-ref.html17
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-002-print.html13
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-003-print-ref.html17
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-003-print.html13
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-004-print-ref.html26
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-004-print.html18
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-005-print-ref.html42
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-005-print.html22
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-006-print-ref.html57
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-006-print.html23
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-007-print-ref.html26
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-007-print.html19
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-008-print-ref.html44
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-008-print.html23
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-with-abspos-with-link-print-ref.html13
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-with-abspos-with-link-print.html15
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-with-iframe-print-ref.html10
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-with-iframe-print.html12
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-with-link-with-inline-child-print-ref.html10
-rw-r--r--testing/web-platform/tests/css/printing/fixedpos-with-link-with-inline-child-print.html12
-rw-r--r--testing/web-platform/tests/css/printing/fragmented-inline-block-001-print.html33
-rw-r--r--testing/web-platform/tests/css/printing/fragmented-inline-block-002-print-ref.html18
-rw-r--r--testing/web-platform/tests/css/printing/fragmented-inline-block-002-print.html25
-rw-r--r--testing/web-platform/tests/css/printing/input-file-print-ref.html22
-rw-r--r--testing/web-platform/tests/css/printing/input-file-print.html23
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-001-print-ref.html7
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-001-print.html9
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-002-print-ref.html7
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-002-print.html9
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-003-print.html14
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-004-print.html16
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-005-print.html14
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-006-print.html16
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-007-print.html14
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-008-print.html16
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-009-print.html14
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-010-print.html16
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-011-print.html16
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-012-print-ref.html9
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-012-print.html11
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-013-print-ref.html9
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-013-print.html11
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-014-print-ref.html10
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-014-print.html12
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-015-print-ref.html7
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-015-print.html9
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-016-print-ref.html22
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-016-print.html18
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-017-print-ref.html17
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-017-print.html15
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-018-print-ref.html9
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-018-print.html13
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-019-print-ref.html10
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-019-print.html12
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-020-print-ref.html21
-rw-r--r--testing/web-platform/tests/css/printing/monolithic-overflow-020-print.html25
-rw-r--r--testing/web-platform/tests/css/printing/no-resize-event-print.html10
-rw-r--r--testing/web-platform/tests/css/printing/no-resize-event-ref.html2
-rw-r--r--testing/web-platform/tests/css/printing/page-name-001-print-ref.html5
-rw-r--r--testing/web-platform/tests/css/printing/page-name-001-print.html10
-rw-r--r--testing/web-platform/tests/css/printing/page-name-002-print-ref.html26
-rw-r--r--testing/web-platform/tests/css/printing/page-name-002-print.html21
-rw-r--r--testing/web-platform/tests/css/printing/page-name-003-print-ref.html6
-rw-r--r--testing/web-platform/tests/css/printing/page-name-003-print.html9
-rw-r--r--testing/web-platform/tests/css/printing/page-overflow-crash-print.html13
-rw-r--r--testing/web-platform/tests/css/printing/paused-animations-print-ref.html4
-rw-r--r--testing/web-platform/tests/css/printing/paused-animations-print.html22
-rw-r--r--testing/web-platform/tests/css/printing/pseudo-animations-print-ref.html18
-rw-r--r--testing/web-platform/tests/css/printing/pseudo-animations-print.html29
-rw-r--r--testing/web-platform/tests/css/printing/reference/monolithic-overflow-4-pages-print-ref.html12
-rw-r--r--testing/web-platform/tests/css/printing/transform-001-print-ref.html8
-rw-r--r--testing/web-platform/tests/css/printing/transform-001-print.html11
-rw-r--r--testing/web-platform/tests/css/printing/transform-002-print-ref.html4
-rw-r--r--testing/web-platform/tests/css/printing/transform-002-print.html11
-rw-r--r--testing/web-platform/tests/css/printing/transform-003-print-ref.html13
-rw-r--r--testing/web-platform/tests/css/printing/transform-003-print.html21
-rw-r--r--testing/web-platform/tests/css/printing/transition-in-media-print-ref.html5
-rw-r--r--testing/web-platform/tests/css/printing/transition-in-media-print.tentative.html19
-rw-r--r--testing/web-platform/tests/css/printing/zero-size-001-print.tentative.html13
-rw-r--r--testing/web-platform/tests/css/printing/zero-size-002-print.tentative.html13
-rw-r--r--testing/web-platform/tests/css/printing/zero-size-003-print.tentative.html13
-rw-r--r--testing/web-platform/tests/css/printing/zero-size-print-ref.html6
94 files changed, 1512 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/printing/animated-image-print-image-orientation-none.html b/testing/web-platform/tests/css/printing/animated-image-print-image-orientation-none.html
new file mode 100644
index 0000000000..d5ec1a8e23
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/animated-image-print-image-orientation-none.html
@@ -0,0 +1,5 @@
+<!doctype html>
+<title>Printing animated image</title>
+<link rel="help" href="https://html.spec.whatwg.org/#the-img-element">
+<link rel="mismatch" href="/css/reference/blank.html">
+<img style="image-orientation: none" src="/images/anim-gr.gif">
diff --git a/testing/web-platform/tests/css/printing/animated-image-print.html b/testing/web-platform/tests/css/printing/animated-image-print.html
new file mode 100644
index 0000000000..7c7665366d
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/animated-image-print.html
@@ -0,0 +1,5 @@
+<!doctype html>
+<title>Printing animated image</title>
+<link rel="help" href="https://html.spec.whatwg.org/#the-img-element">
+<link rel="mismatch" href="/css/reference/blank.html">
+<img src="/images/anim-gr.gif">
diff --git a/testing/web-platform/tests/css/printing/animations-print-ref.html b/testing/web-platform/tests/css/printing/animations-print-ref.html
new file mode 100644
index 0000000000..8830913084
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/animations-print-ref.html
@@ -0,0 +1,11 @@
+<!DOCTYPE HTML>
+<html>
+<title>Static CSS animation</title>
+<style>
+
+p {
+ color: blue;
+}
+
+</style>
+<p>blue with animation support; olive without</p>
diff --git a/testing/web-platform/tests/css/printing/animations-print.html b/testing/web-platform/tests/css/printing/animations-print.html
new file mode 100644
index 0000000000..8839fd971e
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/animations-print.html
@@ -0,0 +1,18 @@
+<!DOCTYPE HTML>
+<html>
+<link rel="help" href="https://drafts.csswg.org/css-animations/">
+<link rel="match" href="animations-print-ref.html">
+<title>Static CSS animation</title>
+<style>
+
+@keyframes a {
+ from, to { color: blue }
+}
+
+p {
+ color: olive;
+ animation: a 1s infinite;
+}
+
+</style>
+<p>blue with animation support; olive without</p>
diff --git a/testing/web-platform/tests/css/printing/animations-shadow-print-ref.html b/testing/web-platform/tests/css/printing/animations-shadow-print-ref.html
new file mode 100644
index 0000000000..60daae78bf
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/animations-shadow-print-ref.html
@@ -0,0 +1,5 @@
+<!DOCTYPE HTML>
+<html>
+<title>Static CSS animation in Shadow DOM</title>
+<p style="color: blue">blue with animation support; olive without</p>
+<p style="color: orange">orange with animation support; olive without</p>
diff --git a/testing/web-platform/tests/css/printing/animations-shadow-print.html b/testing/web-platform/tests/css/printing/animations-shadow-print.html
new file mode 100644
index 0000000000..0e80e9c45c
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/animations-shadow-print.html
@@ -0,0 +1,32 @@
+<!DOCTYPE HTML>
+<html>
+<link rel="help" href="https://drafts.csswg.org/css-animations/">
+<link rel="match" href="animations-shadow-print-ref.html">
+<title>Static CSS animation in Shadow DOM</title>
+<style>
+
+@keyframes a {
+ from, to { color: blue }
+}
+
+.anim {
+ color: olive;
+ animation: a 1s infinite;
+}
+
+</style>
+<p class="anim">blue with animation support; olive without</p>
+<div id="holder"></div>
+<script>
+let shadow_style = style = document.createElement("style");
+shadow_style.textContent = "@keyframes shadow_a { from, to { color: orange } }";
+
+let shadow = document.getElementById("holder").attachShadow({mode:"open"});
+let shadow_p = document.createElement("p");
+
+shadow_p.style.color = "olive";
+shadow_p.style.animation = "shadow_a 1s infinite";
+shadow_p.innerHTML = "orange with animation support; olive without";
+shadow.appendChild(shadow_style);
+shadow.appendChild(shadow_p);
+</script>
diff --git a/testing/web-platform/tests/css/printing/background-image-print-ref.html b/testing/web-platform/tests/css/printing/background-image-print-ref.html
new file mode 100644
index 0000000000..305aa2fce2
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/background-image-print-ref.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1769429">
+<style>
+ body {
+ font-family: century;
+ font-weight: bold;
+ color: black;
+ print-color-adjust: exact;
+ }
+ .tile {
+ width: 16px;
+ height: 16px;
+ background-repeat: no-repeat;
+ }
+ .white { background: white }
+ .magenta { background: magenta }
+ .lime { background: lime }
+ .cyan { background: cyan }
+ .blue { background: blue }
+ .red { background: red }
+ .green { background: green }
+ .gray { background: gray }
+ .yellow { background: yellow }
+</style>
+</head>
+<body>
+ <div class="tile white"></div>
+ <div class="tile magenta"></div>
+ <div class="tile lime"></div>
+ <div class="tile cyan"></div>
+ <div class="tile blue"></div>
+ <div class="tile red"></div>
+ <div class="tile green"></div>
+ <div class="tile gray"></div>
+ <div class="tile yellow"></div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/printing/background-image-print.html b/testing/web-platform/tests/css/printing/background-image-print.html
new file mode 100644
index 0000000000..8d29410740
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/background-image-print.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>test-case.html</title>
+<link rel="match" href="background-image-print-ref.html">
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1769429">
+<meta name="fuzzy" content="maxDifference=0-3;totalPixels=0-400">
+<style>
+ body {
+ font-family: century;
+ font-weight: bold;
+ color: black;
+ print-color-adjust: exact;
+ }
+ .tile {
+ width: 16px;
+ height: 16px;
+ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGAAAABgCAYAAADimHc4AAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH5gcMEDohgdlcwAAAAL1JREFUeNrt29ENgCAMRdFi2Ns6eR1CkxfjuQtAegJfsGZmKtmq7PKT3cBRAgBAAAAIAAABACAAAAQAgAAAEAAAAgBAAAAIAAABACAAAAQAgAAA0OP2+vkAwt8DnABXEAABACAAAAQAgAAAEAAAAgBAAAAIAAABACAAAAQAgAAAEAAAAgBAb7Tryj6Q7+7sBE4nwBUkAAAEAIAAABAAAAIAQAAACAAAAQAgAAAEAIAAABAAAAIAQAAACMDnuwGcQwlEUW+eJgAAAABJRU5ErkJggg==");
+ background-repeat: no-repeat;
+ }
+ .white { background-position: -2px -2px }
+ .magenta { background-position: -34px -2px }
+ .lime { background-position: -66px -2px }
+ .cyan { background-position: -2px -34px }
+ .blue { background-position: -34px -34px }
+ .red { background-position: -66px -34px }
+ .green { background-position: -2px -66px }
+ .gray { background-position: -34px -66px }
+ .yellow { background-position: -66px -66px }
+</style>
+</head>
+<body>
+ <div class="tile white"></div>
+ <div class="tile magenta"></div>
+ <div class="tile lime"></div>
+ <div class="tile cyan"></div>
+ <div class="tile blue"></div>
+ <div class="tile red"></div>
+ <div class="tile green"></div>
+ <div class="tile gray"></div>
+ <div class="tile yellow"></div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/printing/emoji-print.html b/testing/web-platform/tests/css/printing/emoji-print.html
new file mode 100644
index 0000000000..689c337acb
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/emoji-print.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <meta charset="utf-8">
+ <title>test that emoji are not blank in print output</title>
+ <meta name="assert" content="emoji characters should be visible when printed">
+ <link rel=help href="https://bugzilla.mozilla.org/show_bug.cgi?id=1723787">
+ <link rel="mismatch" href="/css/reference/blank.html">
+</head>
+<body>
+ <p>
+ <span>&#x1f600;&#x1f601;&#x1f602;&#x1f603;</span>
+ </p>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/printing/existing-transition-in-media-print.tentative.html b/testing/web-platform/tests/css/printing/existing-transition-in-media-print.tentative.html
new file mode 100644
index 0000000000..3b83bdd5b0
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/existing-transition-in-media-print.tentative.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<title>Printing with a transition that could trigger as a result of @media print</title>
+<link rel="help" href="https://drafts.csswg.org/css-transitions/">
+<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/8012">
+<link rel="match" href="transition-in-media-print-ref.html">
+<style>
+#target {
+ transition-duration: 100000s;
+ print-color-adjust: exact;
+}
+#target:not(.print) {
+ color: red;
+}
+</style>
+<div id="target">
+ Should not be red
+</div>
+<script>
+ let target = document.getElementById("target");
+ target.getBoundingClientRect();
+ target.classList.add("print");
+</script>
diff --git a/testing/web-platform/tests/css/printing/fixedpos-001-print-ref.html b/testing/web-platform/tests/css/printing/fixedpos-001-print-ref.html
new file mode 100644
index 0000000000..3d66305db0
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-001-print-ref.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="position:absolute; bottom:0;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-100vh;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-200vh;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; top:0;">
+ There should be three pages.
+</div>
diff --git a/testing/web-platform/tests/css/printing/fixedpos-001-print.html b/testing/web-platform/tests/css/printing/fixedpos-001-print.html
new file mode 100644
index 0000000000..04feb96e84
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-001-print.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1399456">
+<link rel="match" href="fixedpos-001-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="position:fixed; bottom:0;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; height:300vh;">
+ There should be three pages.
+</div>
diff --git a/testing/web-platform/tests/css/printing/fixedpos-002-print-ref.html b/testing/web-platform/tests/css/printing/fixedpos-002-print-ref.html
new file mode 100644
index 0000000000..3d66305db0
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-002-print-ref.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="position:absolute; bottom:0;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-100vh;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-200vh;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; top:0;">
+ There should be three pages.
+</div>
diff --git a/testing/web-platform/tests/css/printing/fixedpos-002-print.html b/testing/web-platform/tests/css/printing/fixedpos-002-print.html
new file mode 100644
index 0000000000..c23c6be7d2
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-002-print.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1399456">
+<link rel="match" href="fixedpos-002-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="position:absolute; height:300vh;">
+ There should be three pages.
+ <div style="position:fixed; bottom:0;">
+ This should repeat on every page.
+ </div>
+</div>
diff --git a/testing/web-platform/tests/css/printing/fixedpos-003-print-ref.html b/testing/web-platform/tests/css/printing/fixedpos-003-print-ref.html
new file mode 100644
index 0000000000..3d66305db0
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-003-print-ref.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="position:absolute; bottom:0;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-100vh;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-200vh;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; top:0;">
+ There should be three pages.
+</div>
diff --git a/testing/web-platform/tests/css/printing/fixedpos-003-print.html b/testing/web-platform/tests/css/printing/fixedpos-003-print.html
new file mode 100644
index 0000000000..1b06257175
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-003-print.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1399456">
+<link rel="match" href="fixedpos-003-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="height:300vh;">
+ There should be three pages.
+</div>
+<div style="position:fixed; bottom:0;">
+ This should repeat on every page.
+</div>
diff --git a/testing/web-platform/tests/css/printing/fixedpos-004-print-ref.html b/testing/web-platform/tests/css/printing/fixedpos-004-print-ref.html
new file mode 100644
index 0000000000..3e3473bcb8
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-004-print-ref.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="position:absolute; bottom:0; margin-bottom:2em;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-100vh; margin-bottom:2em;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-200vh; margin-bottom:2em;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; bottom:0;">
+ This should also repeat on every page.
+</div>
+<div style="position:absolute; bottom:-100vh;">
+ This should also repeat on every page.
+</div>
+<div style="position:absolute; bottom:-200vh;">
+ This should also repeat on every page.
+</div>
+<div style="position:absolute; top:0;">
+ There should be three pages.
+</div>
diff --git a/testing/web-platform/tests/css/printing/fixedpos-004-print.html b/testing/web-platform/tests/css/printing/fixedpos-004-print.html
new file mode 100644
index 0000000000..c138e9cd6a
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-004-print.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1399456">
+<link rel="match" href="fixedpos-004-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="position:fixed; bottom:2em;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute;">
+ There should be three pages.
+ <div style="position:absolute; top:0; height:300vh;">
+ <div style="position:fixed; bottom:0;">
+ This should also repeat on every page.
+ </div>
+ </div>
+</div>
diff --git a/testing/web-platform/tests/css/printing/fixedpos-005-print-ref.html b/testing/web-platform/tests/css/printing/fixedpos-005-print-ref.html
new file mode 100644
index 0000000000..e692ff8db3
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-005-print-ref.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="position:absolute; bottom:0; margin-bottom:2em;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-100vh; margin-bottom:2em;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-200vh; margin-bottom:2em;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-300vh; margin-bottom:2em;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-400vh; margin-bottom:2em;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; bottom:0;">
+ This should also repeat on every page.
+</div>
+<div style="position:absolute; bottom:-100vh;">
+ This should also repeat on every page.
+</div>
+<div style="position:absolute; bottom:-200vh;">
+ This should also repeat on every page.
+</div>
+<div style="position:absolute; bottom:-300vh;">
+ This should also repeat on every page.
+</div>
+<div style="position:absolute; bottom:-400vh;">
+ This should also repeat on every page.
+</div>
+<div style="height:100vh;">
+ There should be five pages.
+</div>
+<div style="height:300vh;">
+ This should be on the second page.
+</div>
+This should be on the fifth page.
diff --git a/testing/web-platform/tests/css/printing/fixedpos-005-print.html b/testing/web-platform/tests/css/printing/fixedpos-005-print.html
new file mode 100644
index 0000000000..0a2edc7178
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-005-print.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1399456">
+<link rel="match" href="fixedpos-005-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="height:300vh;">
+ There should be five pages.
+</div>
+<div style="position:fixed; bottom:2em;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; top:100vh;">
+ This should be on the second page.
+ <div style="position:fixed; bottom:0;">
+ This should also repeat on every page.
+ </div>
+ <div style="position:absolute; top:300vh;">
+ This should be on the fifth page.
+ </div>
+</div>
diff --git a/testing/web-platform/tests/css/printing/fixedpos-006-print-ref.html b/testing/web-platform/tests/css/printing/fixedpos-006-print-ref.html
new file mode 100644
index 0000000000..b03e1d78d0
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-006-print-ref.html
@@ -0,0 +1,57 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="position:absolute; bottom:0; margin-bottom:4em;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-100vh; margin-bottom:4em;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-200vh; margin-bottom:4em;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-300vh; margin-bottom:4em;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-400vh; margin-bottom:4em;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; bottom:0; margin-bottom:2em;">
+ This should also repeat on every page.
+</div>
+<div style="position:absolute; bottom:-100vh; margin-bottom:2em;">
+ This should also repeat on every page.
+</div>
+<div style="position:absolute; bottom:-200vh; margin-bottom:2em;">
+ This should also repeat on every page.
+</div>
+<div style="position:absolute; bottom:-300vh; margin-bottom:2em;">
+ This should also repeat on every page.
+</div>
+<div style="position:absolute; bottom:-400vh; margin-bottom:2em;">
+ This should also repeat on every page.
+</div>
+<div style="position:absolute; bottom:0;">
+ Even this should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-100vh;">
+ Even this should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-200vh;">
+ Even this should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-300vh;">
+ Even this should repeat on every page.
+</div>
+<div style="position:absolute; bottom:-400vh;">
+ Even this should repeat on every page.
+</div>
+<div style="height:100vh;">
+ There should be five pages.
+</div>
+<div style="height:100vh;">
+ This should be on the second page.
+</div>
+This should be on the third page.
diff --git a/testing/web-platform/tests/css/printing/fixedpos-006-print.html b/testing/web-platform/tests/css/printing/fixedpos-006-print.html
new file mode 100644
index 0000000000..2386c166c8
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-006-print.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1399456">
+<link rel="match" href="fixedpos-006-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+There should be five pages.
+<div style="position:fixed; bottom:4em;">
+ This should repeat on every page.
+</div>
+<div style="position:absolute; top:100vh;">
+ This should be on the second page.
+ <div style="position:fixed; bottom:2em;">
+ This should also repeat on every page.
+ </div>
+ <div style="position:absolute; top:100vh; height:300vh;">
+ This should be on the third page.
+ <div style="position:fixed; bottom:0;">
+ Even this should repeat on every page.
+ </div>
+ </div>
+</div>
diff --git a/testing/web-platform/tests/css/printing/fixedpos-007-print-ref.html b/testing/web-platform/tests/css/printing/fixedpos-007-print-ref.html
new file mode 100644
index 0000000000..f576c93771
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-007-print-ref.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="margin-top:4em;">
+ There should be three pages.
+</div>
+<div style="position:absolute; top:0;">
+ This should be repeated on every page.
+</div>
+<div style="position:absolute; top:100vh;">
+ This should be repeated on every page.
+</div>
+<div style="position:absolute; top:200vh;">
+ This should be repeated on every page.
+</div>
+<div style="position:absolute; top:0; margin-top:2em;">
+ This should also be repeated on every page.
+</div>
+<div style="position:absolute; top:100vh; margin-top:2em;">
+ This should also be repeated on every page.
+</div>
+<div style="position:absolute; top:200vh; margin-top:2em;">
+ This should also be repeated on every page.
+</div>
diff --git a/testing/web-platform/tests/css/printing/fixedpos-007-print.html b/testing/web-platform/tests/css/printing/fixedpos-007-print.html
new file mode 100644
index 0000000000..8dcb700b96
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-007-print.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1399456">
+<link rel="match" href="fixedpos-007-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="margin-top:4em;">
+ There should be three pages.
+</div>
+<div style="position:absolute; top:50vh;">
+ <div style="height:250vh;"></div>
+ <div style="position:fixed; top:0;">
+ This should be repeated on every page.
+ </div>
+</div>
+<div style="position:fixed; top:2em;">
+ This should also be repeated on every page.
+</div>
diff --git a/testing/web-platform/tests/css/printing/fixedpos-008-print-ref.html b/testing/web-platform/tests/css/printing/fixedpos-008-print-ref.html
new file mode 100644
index 0000000000..6ed2528115
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-008-print-ref.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="margin-top:4em;">
+ There should be six pages.
+</div>
+<div style="position:absolute; top:0;">
+ This should be repeated on every page.
+</div>
+<div style="position:absolute; top:100vh;">
+ This should be repeated on every page.
+</div>
+<div style="position:absolute; top:200vh;">
+ This should be repeated on every page.
+</div>
+<div style="position:absolute; top:300vh;">
+ This should be repeated on every page.
+</div>
+<div style="position:absolute; top:400vh;">
+ This should be repeated on every page.
+</div>
+<div style="position:absolute; top:500vh;">
+ This should be repeated on every page.
+</div>
+<div style="position:absolute; bottom:0;">
+ This should also be repeated on every page.
+</div>
+<div style="position:absolute; bottom:-100vh;">
+ This should also be repeated on every page.
+</div>
+<div style="position:absolute; bottom:-200vh;">
+ This should also be repeated on every page.
+</div>
+<div style="position:absolute; bottom:-300vh;">
+ This should also be repeated on every page.
+</div>
+<div style="position:absolute; bottom:-400vh;">
+ This should also be repeated on every page.
+</div>
+<div style="position:absolute; bottom:-500vh;">
+ This should also be repeated on every page.
+</div>
diff --git a/testing/web-platform/tests/css/printing/fixedpos-008-print.html b/testing/web-platform/tests/css/printing/fixedpos-008-print.html
new file mode 100644
index 0000000000..02b5d63cc7
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-008-print.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1399456">
+<link rel="match" href="fixedpos-008-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="margin-top:4em;">
+ There should be six pages.
+</div>
+<div style="position:fixed; top:0;">
+ This should be repeated on every page.
+</div>
+<div style="position:absolute; top:50vh;">
+ <div style="height:250vh;"></div>
+ <div style="position:absolute; top:0;">
+ <div style="position:absolute; top:500vh; height:10px;">
+ <div style="position:fixed; bottom:0;">
+ This should also be repeated on every page.
+ </div>
+ </div>
+ </div>
+</div>
diff --git a/testing/web-platform/tests/css/printing/fixedpos-with-abspos-with-link-print-ref.html b/testing/web-platform/tests/css/printing/fixedpos-with-abspos-with-link-print-ref.html
new file mode 100644
index 0000000000..000c05350b
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-with-abspos-with-link-print-ref.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body {
+ margin: 0;
+ }
+</style>
+<a href="/">This should be on every page (3 pages).<br>This too.</a>
+<div style="break-before:page;"></div>
+<a href="/">This should be on every page (3 pages).<br>This too.</a>
+<div style="break-before:page;"></div>
+<a href="/">This should be on every page (3 pages).<br>This too.</a>
+
diff --git a/testing/web-platform/tests/css/printing/fixedpos-with-abspos-with-link-print.html b/testing/web-platform/tests/css/printing/fixedpos-with-abspos-with-link-print.html
new file mode 100644
index 0000000000..057ddc9146
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-with-abspos-with-link-print.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402156">
+<link rel="match" href="fixedpos-with-abspos-with-link-print-ref.html">
+<style>
+ body {
+ margin: 0;
+ height: 250vh;
+ }
+</style>
+<div style="position:fixed;">
+ <div style="position:absolute; width:max-content;">
+ <a href="/">This should be on every page (3 pages).<br>This too.</a>
+ </div>
+</div>
diff --git a/testing/web-platform/tests/css/printing/fixedpos-with-iframe-print-ref.html b/testing/web-platform/tests/css/printing/fixedpos-with-iframe-print-ref.html
new file mode 100644
index 0000000000..5c17140450
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-with-iframe-print-ref.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<p>The word "PASS" should be seen below.</p>
+<div style="position:absolute; background:blue;">
+ <iframe src="data:text/html,PASS" style="width:8em; height:3em; background:yellow;"></iframe>
+</div>
+<p style="break-before:page;">
+ Apart from this text, there should be nothing on this page.
+</p>
+
diff --git a/testing/web-platform/tests/css/printing/fixedpos-with-iframe-print.html b/testing/web-platform/tests/css/printing/fixedpos-with-iframe-print.html
new file mode 100644
index 0000000000..5102d045c4
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-with-iframe-print.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1414873">
+<link rel="match" href="fixedpos-with-iframe-print-ref.html">
+<p>The word "PASS" should be seen below.</p>
+<div style="position:fixed; background:blue;">
+ <iframe src="data:text/html,PASS" style="width:8em; height:3em; background:yellow;"></iframe>
+</div>
+<p style="break-before:page; position:relative; z-index:1; height:8em; background:white;">
+ Apart from this text, there should be nothing on this page.
+</p>
+
diff --git a/testing/web-platform/tests/css/printing/fixedpos-with-link-with-inline-child-print-ref.html b/testing/web-platform/tests/css/printing/fixedpos-with-link-with-inline-child-print-ref.html
new file mode 100644
index 0000000000..f12d31acd9
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-with-link-with-inline-child-print-ref.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<style>
+ body { margin: 0; }
+</style>
+<div>
+ <a href="/">Link <span>should be seen</span> on both pages.</a>
+</div>
+<div style="break-before:page;">
+ <a href="/">Link <span>should be seen</span> on both pages.</a>
+</div>
diff --git a/testing/web-platform/tests/css/printing/fixedpos-with-link-with-inline-child-print.html b/testing/web-platform/tests/css/printing/fixedpos-with-link-with-inline-child-print.html
new file mode 100644
index 0000000000..694e5376cb
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fixedpos-with-link-with-inline-child-print.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1373172">
+<link rel="match" href="fixedpos-with-link-with-inline-child-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="position:fixed;">
+ <a href="/">Link <span>should be seen</span> on both pages.</a>
+</div>
+<div style="break-before:page; height:10px;"></div>
+<div style="break-before:page; height:10px;"></div>
diff --git a/testing/web-platform/tests/css/printing/fragmented-inline-block-001-print.html b/testing/web-platform/tests/css/printing/fragmented-inline-block-001-print.html
new file mode 100644
index 0000000000..848635431e
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fragmented-inline-block-001-print.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <meta charset="utf-8">
+ <title>test that inline-blocks are fragmented in print output</title>
+ <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1740304">
+ <meta name="reftest-pages" content="10">
+ <link rel="mismatch" href="/css/reference/blank.html">
+ <style>
+ .inline-block {
+ display: inline-block;
+ }
+ li { height: 1in; }
+ </style>
+</head>
+<body>
+ <!-- This test is expecting there to be content on page 10, as a
+ regression-test for a bug where each page was progressively
+ more-clipped, which caused later pages (e.g. page 10) to be fully-blank.
+ In this testcase, we have 40 1-inch-tall numbered list-items, which
+ collectively are 40 inches tall. This is tall enough to ensure that
+ we'll have at least 10 pages, given that our pages are each 3 inches
+ tall. -->
+ <div class="inline-block">
+ <ol>
+ <li><li><li><li><li><li><li><li><li><li>
+ <li><li><li><li><li><li><li><li><li><li>
+ <li><li><li><li><li><li><li><li><li><li>
+ <li><li><li><li><li><li><li><li><li><li>
+ </ol>
+ </div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/printing/fragmented-inline-block-002-print-ref.html b/testing/web-platform/tests/css/printing/fragmented-inline-block-002-print-ref.html
new file mode 100644
index 0000000000..dcfa3a1385
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fragmented-inline-block-002-print-ref.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <meta charset="utf-8">
+ <title>Reference Case</title>
+ <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1740304">
+ <style>
+ .tall {
+ height: 10in;
+ width: 1in;
+ border: 0.5in solid black;
+ }
+ </style>
+</head>
+<body>
+ <div class="tall"></div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/printing/fragmented-inline-block-002-print.html b/testing/web-platform/tests/css/printing/fragmented-inline-block-002-print.html
new file mode 100644
index 0000000000..c5390aad6c
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/fragmented-inline-block-002-print.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <meta charset="utf-8">
+ <title>test that inline-blocks are fragmented in print output</title>
+ <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1740304">
+ <link rel="match" href="fragmented-inline-block-002-print-ref.html">
+ <style>
+ .tall {
+ /* The reference case has a block; we have an inline-block.
+ Given that there's no other content on our line, we can expect our
+ inline-block to end up rendering and fragmenting like the
+ reference case's block. */
+ display: inline-block;
+
+ height: 10in;
+ width: 1in;
+ border: 0.5in solid black;
+ }
+ </style>
+</head>
+<body>
+ <div class="tall"></div>
+</body>
+</html>
diff --git a/testing/web-platform/tests/css/printing/input-file-print-ref.html b/testing/web-platform/tests/css/printing/input-file-print-ref.html
new file mode 100644
index 0000000000..fb5255eddb
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/input-file-print-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<head>
+ <meta charset="utf-8">
+ <title>Reference case</title>
+ <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=133984">
+ <style>
+ input[type="file"] { height: auto; }
+ .with-outline {
+ outline: 2px solid teal;
+ }
+ .wrapper {
+ border: 2px solid fuchsia;
+ }
+ </style>
+</head>
+<body>
+ <input type="file">
+ <br><br>
+ <input type="file" class="with-outline">
+ <br><br>
+ <div class="wrapper"><input type="file"></div>
+</body>
diff --git a/testing/web-platform/tests/css/printing/input-file-print.html b/testing/web-platform/tests/css/printing/input-file-print.html
new file mode 100644
index 0000000000..a070024463
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/input-file-print.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<head>
+ <meta charset="utf-8">
+ <title>Test that file-input widgets have 'auto' height (not some other arbitrary value) when printed</title>
+ <meta name="assert" content="file-input widgets should have 'auto' height (not some other arbitrary value) when printed">
+ <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=133984">
+ <link rel="match" href="input-file-print-ref.html">
+ <style>
+ .with-outline {
+ outline: 2px solid teal;
+ }
+ .wrapper {
+ border: 2px solid fuchsia;
+ }
+ </style>
+</head>
+<body>
+ <input type="file">
+ <br><br>
+ <input type="file" class="with-outline">
+ <br><br>
+ <div class="wrapper"><input type="file"></div>
+</body>
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-001-print-ref.html b/testing/web-platform/tests/css/printing/monolithic-overflow-001-print-ref.html
new file mode 100644
index 0000000000..9edc5d9ed0
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-001-print-ref.html
@@ -0,0 +1,7 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="height:150vh;"></div>
+This text should be at the middle of the second page.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-001-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-001-print.html
new file mode 100644
index 0000000000..f4121c3422
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-001-print.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="monolithic-overflow-001-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="height:150vh; contain:size;"></div>
+This text should be at the middle of the second page.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-002-print-ref.html b/testing/web-platform/tests/css/printing/monolithic-overflow-002-print-ref.html
new file mode 100644
index 0000000000..5478362b06
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-002-print-ref.html
@@ -0,0 +1,7 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="height:250vh;"></div>
+This text should be at the middle of the third page.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-002-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-002-print.html
new file mode 100644
index 0000000000..8f76af16a9
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-002-print.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="monolithic-overflow-002-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="height:250vh; contain:size;"></div>
+This text should be at the middle of the third page.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-003-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-003-print.html
new file mode 100644
index 0000000000..76905b180a
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-003-print.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="reference/monolithic-overflow-4-pages-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="background:yellow;">
+ <div style="contain:size; width:50px; height:350vh; background:hotpink;"></div>
+ Yellow background, page 4.
+</div>
+White background, page 4. There should be a hotpink rectangle inside a yellow
+block, starting at the first page, and ending right before the first piece of
+text.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-004-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-004-print.html
new file mode 100644
index 0000000000..ea5a659bd8
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-004-print.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="reference/monolithic-overflow-4-pages-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="height:390vh;">
+ <div style="background:yellow;">
+ <div style="contain:size; width:50px; height:350vh; background:hotpink;"></div>
+ Yellow background, page 4.
+ </div>
+ White background, page 4. There should be a hotpink rectangle inside a yellow
+ block, starting at the first page, and ending right before the first piece of
+ text.
+</div>
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-005-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-005-print.html
new file mode 100644
index 0000000000..bb0fc212fc
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-005-print.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="reference/monolithic-overflow-4-pages-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="display:flex; flex-flow:column; background:yellow;">
+ <div style="contain:size; height:350vh; width:50px; background:hotpink;"></div>
+ Yellow background, page 4.
+</div>
+White background, page 4. There should be a hotpink rectangle inside a yellow
+block, starting at the first page, and ending right before the first piece of
+text.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-006-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-006-print.html
new file mode 100644
index 0000000000..1cbcdbbe1e
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-006-print.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="reference/monolithic-overflow-4-pages-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="display:flex; flex-flow:column; background:yellow;">
+ <div>
+ <div style="contain:size; height:350vh; width:50px; background:hotpink;"></div>
+ Yellow background, page 4.
+ </div>
+</div>
+White background, page 4. There should be a hotpink rectangle inside a yellow
+block, starting at the first page, and ending right before the first piece of
+text.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-007-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-007-print.html
new file mode 100644
index 0000000000..14a6f051fe
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-007-print.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="reference/monolithic-overflow-4-pages-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="display:grid; background:yellow;">
+ <div style="contain:size; height:350vh; width:50px; background:hotpink;"></div>
+ Yellow background, page 4.
+</div>
+White background, page 4. There should be a hotpink rectangle inside a yellow
+block, starting at the first page, and ending right before the first piece of
+text.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-008-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-008-print.html
new file mode 100644
index 0000000000..ff302dc30c
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-008-print.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="reference/monolithic-overflow-4-pages-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="display:grid; background:yellow;">
+ <div>
+ <div style="contain:size; height:350vh; width:50px; background:hotpink;"></div>
+ Yellow background, page 4.
+ </div>
+</div>
+White background, page 4. There should be a hotpink rectangle inside a yellow
+block, starting at the first page, and ending right before the first piece of
+text.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-009-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-009-print.html
new file mode 100644
index 0000000000..bdff66e791
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-009-print.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="reference/monolithic-overflow-4-pages-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="display:table; width:100%; background:yellow;">
+ <div style="contain:size; height:350vh; width:50px; background:hotpink;"></div>
+ Yellow background, page 4.
+</div>
+White background, page 4. There should be a hotpink rectangle inside a yellow
+block, starting at the first page, and ending right before the first piece of
+text.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-010-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-010-print.html
new file mode 100644
index 0000000000..a75c932d30
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-010-print.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="reference/monolithic-overflow-4-pages-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="display:table; width:100%; background:yellow;">
+ <div style="display:table-row;">
+ <div style="contain:size; height:350vh; width:50px; background:hotpink;"></div>
+ </div>
+ Yellow background, page 4.
+</div>
+White background, page 4. There should be a hotpink rectangle inside a yellow
+block, starting at the first page, and ending right before the first piece of
+text.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-011-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-011-print.html
new file mode 100644
index 0000000000..973a3aff4d
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-011-print.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="reference/monolithic-overflow-4-pages-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="display:table; width:100%; background:yellow;">
+ <div style="display:table-row-group;">
+ <div style="contain:size; height:350vh; width:50px; background:hotpink;"></div>
+ </div>
+ Yellow background, page 4.
+</div>
+White background, page 4. There should be a hotpink rectangle inside a yellow
+block, starting at the first page, and ending right before the first piece of
+text.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-012-print-ref.html b/testing/web-platform/tests/css/printing/monolithic-overflow-012-print-ref.html
new file mode 100644
index 0000000000..e47ca880f9
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-012-print-ref.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="background:yellow;">
+ <div style="width:50px; height:350vh; background:hotpink;"></div>
+ This text should be at the middle of the fourth page.
+</div>
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-012-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-012-print.html
new file mode 100644
index 0000000000..53ed74bc72
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-012-print.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="monolithic-overflow-012-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="float:left; width:100%; background:yellow;">
+ <div style="contain:size; width:50px; height:350vh; background:hotpink;"></div>
+ This text should be at the middle of the fourth page.
+</div>
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-013-print-ref.html b/testing/web-platform/tests/css/printing/monolithic-overflow-013-print-ref.html
new file mode 100644
index 0000000000..e47ca880f9
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-013-print-ref.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="background:yellow;">
+ <div style="width:50px; height:350vh; background:hotpink;"></div>
+ This text should be at the middle of the fourth page.
+</div>
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-013-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-013-print.html
new file mode 100644
index 0000000000..b9a174879d
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-013-print.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="monolithic-overflow-013-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="position:absolute; width:100%; background:yellow;">
+ <div style="contain:size; width:50px; height:350vh; background:hotpink;"></div>
+ This text should be at the middle of the fourth page.
+</div>
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-014-print-ref.html b/testing/web-platform/tests/css/printing/monolithic-overflow-014-print-ref.html
new file mode 100644
index 0000000000..a74e0d19a5
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-014-print-ref.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="display:flow-root; background:yellow;">
+ <div style="float:left; width:50px; height:350vh; background:hotpink;"></div>
+ &nbsp;On the first page
+</div>
+This text should be at the middle of the fourth page.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-014-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-014-print.html
new file mode 100644
index 0000000000..d12ddf4c68
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-014-print.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="monolithic-overflow-014-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="background:yellow;">
+ <div style="display:inline-block; vertical-align:top; width:50px; height:350vh; background:hotpink;"></div>
+ On the first page
+</div>
+This text should be at the middle of the fourth page.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-015-print-ref.html b/testing/web-platform/tests/css/printing/monolithic-overflow-015-print-ref.html
new file mode 100644
index 0000000000..db44a3ee21
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-015-print-ref.html
@@ -0,0 +1,7 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="width:50px; height:350vh; background:hotpink;"></div>
+This text should be at the middle of the fourth page.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-015-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-015-print.html
new file mode 100644
index 0000000000..d52605605c
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-015-print.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="monolithic-overflow-015-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="display:inline-block; vertical-align:top; width:50px; height:350vh; background:hotpink;"></div><br>
+This text should be at the middle of the fourth page.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-016-print-ref.html b/testing/web-platform/tests/css/printing/monolithic-overflow-016-print-ref.html
new file mode 100644
index 0000000000..a675fb966c
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-016-print-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body {
+ margin: 0;
+ line-height: 20px;
+ }
+</style>
+<div style="position:absolute; top:100vh;">header</div>
+<div style="position:absolute; top:200vh;">header</div>
+<div style="position:absolute; top:300vh;">header</div>
+<div style="position:absolute; bottom:0;">footer</div>
+<div style="position:absolute; bottom:-100vh;">footer</div>
+<div style="position:absolute; bottom:-200vh;">footer</div>
+<div style="width:80%; padding-bottom:5px; background:hotpink;">
+ header
+ <div style="height:320vh; padding:3px; background:cyan;"></div>
+ On the fourth page, right after a cyan box.<br>
+ footer
+</div>
+Right after the hotpink box. Still fourth page.<br>
+Each page should have a header and footer.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-016-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-016-print.html
new file mode 100644
index 0000000000..029523e924
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-016-print.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="monolithic-overflow-016-print-ref.html">
+<style>
+ body {
+ margin: 0;
+ line-height: 20px;
+ }
+</style>
+<div style="display:table; width:80%; padding-bottom:5px; background:hotpink;">
+ <div style="display:table-header-group; break-inside:avoid;">header</div>
+ <div style="display:table-footer-group; break-inside:avoid;">footer</div>
+ <div style="contain:size; height:320vh; padding:3px; background:cyan;"></div>
+ On the fourth page, right after a cyan box.
+</div>
+Right after the hotpink box. Still fourth page.<br>
+Each page should have a header and footer.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-017-print-ref.html b/testing/web-platform/tests/css/printing/monolithic-overflow-017-print-ref.html
new file mode 100644
index 0000000000..45f839787e
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-017-print-ref.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="line-height:20px;">
+ <div style="position:absolute; width:100%; bottom:0; background:hotpink;">footer</div>
+ <div style="position:absolute; width:100%; bottom:-100vh; background:hotpink;">footer</div>
+ <div style="position:absolute; width:100%; bottom:-200vh; background:hotpink;">footer</div>
+ <div style="height:calc(300vh - 25px); background:black;"></div>
+ <div style="break-before:page;">PASS</div>
+ <div style="background:hotpink;">
+ footer
+ </div>
+</div>
+There should be a footer on every page, and the word PASS should be seen here,
+on the fourth page, just above the final footer.<br>
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-017-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-017-print.html
new file mode 100644
index 0000000000..c8ce9060ff
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-017-print.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="monolithic-overflow-017-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="display:table; width:100%; line-height:20px;">
+ <div style="display:table-footer-group; break-inside:avoid; background:hotpink;">footer</div>
+ <!-- Monolithic content that ends 5px above the table footer on the third page. -->
+ <div style="contain:size; height:calc(300vh - 25px); background:black;"></div>
+ PASS
+</div>
+There should be a footer on every page, and the word PASS should be seen here,
+on the fourth page, just above the final footer.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-018-print-ref.html b/testing/web-platform/tests/css/printing/monolithic-overflow-018-print-ref.html
new file mode 100644
index 0000000000..cf31737d6c
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-018-print-ref.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="width:20px; height:280vh; background:blue;"></div>
+<div style="break-before:page; width:50vh; height:50vh; background:green;"></div>
+There should be four pages. There should be something blue on the first three,
+and a green square on the fourth. No red anywhere.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-018-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-018-print.html
new file mode 100644
index 0000000000..93da11dc62
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-018-print.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="monolithic-overflow-018-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="contain:size; width:20px; height:280vh; background:blue;"></div>
+<div style="width:50vh; background:red;">
+ <div style="contain:size; height:50vh; background:green;"></div>
+</div>
+There should be four pages. There should be something blue on the first three,
+and a green square on the fourth. No red anywhere.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-019-print-ref.html b/testing/web-platform/tests/css/printing/monolithic-overflow-019-print-ref.html
new file mode 100644
index 0000000000..f37740ae7e
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-019-print-ref.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="height:50vh; border:solid; background:yellow;">
+ <div style="width:50%; height:350vh; background:cyan;"></div>
+ This text should be at the middle of the fourth page.
+</div>
+This text should be at the middle of the first page, overlapping with stuff.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-019-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-019-print.html
new file mode 100644
index 0000000000..3740b5d5b0
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-019-print.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="monolithic-overflow-019-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="height:50vh; border:solid; background:yellow;">
+ <div style="contain:size; width:50%; height:350vh; background:cyan;"></div>
+ This text should be at the middle of the fourth page.
+</div>
+This text should be at the middle of the first page, overlapping with stuff.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-020-print-ref.html b/testing/web-platform/tests/css/printing/monolithic-overflow-020-print-ref.html
new file mode 100644
index 0000000000..528c4980de
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-020-print-ref.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="float:right; width:20%; border:3px solid;">
+ <div style="width:50%; height:calc(100vh - 3px); background:brown;"></div>
+ <div style="width:50%; height:100vh; background:blue;"></div>
+ <div style="width:50%; height:50vh; background:cyan;"></div>
+</div>
+<div style="background:yellow;">
+ <div style="width:20%; height:225vh; background:hotpink;"></div>
+ <div style="height:75vh;"></div>
+</div>
+This text should start on the fourth page. The first three pages should have a
+yellow background. On the left hand side there should be a hotpink rectangle,
+starting at the beginning on the first page, and ending 25% from the top of the
+third page. On the right hand side there should a figure with a black border. It
+should end around the middle of the third page. Inside there should be a brown
+rectangle on the first page, a blue rectangle on the second page, and a cyan
+rectangle on the third page.
diff --git a/testing/web-platform/tests/css/printing/monolithic-overflow-020-print.html b/testing/web-platform/tests/css/printing/monolithic-overflow-020-print.html
new file mode 100644
index 0000000000..403d932d64
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/monolithic-overflow-020-print.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1402540">
+<link rel="match" href="monolithic-overflow-020-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<!-- Check that monolithic overflow doesn't disrupt layout of a sibling
+ float. -->
+<div style="float:right; width:20%; border:3px solid;">
+ <div style="width:50%; height:calc(100vh - 3px); background:brown;"></div>
+ <div style="width:50%; height:100vh; background:blue;"></div>
+ <div style="width:50%; height:50vh; background:cyan;"></div>
+</div>
+<div style="background:yellow;">
+ <div style="contain:size; width:20%; height:225vh; background:hotpink;"></div>
+ <div style="height:75vh;"></div>
+</div>
+This text should start on the fourth page. The first three pages should have a
+yellow background. On the left hand side there should be a hotpink rectangle,
+starting at the beginning on the first page, and ending 25% from the top of the
+third page. On the right hand side there should a figure with a black border. It
+should end around the middle of the third page. Inside there should be a brown
+rectangle on the first page, a blue rectangle on the second page, and a cyan
+rectangle on the third page.
diff --git a/testing/web-platform/tests/css/printing/no-resize-event-print.html b/testing/web-platform/tests/css/printing/no-resize-event-print.html
new file mode 100644
index 0000000000..85a44b556c
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/no-resize-event-print.html
@@ -0,0 +1,10 @@
+<!doctype html>
+<title>No resize event on the original page when printing</title>
+<link rel="help" href="https://drafts.csswg.org/mediaqueries-4/#valdef-media-print">
+<link rel="match" href="no-resize-event-ref.html">
+<div id="target">PASS</div>
+<script>
+window.addEventListener("resize", function() {
+ document.getElementById("target").innerHTML = `FAIL: ${window.innerWidth}x${window.innerHeight}`;
+})
+</script>
diff --git a/testing/web-platform/tests/css/printing/no-resize-event-ref.html b/testing/web-platform/tests/css/printing/no-resize-event-ref.html
new file mode 100644
index 0000000000..1fc00e7e39
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/no-resize-event-ref.html
@@ -0,0 +1,2 @@
+<!doctype html>
+<div>PASS</div>
diff --git a/testing/web-platform/tests/css/printing/page-name-001-print-ref.html b/testing/web-platform/tests/css/printing/page-name-001-print-ref.html
new file mode 100644
index 0000000000..69c5c37b5a
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/page-name-001-print-ref.html
@@ -0,0 +1,5 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<div style="float:left;">First page</div>
+<div style="clear:both;">Also first page</div>
+<div style="break-before:page;">Second page</div>
diff --git a/testing/web-platform/tests/css/printing/page-name-001-print.html b/testing/web-platform/tests/css/printing/page-name-001-print.html
new file mode 100644
index 0000000000..56281bb4ed
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/page-name-001-print.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-page-3/#using-named-pages">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1414718">
+<link rel="match" href="page-name-001-print-ref.html">
+<div style="page:foo;">
+ <div style="float:left;">First page</div>
+ <div style="clear:both;">Also first page</div>
+ <div style="page:bar;">Second page</div>
+</div>
diff --git a/testing/web-platform/tests/css/printing/page-name-002-print-ref.html b/testing/web-platform/tests/css/printing/page-name-002-print-ref.html
new file mode 100644
index 0000000000..17ecc93e57
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/page-name-002-print-ref.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+1st page
+<div style="break-before:page;">
+ 2nd page
+</div>
+<div style="break-before:page;">
+ 3rd page<br>
+ Also 3rd page
+</div>
+<div style="break-before:page;">
+ 4th page
+</div>
+<div style="break-before:page;">
+ 5th page
+</div>
+<div style="break-before:page;">
+ 6th page
+</div>
+<div style="break-before:page;">
+ 7th page<br>
+ Also 7th page<br>
+</div>
+<div style="break-before:page;">
+ 8th page
+</div>
diff --git a/testing/web-platform/tests/css/printing/page-name-002-print.html b/testing/web-platform/tests/css/printing/page-name-002-print.html
new file mode 100644
index 0000000000..060b93b0bf
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/page-name-002-print.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-page-3/#using-named-pages">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1421421">
+<link rel="match" href="page-name-002-print-ref.html">
+<div style="page:a;">1st page</div>
+<div style="page:a;">
+ <div style="page:b;">2nd page</div>
+ 3rd page
+</div>
+<div style="page:a;">Also 3rd page</div>
+4th page
+<div style="page:a;">5th page</div>
+<div style="page:a;">
+ <div>
+ <div style="page:b;">6th page</div>
+ 7th page
+ </div>
+ Also 7th page
+</div>
+8th page
diff --git a/testing/web-platform/tests/css/printing/page-name-003-print-ref.html b/testing/web-platform/tests/css/printing/page-name-003-print-ref.html
new file mode 100644
index 0000000000..52ea6bfffc
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/page-name-003-print-ref.html
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+1st page
+<div style="break-before:page;">
+ 2nd page
+</div>
diff --git a/testing/web-platform/tests/css/printing/page-name-003-print.html b/testing/web-platform/tests/css/printing/page-name-003-print.html
new file mode 100644
index 0000000000..9ef4db8c75
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/page-name-003-print.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-page-3/#using-named-pages">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1428011">
+<link rel="match" href="page-name-003-print-ref.html">
+<div style="position:absolute;">
+ <div style="page:a;">1st page</div>
+ <div style="page:b;">2nd page</div>
+</div>
diff --git a/testing/web-platform/tests/css/printing/page-overflow-crash-print.html b/testing/web-platform/tests/css/printing/page-overflow-crash-print.html
new file mode 100644
index 0000000000..e295c569d2
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/page-overflow-crash-print.html
@@ -0,0 +1,13 @@
+<!-- quirks -->
+<link rel=help href="https://bugzilla.mozilla.org/show_bug.cgi?id=1697291">
+<!-- Really a crashtest but since we can't really have print crashtests, we assert that we print something -->
+<link rel="mismatch" href="/css/reference/blank.html">
+<style>
+* {
+ offset-path: path('M 1 7 H 1 V -1 H -1 L 1 0');
+}
+#a {
+ offset-anchor: 0px 0px;
+}
+</style>
+<details id="a">
diff --git a/testing/web-platform/tests/css/printing/paused-animations-print-ref.html b/testing/web-platform/tests/css/printing/paused-animations-print-ref.html
new file mode 100644
index 0000000000..c22ecd1745
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/paused-animations-print-ref.html
@@ -0,0 +1,4 @@
+<!DOCTYPE HTML>
+<html>
+<title>Paused CSS animation</title>
+<p style="color: blue">blue with animation support; olive without</p>
diff --git a/testing/web-platform/tests/css/printing/paused-animations-print.html b/testing/web-platform/tests/css/printing/paused-animations-print.html
new file mode 100644
index 0000000000..03ef1bab3c
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/paused-animations-print.html
@@ -0,0 +1,22 @@
+<!DOCTYPE HTML>
+<html>
+<link rel="help" href="https://drafts.csswg.org/css-animations/">
+<link rel="match" href="paused-animations-print-ref.html">
+<title>Paused CSS animation</title>
+<style>
+
+@keyframes a {
+ from, to { color: blue; }
+}
+
+p {
+ color: olive;
+ animation: a 1s infinite;
+}
+
+</style>
+<p id="anim">blue with animation support; olive without</p>
+<script>
+let element = document.getElementById("anim");
+element.style.animationPlayState = "paused";
+</script>
diff --git a/testing/web-platform/tests/css/printing/pseudo-animations-print-ref.html b/testing/web-platform/tests/css/printing/pseudo-animations-print-ref.html
new file mode 100644
index 0000000000..07107d1db7
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/pseudo-animations-print-ref.html
@@ -0,0 +1,18 @@
+<!DOCTYPE HTML>
+<html>
+<title>Static CSS animation</title>
+<style>
+
+p {
+ color: blue;
+}
+
+p::after {
+ content: "(::after)";
+}
+
+p::before {
+ content: "(::before)";
+}
+</style>
+<p>blue with animation support; olive without</p>
diff --git a/testing/web-platform/tests/css/printing/pseudo-animations-print.html b/testing/web-platform/tests/css/printing/pseudo-animations-print.html
new file mode 100644
index 0000000000..40585ba2c4
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/pseudo-animations-print.html
@@ -0,0 +1,29 @@
+<!DOCTYPE HTML>
+<html>
+<link rel="help" href="https://drafts.csswg.org/css-animations/">
+<link rel="match" href="pseudo-animations-print-ref.html">
+<title>Static CSS animation</title>
+<style>
+
+@keyframes a {
+ from, to { color: blue }
+}
+
+p {
+ color: olive;
+ animation: a 1s infinite;
+}
+p::after {
+ color: purple;
+ content: "(::after)";
+ animation: a 1s infinite;
+}
+
+p::before {
+ color: yellow;
+ content: "(::before)";
+ animation: a 1s infinite;
+}
+
+</style>
+<p>blue with animation support; olive without</p>
diff --git a/testing/web-platform/tests/css/printing/reference/monolithic-overflow-4-pages-print-ref.html b/testing/web-platform/tests/css/printing/reference/monolithic-overflow-4-pages-print-ref.html
new file mode 100644
index 0000000000..c115782d6a
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/reference/monolithic-overflow-4-pages-print-ref.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="background:yellow;">
+ <div style="width:50px; height:350vh; background:hotpink;"></div>
+ Yellow background, page 4.
+</div>
+White background, page 4. There should be a hotpink rectangle inside a yellow
+block, starting at the first page, and ending right before the first piece of
+text.
diff --git a/testing/web-platform/tests/css/printing/transform-001-print-ref.html b/testing/web-platform/tests/css/printing/transform-001-print-ref.html
new file mode 100644
index 0000000000..45c3abf181
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/transform-001-print-ref.html
@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="height:500vh;">
+ There should be 5 pages.
+</div>
diff --git a/testing/web-platform/tests/css/printing/transform-001-print.html b/testing/web-platform/tests/css/printing/transform-001-print.html
new file mode 100644
index 0000000000..f19b889d07
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/transform-001-print.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1442522">
+<link rel="match" href="transform-001-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="height:0;">
+ There should be 5 pages.
+</div>
+<div style="transform:rotate(180deg); height:500vh;"></div>
diff --git a/testing/web-platform/tests/css/printing/transform-002-print-ref.html b/testing/web-platform/tests/css/printing/transform-002-print-ref.html
new file mode 100644
index 0000000000..7204e1d657
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/transform-002-print-ref.html
@@ -0,0 +1,4 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<p>There should be a green square on the second page, and no red.</p>
+<div style="break-before:page; width:100px; height:100px; background:green;"></div>
diff --git a/testing/web-platform/tests/css/printing/transform-002-print.html b/testing/web-platform/tests/css/printing/transform-002-print.html
new file mode 100644
index 0000000000..3ab37bf5bd
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/transform-002-print.html
@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1371426">
+<link rel="match" href="transform-002-print-ref.html">
+<p>There should be a green square on the second page, and no red.</p>
+<div style="break-before:page; width:100px; height:100px; background:red;">
+ <div style="position:absolute; width:0; height:0; transform:translateX(49px);">
+ <div style="position:absolute; width:51px; height:100px; background:green;"></div>
+ </div>
+ <div style="position:absolute; width:50px; height:100px; background:green;"></div>
+</div>
diff --git a/testing/web-platform/tests/css/printing/transform-003-print-ref.html b/testing/web-platform/tests/css/printing/transform-003-print-ref.html
new file mode 100644
index 0000000000..766c415a1b
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/transform-003-print-ref.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<style>
+ body { margin: 0; }
+</style>
+<div style="height:100vh; background:yellow;">
+ There should be five pages. Each page should have a unique background - but no
+ red should be seen.
+</div>
+<div style="height:100vh; background:pink;"></div>
+<div style="height:100vh; background:cyan;"></div>
+<div style="height:100vh; background:papayawhip;"></div>
+<div style="height:100vh; background:olive;"></div>
diff --git a/testing/web-platform/tests/css/printing/transform-003-print.html b/testing/web-platform/tests/css/printing/transform-003-print.html
new file mode 100644
index 0000000000..c8effbb8f3
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/transform-003-print.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1371426">
+<link rel="match" href="transform-003-print-ref.html">
+<style>
+ body { margin: 0; }
+</style>
+<div style="position:relative; z-index:1; height:100vh;">
+ There should be five pages. Each page should have a unique background - but no
+ red should be seen.
+</div>
+<!-- This tests that the transform on the container is applied to all the
+ absolutely positioned descendants, and also that the transform origin is
+ correct. -->
+<div style="transform:rotate(180deg); height:250vh; background:red;">
+ <div style="position:absolute; width:100%; transform:translateY(-100vh); top:-100vh; height:100vh; background:yellow;"></div>
+ <div style="position:absolute; width:100%; height:100vh; background:pink;"></div>
+ <div style="position:absolute; width:100%; top:100vh; height:100vh; background:cyan;"></div>
+ <div style="position:absolute; width:100%; transform:translateY(-50vh); top:200vh; height:100vh; background:papayawhip;"></div>
+ <div style="position:absolute; width:100%; transform:translateY(-100vh); top:300vh; height:100vh; background:olive;"></div>
+</div>
diff --git a/testing/web-platform/tests/css/printing/transition-in-media-print-ref.html b/testing/web-platform/tests/css/printing/transition-in-media-print-ref.html
new file mode 100644
index 0000000000..2f25c06131
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/transition-in-media-print-ref.html
@@ -0,0 +1,5 @@
+<!doctype html>
+<title>CSS test reference</title>
+<div>
+ Should not be red
+</div>
diff --git a/testing/web-platform/tests/css/printing/transition-in-media-print.tentative.html b/testing/web-platform/tests/css/printing/transition-in-media-print.tentative.html
new file mode 100644
index 0000000000..54bac1f481
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/transition-in-media-print.tentative.html
@@ -0,0 +1,19 @@
+<!doctype html>
+<title>Printing with a transition that could trigger as a result of @media print</title>
+<link rel="help" href="https://drafts.csswg.org/css-transitions/">
+<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/8012">
+<link rel="match" href="transition-in-media-print-ref.html">
+<style>
+#target {
+ transition-duration: 100000s;
+ print-color-adjust: exact;
+}
+@media not print {
+ #target {
+ color: red;
+ }
+}
+</style>
+<div id="target">
+ Should not be red
+</div>
diff --git a/testing/web-platform/tests/css/printing/zero-size-001-print.tentative.html b/testing/web-platform/tests/css/printing/zero-size-001-print.tentative.html
new file mode 100644
index 0000000000..98f77a7b86
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/zero-size-001-print.tentative.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<title>Printing with page width and height of zero</title>
+<link rel="help" href="https://www.w3.org/TR/css-page-3/">
+<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/8335">
+<link rel="match" href="zero-size-print-ref.html">
+<meta name="assert" content="The used page size is the initial value instead of the authored width and height of zero." />
+<style>
+html { box-sizing: border-box; height: 100%; border: 2px solid black; }
+@page {
+ size: 0;
+}
+</style>
+<h1>Chapter 1. Loomings</h1>
diff --git a/testing/web-platform/tests/css/printing/zero-size-002-print.tentative.html b/testing/web-platform/tests/css/printing/zero-size-002-print.tentative.html
new file mode 100644
index 0000000000..e243c34e7c
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/zero-size-002-print.tentative.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<title>Printing with page width of zero</title>
+<link rel="help" href="https://www.w3.org/TR/css-page-3/">
+<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/8335">
+<link rel="match" href="zero-size-print-ref.html">
+<meta name="assert" content="The used page size is the initial value instead of the authored width of zero and height of 4in." />
+<style>
+html { box-sizing: border-box; height: 100%; border: 2px solid black; }
+@page {
+ size: 0 4in;
+}
+</style>
+<h1>Chapter 1. Loomings</h1>
diff --git a/testing/web-platform/tests/css/printing/zero-size-003-print.tentative.html b/testing/web-platform/tests/css/printing/zero-size-003-print.tentative.html
new file mode 100644
index 0000000000..c514f72360
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/zero-size-003-print.tentative.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<title>Printing with page height of zero</title>
+<link rel="help" href="https://www.w3.org/TR/css-page-3/">
+<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/8335">
+<link rel="match" href="zero-size-print-ref.html">
+<meta name="assert" content="The used page size is the initial value instead of the authored width of 4in and height of zero." />
+<style>
+html { box-sizing: border-box; height: 100%; border: 2px solid black; }
+@page {
+ size: 4in 0;
+}
+</style>
+<h1>Chapter 1. Loomings</h1>
diff --git a/testing/web-platform/tests/css/printing/zero-size-print-ref.html b/testing/web-platform/tests/css/printing/zero-size-print-ref.html
new file mode 100644
index 0000000000..569af797ed
--- /dev/null
+++ b/testing/web-platform/tests/css/printing/zero-size-print-ref.html
@@ -0,0 +1,6 @@
+<!doctype html>
+<title>Printing with default page size</title>
+<style>
+html { box-sizing: border-box; height: 100%; border: 2px solid black; }
+</style>
+<h1>Chapter 1. Loomings</h1>