summaryrefslogtreecommitdiffstats
path: root/layout/reftests/text-decoration
diff options
context:
space:
mode:
Diffstat (limited to 'layout/reftests/text-decoration')
-rw-r--r--layout/reftests/text-decoration/1133392-ref.html17
-rw-r--r--layout/reftests/text-decoration/1133392.html36
-rw-r--r--layout/reftests/text-decoration/1159729-offset-adjustment-notref.html19
-rw-r--r--layout/reftests/text-decoration/1159729-offset-adjustment.html21
-rw-r--r--layout/reftests/text-decoration/1415214-notref.html18
-rw-r--r--layout/reftests/text-decoration/1415214.html18
-rw-r--r--layout/reftests/text-decoration/641444-1-ref.html38
-rw-r--r--layout/reftests/text-decoration/641444-1.html38
-rw-r--r--layout/reftests/text-decoration/676538-1-ref.html23
-rw-r--r--layout/reftests/text-decoration/676538-1.html22
-rw-r--r--layout/reftests/text-decoration/always-underline-links-ref.html2
-rw-r--r--layout/reftests/text-decoration/always-underline-links.html5
-rw-r--r--layout/reftests/text-decoration/complex-decoration-style-quirks-ref.html102
-rw-r--r--layout/reftests/text-decoration/complex-decoration-style-quirks.html114
-rw-r--r--layout/reftests/text-decoration/complex-decoration-style-standards-ref.html103
-rw-r--r--layout/reftests/text-decoration/complex-decoration-style-standards.html115
-rw-r--r--layout/reftests/text-decoration/decoration-color-override-quirks-ref.html5
-rw-r--r--layout/reftests/text-decoration/decoration-color-override-quirks.html5
-rw-r--r--layout/reftests/text-decoration/decoration-color-override-standards-ref.html6
-rw-r--r--layout/reftests/text-decoration/decoration-color-override-standards.html6
-rw-r--r--layout/reftests/text-decoration/decoration-color-quirks-ref.html75
-rw-r--r--layout/reftests/text-decoration/decoration-color-quirks.html84
-rw-r--r--layout/reftests/text-decoration/decoration-color-standards-ref.html77
-rw-r--r--layout/reftests/text-decoration/decoration-color-standards.html83
-rw-r--r--layout/reftests/text-decoration/decoration-css21-block-ref.html16
-rw-r--r--layout/reftests/text-decoration/decoration-css21-block.html14
-rw-r--r--layout/reftests/text-decoration/decoration-css21-ref.html30
-rw-r--r--layout/reftests/text-decoration/decoration-css21.html30
-rw-r--r--layout/reftests/text-decoration/decoration-style-quirks-ref.html54
-rw-r--r--layout/reftests/text-decoration/decoration-style-quirks.html47
-rw-r--r--layout/reftests/text-decoration/decoration-style-standards-ref.html34
-rw-r--r--layout/reftests/text-decoration/decoration-style-standards.html34
-rw-r--r--layout/reftests/text-decoration/dynamic-underline-vertical-align-quirks-1-ref.html21
-rw-r--r--layout/reftests/text-decoration/dynamic-underline-vertical-align-quirks-1.html26
-rw-r--r--layout/reftests/text-decoration/dynamic-underline-vertical-align-quirks-2-ref.html21
-rw-r--r--layout/reftests/text-decoration/dynamic-underline-vertical-align-quirks-2.html26
-rw-r--r--layout/reftests/text-decoration/dynamic-underline-vertical-align-standards-1-ref.html22
-rw-r--r--layout/reftests/text-decoration/dynamic-underline-vertical-align-standards-1.html27
-rw-r--r--layout/reftests/text-decoration/dynamic-underline-vertical-align-standards-2-ref.html22
-rw-r--r--layout/reftests/text-decoration/dynamic-underline-vertical-align-standards-2.html27
-rw-r--r--layout/reftests/text-decoration/emphasis-style-dynamic-ref.html12
-rw-r--r--layout/reftests/text-decoration/emphasis-style-dynamic.html20
-rw-r--r--layout/reftests/text-decoration/inline-baseline-almost-standards-ref.html10
-rw-r--r--layout/reftests/text-decoration/inline-baseline-almost-standards.html10
-rw-r--r--layout/reftests/text-decoration/inline-baseline-quirks-ref.html8
-rw-r--r--layout/reftests/text-decoration/inline-baseline-quirks.html8
-rw-r--r--layout/reftests/text-decoration/line-through-style-block-dashed-quirks.html1
-rw-r--r--layout/reftests/text-decoration/line-through-style-block-dashed-standards.html2
-rw-r--r--layout/reftests/text-decoration/line-through-style-block-dotted-quirks.html1
-rw-r--r--layout/reftests/text-decoration/line-through-style-block-dotted-standards.html2
-rw-r--r--layout/reftests/text-decoration/line-through-style-block-double-quirks.html1
-rw-r--r--layout/reftests/text-decoration/line-through-style-block-double-standards.html2
-rw-r--r--layout/reftests/text-decoration/line-through-style-block-quirks-ref.html1
-rw-r--r--layout/reftests/text-decoration/line-through-style-block-solid-quirks.html1
-rw-r--r--layout/reftests/text-decoration/line-through-style-block-solid-standards.html2
-rw-r--r--layout/reftests/text-decoration/line-through-style-block-standards-ref.html2
-rw-r--r--layout/reftests/text-decoration/line-through-style-block-wavy-quirks.html1
-rw-r--r--layout/reftests/text-decoration/line-through-style-block-wavy-standards.html2
-rw-r--r--layout/reftests/text-decoration/line-through-style-inline-dashed-quirks.html1
-rw-r--r--layout/reftests/text-decoration/line-through-style-inline-dashed-standards.html2
-rw-r--r--layout/reftests/text-decoration/line-through-style-inline-dotted-quirks.html1
-rw-r--r--layout/reftests/text-decoration/line-through-style-inline-dotted-standards.html2
-rw-r--r--layout/reftests/text-decoration/line-through-style-inline-double-quirks.html1
-rw-r--r--layout/reftests/text-decoration/line-through-style-inline-double-standards.html2
-rw-r--r--layout/reftests/text-decoration/line-through-style-inline-quirks-ref.html1
-rw-r--r--layout/reftests/text-decoration/line-through-style-inline-solid-quirks.html1
-rw-r--r--layout/reftests/text-decoration/line-through-style-inline-solid-standards.html2
-rw-r--r--layout/reftests/text-decoration/line-through-style-inline-standards-ref.html2
-rw-r--r--layout/reftests/text-decoration/line-through-style-inline-wavy-quirks.html1
-rw-r--r--layout/reftests/text-decoration/line-through-style-inline-wavy-standards.html2
-rw-r--r--layout/reftests/text-decoration/overline-style-block-dashed-quirks.html1
-rw-r--r--layout/reftests/text-decoration/overline-style-block-dashed-standards.html2
-rw-r--r--layout/reftests/text-decoration/overline-style-block-dotted-quirks.html1
-rw-r--r--layout/reftests/text-decoration/overline-style-block-dotted-standards.html2
-rw-r--r--layout/reftests/text-decoration/overline-style-block-double-quirks.html1
-rw-r--r--layout/reftests/text-decoration/overline-style-block-double-standards.html2
-rw-r--r--layout/reftests/text-decoration/overline-style-block-quirks-ref.html1
-rw-r--r--layout/reftests/text-decoration/overline-style-block-solid-quirks.html1
-rw-r--r--layout/reftests/text-decoration/overline-style-block-solid-standards.html2
-rw-r--r--layout/reftests/text-decoration/overline-style-block-standards-ref.html2
-rw-r--r--layout/reftests/text-decoration/overline-style-block-wavy-quirks.html1
-rw-r--r--layout/reftests/text-decoration/overline-style-block-wavy-standards.html2
-rw-r--r--layout/reftests/text-decoration/overline-style-inline-dashed-quirks.html1
-rw-r--r--layout/reftests/text-decoration/overline-style-inline-dashed-standards.html2
-rw-r--r--layout/reftests/text-decoration/overline-style-inline-dotted-quirks.html1
-rw-r--r--layout/reftests/text-decoration/overline-style-inline-dotted-standards.html2
-rw-r--r--layout/reftests/text-decoration/overline-style-inline-double-quirks.html1
-rw-r--r--layout/reftests/text-decoration/overline-style-inline-double-standards.html2
-rw-r--r--layout/reftests/text-decoration/overline-style-inline-quirks-ref.html1
-rw-r--r--layout/reftests/text-decoration/overline-style-inline-solid-quirks.html1
-rw-r--r--layout/reftests/text-decoration/overline-style-inline-solid-standards.html2
-rw-r--r--layout/reftests/text-decoration/overline-style-inline-standards-ref.html2
-rw-r--r--layout/reftests/text-decoration/overline-style-inline-wavy-quirks.html1
-rw-r--r--layout/reftests/text-decoration/overline-style-inline-wavy-standards.html2
-rw-r--r--layout/reftests/text-decoration/reftest.list123
-rw-r--r--layout/reftests/text-decoration/skip-ink-cjk-1-ref.html18
-rw-r--r--layout/reftests/text-decoration/skip-ink-cjk-1.html15
-rw-r--r--layout/reftests/text-decoration/skip-ink-cjk-2-ref.html19
-rw-r--r--layout/reftests/text-decoration/skip-ink-cjk-2.html18
-rw-r--r--layout/reftests/text-decoration/skip-ink-cjk-3-ref.html19
-rw-r--r--layout/reftests/text-decoration/skip-ink-cjk-3.html18
-rw-r--r--layout/reftests/text-decoration/skip-ink-multiline-position-ref.html26
-rw-r--r--layout/reftests/text-decoration/skip-ink-multiline-position.html26
-rw-r--r--layout/reftests/text-decoration/skip-ink-vertical-align-2-notref.html5
-rw-r--r--layout/reftests/text-decoration/skip-ink-vertical-align-2.html5
-rw-r--r--layout/reftests/text-decoration/skip-ink-vertical-align-ref.html20
-rw-r--r--layout/reftests/text-decoration/skip-ink-vertical-align.html19
-rw-r--r--layout/reftests/text-decoration/table-quirk-1-ref.html7
-rw-r--r--layout/reftests/text-decoration/table-quirk-1.html7
-rw-r--r--layout/reftests/text-decoration/table-quirk-2-ref.html26
-rw-r--r--layout/reftests/text-decoration/table-quirk-2.html35
-rw-r--r--layout/reftests/text-decoration/text-decoration-propagation-1-quirks-ref.html38
-rw-r--r--layout/reftests/text-decoration/text-decoration-propagation-1-quirks.html46
-rw-r--r--layout/reftests/text-decoration/text-decoration-propagation-1-standards-ref.html39
-rw-r--r--layout/reftests/text-decoration/text-decoration-propagation-1-standards.html47
-rw-r--r--layout/reftests/text-decoration/text-decoration-zorder-1-quirks.html44
-rw-r--r--layout/reftests/text-decoration/text-decoration-zorder-1-ref.html55
-rw-r--r--layout/reftests/text-decoration/text-decoration-zorder-1-standards.html46
-rw-r--r--layout/reftests/text-decoration/underline-block-propagation-2-quirks-ref.html40
-rw-r--r--layout/reftests/text-decoration/underline-block-propagation-2-quirks.html35
-rw-r--r--layout/reftests/text-decoration/underline-block-propagation-2-standards-ref.html40
-rw-r--r--layout/reftests/text-decoration/underline-block-propagation-2-standards.html34
-rw-r--r--layout/reftests/text-decoration/underline-block-propagation-quirks-ref.html13
-rw-r--r--layout/reftests/text-decoration/underline-block-propagation-quirks.html13
-rw-r--r--layout/reftests/text-decoration/underline-block-propagation-standards-ref.html14
-rw-r--r--layout/reftests/text-decoration/underline-block-propagation-standards.html14
-rw-r--r--layout/reftests/text-decoration/underline-block-quirks-notref.html2
-rw-r--r--layout/reftests/text-decoration/underline-block-quirks-ref.html2
-rw-r--r--layout/reftests/text-decoration/underline-block-quirks.html2
-rw-r--r--layout/reftests/text-decoration/underline-block-standards-notref.html3
-rw-r--r--layout/reftests/text-decoration/underline-block-standards-ref.html3
-rw-r--r--layout/reftests/text-decoration/underline-block-standards.html3
-rw-r--r--layout/reftests/text-decoration/underline-button-1-ref.html9
-rw-r--r--layout/reftests/text-decoration/underline-button-1.html8
-rw-r--r--layout/reftests/text-decoration/underline-button-2-ref.html9
-rw-r--r--layout/reftests/text-decoration/underline-button-2.html8
-rw-r--r--layout/reftests/text-decoration/underline-inline-block-quirks-notref.html2
-rw-r--r--layout/reftests/text-decoration/underline-inline-block-quirks-ref.html2
-rw-r--r--layout/reftests/text-decoration/underline-inline-block-quirks.html2
-rw-r--r--layout/reftests/text-decoration/underline-inline-block-standards-notref.html3
-rw-r--r--layout/reftests/text-decoration/underline-inline-block-standards-ref.html3
-rw-r--r--layout/reftests/text-decoration/underline-inline-block-standards.html3
-rw-r--r--layout/reftests/text-decoration/underline-select-1-ref.html9
-rw-r--r--layout/reftests/text-decoration/underline-select-1.html8
-rw-r--r--layout/reftests/text-decoration/underline-select-2-ref.html9
-rw-r--r--layout/reftests/text-decoration/underline-select-2.html8
-rw-r--r--layout/reftests/text-decoration/underline-style-block-dashed-quirks.html1
-rw-r--r--layout/reftests/text-decoration/underline-style-block-dashed-standards.html2
-rw-r--r--layout/reftests/text-decoration/underline-style-block-dotted-quirks.html1
-rw-r--r--layout/reftests/text-decoration/underline-style-block-dotted-standards.html2
-rw-r--r--layout/reftests/text-decoration/underline-style-block-double-quirks.html1
-rw-r--r--layout/reftests/text-decoration/underline-style-block-double-standards.html2
-rw-r--r--layout/reftests/text-decoration/underline-style-block-quirks-ref.html1
-rw-r--r--layout/reftests/text-decoration/underline-style-block-solid-quirks.html1
-rw-r--r--layout/reftests/text-decoration/underline-style-block-solid-standards.html2
-rw-r--r--layout/reftests/text-decoration/underline-style-block-standards-ref.html2
-rw-r--r--layout/reftests/text-decoration/underline-style-block-wavy-quirks.html1
-rw-r--r--layout/reftests/text-decoration/underline-style-block-wavy-standards.html2
-rw-r--r--layout/reftests/text-decoration/underline-style-inline-dashed-quirks.html1
-rw-r--r--layout/reftests/text-decoration/underline-style-inline-dashed-standards.html2
-rw-r--r--layout/reftests/text-decoration/underline-style-inline-dotted-quirks.html1
-rw-r--r--layout/reftests/text-decoration/underline-style-inline-dotted-standards.html2
-rw-r--r--layout/reftests/text-decoration/underline-style-inline-double-quirks.html1
-rw-r--r--layout/reftests/text-decoration/underline-style-inline-double-standards.html2
-rw-r--r--layout/reftests/text-decoration/underline-style-inline-quirks-ref.html1
-rw-r--r--layout/reftests/text-decoration/underline-style-inline-solid-quirks.html1
-rw-r--r--layout/reftests/text-decoration/underline-style-inline-solid-standards.html2
-rw-r--r--layout/reftests/text-decoration/underline-style-inline-standards-ref.html2
-rw-r--r--layout/reftests/text-decoration/underline-style-inline-wavy-quirks.html1
-rw-r--r--layout/reftests/text-decoration/underline-style-inline-wavy-standards.html2
-rw-r--r--layout/reftests/text-decoration/underline-table-caption-quirks-notref.html12
-rw-r--r--layout/reftests/text-decoration/underline-table-caption-quirks-ref.html12
-rw-r--r--layout/reftests/text-decoration/underline-table-caption-quirks.html12
-rw-r--r--layout/reftests/text-decoration/underline-table-caption-standards-notref.html13
-rw-r--r--layout/reftests/text-decoration/underline-table-caption-standards-ref.html13
-rw-r--r--layout/reftests/text-decoration/underline-table-caption-standards.html13
-rw-r--r--layout/reftests/text-decoration/underline-table-cell-quirks-notref.html11
-rw-r--r--layout/reftests/text-decoration/underline-table-cell-quirks-ref.html11
-rw-r--r--layout/reftests/text-decoration/underline-table-cell-quirks.html11
-rw-r--r--layout/reftests/text-decoration/underline-table-cell-standards-notref.html12
-rw-r--r--layout/reftests/text-decoration/underline-table-cell-standards-ref.html12
-rw-r--r--layout/reftests/text-decoration/underline-table-cell-standards.html12
-rw-r--r--layout/reftests/text-decoration/vertical-mode-decorations-1-ref.html15
-rw-r--r--layout/reftests/text-decoration/vertical-mode-decorations-1.html15
-rw-r--r--layout/reftests/text-decoration/vertical-mode-decorations-2-ref.html15
-rw-r--r--layout/reftests/text-decoration/vertical-mode-decorations-2.html15
186 files changed, 2885 insertions, 0 deletions
diff --git a/layout/reftests/text-decoration/1133392-ref.html b/layout/reftests/text-decoration/1133392-ref.html
new file mode 100644
index 0000000000..ad933fb177
--- /dev/null
+++ b/layout/reftests/text-decoration/1133392-ref.html
@@ -0,0 +1,17 @@
+<!DOCTYPE HTML>
+<html>
+<title>reftest, bug 1133392</title>
+<style>
+
+p > span {
+ text-decoration: underline;
+}
+
+p > span > span {
+ vertical-align: -2em;
+}
+
+</style>
+
+<p class="state-one"><span>This text<br>
+has <span>an underline</span>.</span></p>
diff --git a/layout/reftests/text-decoration/1133392.html b/layout/reftests/text-decoration/1133392.html
new file mode 100644
index 0000000000..46983a1bd8
--- /dev/null
+++ b/layout/reftests/text-decoration/1133392.html
@@ -0,0 +1,36 @@
+<!DOCTYPE HTML>
+<html class="reftest-wait">
+<title>reftest, bug 1133392</title>
+<style>
+
+ p:not(.state-one) > span {
+ text-decoration: underline;
+ }
+
+ p > span > span {
+ vertical-align: -2em;
+ }
+
+ p:not(.state-three) > span > span {
+ visibility: hidden;
+ }
+
+</style>
+
+<p class="state-one"><span>This text<br>
+has <span>an underline</span>.</span></p>
+
+<script>
+
+ var p = document.getElementsByTagName("p")[0];
+ p.offsetLeft; // flush layout
+ document.getElementsByTagName('p')[0].className = 'state-two';
+
+ document.addEventListener("MozReftestInvalidate", step_three);
+ function step_three(event) {
+ document.getElementsByTagName('p')[0].className = 'state-three';
+ document.documentElement.classList.remove("reftest-wait");
+ }
+
+</script>
+
diff --git a/layout/reftests/text-decoration/1159729-offset-adjustment-notref.html b/layout/reftests/text-decoration/1159729-offset-adjustment-notref.html
new file mode 100644
index 0000000000..90431b9a82
--- /dev/null
+++ b/layout/reftests/text-decoration/1159729-offset-adjustment-notref.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<style type="text/css">
+p {
+ font: 12px Impact, Times, serif;
+}
+span {
+ background: black;
+}
+</style>
+</head>
+<body>
+<p>
+<span>abcxyz</span>
+</p>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/1159729-offset-adjustment.html b/layout/reftests/text-decoration/1159729-offset-adjustment.html
new file mode 100644
index 0000000000..cf05dd1880
--- /dev/null
+++ b/layout/reftests/text-decoration/1159729-offset-adjustment.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<style type="text/css">
+p {
+ font: 12px Impact, Times, serif;
+}
+span {
+ background: black;
+ text-decoration: overline;
+ text-decoration-style: wavy;
+}
+</style>
+</head>
+<body>
+<p>
+<span>abcxyz</span>
+</p>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/1415214-notref.html b/layout/reftests/text-decoration/1415214-notref.html
new file mode 100644
index 0000000000..0e59f2b663
--- /dev/null
+++ b/layout/reftests/text-decoration/1415214-notref.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="utf-8" />
+ <title>clip-rect-correctness-ref</title>
+ <style>
+ p {
+ font-size: 4px;
+ }
+ </style>
+ </head>
+ <body>
+ <p style="position: fixed; bottom: 0; margin: 0">
+ <span>link1</span>
+ <span>link2</span>
+ </p>
+ </body>
+</html>
diff --git a/layout/reftests/text-decoration/1415214.html b/layout/reftests/text-decoration/1415214.html
new file mode 100644
index 0000000000..90f9b2dbcb
--- /dev/null
+++ b/layout/reftests/text-decoration/1415214.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="utf-8" />
+ <title>clip-rect-correctness</title>
+ <style>
+ p {
+ font-size: 4px;
+ }
+ </style>
+ </head>
+ <body>
+ <p style="position: fixed; bottom: 0; margin: 0">
+ <span style="text-decoration: underline overline line-through">link1</span>
+ <span style="text-decoration: underline overline line-through">link2</span>
+ </p>
+ </body>
+</html>
diff --git a/layout/reftests/text-decoration/641444-1-ref.html b/layout/reftests/text-decoration/641444-1-ref.html
new file mode 100644
index 0000000000..798e49638d
--- /dev/null
+++ b/layout/reftests/text-decoration/641444-1-ref.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="UTF-8">
+ <title>Mozilla text-decoration bug if direction:rtl and text-indent &gt; 0</title>
+ <style type="text/css">
+ p { text-decoration: underline; }
+ </style>
+ </head>
+ <body>
+ <div dir="ltr">
+ <p style="margin-left:-1em">text-indent:-1em</p>
+ <p style="margin-left: 0em">text-indent: 0em</p>
+ <p style="margin-left: 1em">text-indent: 1em</p>
+ <p style="margin-left: 2em">text-indent: 2em</p>
+ <p style="margin-left: 3em">text-indent: 3em</p>
+ <p style="margin-left: 4em">text-indent: 4em</p>
+ <p style="margin-left: 5em">text-indent: 5em</p>
+ <p style="margin-left: 6em">text-indent: 6em</p>
+ <p style="margin-left: 7em">text-indent: 7em</p>
+ <p style="margin-left: 8em">text-indent: 8em</p>
+ <p style="margin-left: 9em">text-indent: 9em</p>
+ </div>
+ <div dir="rtl">
+ <p style="margin-right:-1em">text-indent:-1em</p>
+ <p style="margin-right: 0em">text-indent: 0em</p>
+ <p style="margin-right: 1em">text-indent: 1em</p>
+ <p style="margin-right: 2em">text-indent: 2em</p>
+ <p style="margin-right: 3em">text-indent: 3em</p>
+ <p style="margin-right: 4em">text-indent: 4em</p>
+ <p style="margin-right: 5em">text-indent: 5em</p>
+ <p style="margin-right: 6em">text-indent: 6em</p>
+ <p style="margin-right: 7em">text-indent: 7em</p>
+ <p style="margin-right: 8em">text-indent: 8em</p>
+ <p style="margin-right: 9em">text-indent: 9em</p>
+ </div>
+ </body>
+</html>
diff --git a/layout/reftests/text-decoration/641444-1.html b/layout/reftests/text-decoration/641444-1.html
new file mode 100644
index 0000000000..5c5d148ad8
--- /dev/null
+++ b/layout/reftests/text-decoration/641444-1.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="UTF-8">
+ <title>Mozilla text-decoration bug if direction:rtl and text-indent &gt; 0</title>
+ <style type="text/css">
+ p { text-decoration: underline; }
+ </style>
+ </head>
+ <body>
+ <div dir="ltr">
+ <p style="text-indent:-1em">text-indent:-1em</p>
+ <p style="text-indent: 0em">text-indent: 0em</p>
+ <p style="text-indent: 1em">text-indent: 1em</p>
+ <p style="text-indent: 2em">text-indent: 2em</p>
+ <p style="text-indent: 3em">text-indent: 3em</p>
+ <p style="text-indent: 4em">text-indent: 4em</p>
+ <p style="text-indent: 5em">text-indent: 5em</p>
+ <p style="text-indent: 6em">text-indent: 6em</p>
+ <p style="text-indent: 7em">text-indent: 7em</p>
+ <p style="text-indent: 8em">text-indent: 8em</p>
+ <p style="text-indent: 9em">text-indent: 9em</p>
+ </div>
+ <div dir="rtl">
+ <p style="text-indent:-1em">text-indent:-1em</p>
+ <p style="text-indent: 0em">text-indent: 0em</p>
+ <p style="text-indent: 1em">text-indent: 1em</p>
+ <p style="text-indent: 2em">text-indent: 2em</p>
+ <p style="text-indent: 3em">text-indent: 3em</p>
+ <p style="text-indent: 4em">text-indent: 4em</p>
+ <p style="text-indent: 5em">text-indent: 5em</p>
+ <p style="text-indent: 6em">text-indent: 6em</p>
+ <p style="text-indent: 7em">text-indent: 7em</p>
+ <p style="text-indent: 8em">text-indent: 8em</p>
+ <p style="text-indent: 9em">text-indent: 9em</p>
+ </div>
+ </body>
+</html>
diff --git a/layout/reftests/text-decoration/676538-1-ref.html b/layout/reftests/text-decoration/676538-1-ref.html
new file mode 100644
index 0000000000..5eb1de74ef
--- /dev/null
+++ b/layout/reftests/text-decoration/676538-1-ref.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html lang="en-US">
+<head>
+<title>text-decoration alignment</title>
+<meta charset=UTF-8>
+<style>
+
+span.block { position: absolute; top: 0; left: 0; }
+span.dec { text-decoration: underline }
+span.hide { color: transparent }
+
+</style>
+</head>
+<body>
+
+<p style="position: relative">
+ <span class="block" style="margin-top: 16px"><span class="hide"></span><span class="dec" style="color:black ">x<span class="hide">xx</span></span></span>
+ <span class="block" style="margin-top: 08px"><span class="hide">x</span><span class="dec" style="color:fuchsia">x<span class="hide">x</span></span></span>
+ <span class="block" style="margin-top: 00px"><span class="hide">xx</span><span class="dec" style="color:aqua ">x<span class="hide"></span></span></span>
+</p>
+
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/676538-1.html b/layout/reftests/text-decoration/676538-1.html
new file mode 100644
index 0000000000..837f99abfa
--- /dev/null
+++ b/layout/reftests/text-decoration/676538-1.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html lang="en-US">
+<head>
+<title>text-decoration alignment</title>
+<meta charset=UTF-8>
+<style>
+
+p, span { text-decoration: underline }
+span { vertical-align: 8px }
+p > span { color: fuchsia }
+p > span > span { color: aqua }
+
+em { font-style: normal; font-size: 5em }
+
+</style>
+</head>
+<body>
+
+<p>x<span>x<span>x</span></span></p>
+
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/always-underline-links-ref.html b/layout/reftests/text-decoration/always-underline-links-ref.html
new file mode 100644
index 0000000000..d06158949b
--- /dev/null
+++ b/layout/reftests/text-decoration/always-underline-links-ref.html
@@ -0,0 +1,2 @@
+<!doctype html>
+<a href="#">Should have an underline regardless of what the page says</a>
diff --git a/layout/reftests/text-decoration/always-underline-links.html b/layout/reftests/text-decoration/always-underline-links.html
new file mode 100644
index 0000000000..81021494dd
--- /dev/null
+++ b/layout/reftests/text-decoration/always-underline-links.html
@@ -0,0 +1,5 @@
+<!doctype html>
+<style>
+ a { text-decoration: none !important }
+</style>
+<a href="#">Should have an underline regardless of what the page says</a>
diff --git a/layout/reftests/text-decoration/complex-decoration-style-quirks-ref.html b/layout/reftests/text-decoration/complex-decoration-style-quirks-ref.html
new file mode 100644
index 0000000000..fbf2c4bfef
--- /dev/null
+++ b/layout/reftests/text-decoration/complex-decoration-style-quirks-ref.html
@@ -0,0 +1,102 @@
+<style type="text/css">
+p {
+ margin-left: 11px;
+ padding-left: 11px;
+}
+p.dotted span {
+ text-decoration-style: dotted;
+}
+p.dashed span {
+ text-decoration-style: dashed;
+}
+p.wavy span {
+ text-decoration-style: wavy;
+}
+span {
+ text-decoration: underline line-through overline;
+}
+p.relative {
+ margin-left: 24px;
+}
+p.shadow span {
+ position: relative;
+ left: 1em;
+ top: 0.5em;
+}
+</style>
+<div style="font-size: 16px;">
+<p class="dotted">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dashed">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="wavy">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dotted relative">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dashed relative">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="wavy relative">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dotted">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dashed">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="wavy">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dotted shadow">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dashed shadow">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="wavy shadow">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+</div>
+<div style="font-size: 32px;">
+<p class="dotted">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dashed">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="wavy">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dotted relative">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dashed relative">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="wavy relative">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dotted">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dashed">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="wavy">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dotted shadow">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dashed shadow">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="wavy shadow">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+</div>
diff --git a/layout/reftests/text-decoration/complex-decoration-style-quirks.html b/layout/reftests/text-decoration/complex-decoration-style-quirks.html
new file mode 100644
index 0000000000..6b2583afe7
--- /dev/null
+++ b/layout/reftests/text-decoration/complex-decoration-style-quirks.html
@@ -0,0 +1,114 @@
+<style type="text/css">
+p {
+ margin-left: 11px;
+ padding-left: 11px;
+}
+p.dotted span {
+ text-decoration-style: dotted;
+}
+p.dashed span {
+ text-decoration-style: dashed;
+}
+p.wavy span {
+ text-decoration-style: wavy;
+}
+span {
+ text-decoration: underline line-through overline;
+}
+p.relative span {
+ position: relative;
+ left: 13px;
+}
+
+p.relative2 > span {
+ position: relative;
+ left: 13px;
+ text-decoration: none;
+}
+
+p.relative2 span span {
+ position: relative;
+ left: -13px;
+}
+
+p.shadow {
+ color: transparent;
+ text-shadow: 1em 0.5em black;
+}
+</style>
+<div style="font-size: 16px;">
+<p class="dotted">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dashed">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="wavy">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dotted relative">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dashed relative">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="wavy relative">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dotted relative2">
+<span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span></span>
+</p>
+<p class="dashed relative2">
+<span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span></span>
+</p>
+<p class="wavy relative2">
+<span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span></span>
+</p>
+<p class="dotted shadow">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dashed shadow">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="wavy shadow">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+</div>
+<div style="font-size: 32px;">
+<p class="dotted">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dashed">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="wavy">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dotted relative">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dashed relative">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="wavy relative">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dotted relative2">
+<span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span></span>
+</p>
+<p class="dashed relative2">
+<span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span></span>
+</p>
+<p class="wavy relative2">
+<span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span></span>
+</p>
+<p class="dotted shadow">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dashed shadow">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="wavy shadow">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+</div>
diff --git a/layout/reftests/text-decoration/complex-decoration-style-standards-ref.html b/layout/reftests/text-decoration/complex-decoration-style-standards-ref.html
new file mode 100644
index 0000000000..45ad85d18d
--- /dev/null
+++ b/layout/reftests/text-decoration/complex-decoration-style-standards-ref.html
@@ -0,0 +1,103 @@
+<!DOCTYPE html>
+<style type="text/css">
+p {
+ margin-left: 11px;
+ padding-left: 11px;
+}
+p.dotted span {
+ text-decoration-style: dotted;
+}
+p.dashed span {
+ text-decoration-style: dashed;
+}
+p.wavy span {
+ text-decoration-style: wavy;
+}
+span {
+ text-decoration: underline line-through overline;
+}
+p.relative {
+ margin-left: 24px;
+}
+p.shadow span {
+ position: relative;
+ left: 1em;
+ top: 0.5em;
+}
+</style>
+<div style="font-size: 16px;">
+<p class="dotted">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dashed">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="wavy">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dotted relative">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dashed relative">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="wavy relative">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dotted">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dashed">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="wavy">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dotted shadow">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dashed shadow">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="wavy shadow">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+</div>
+<div style="font-size: 32px;">
+<p class="dotted">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dashed">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="wavy">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dotted relative">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dashed relative">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="wavy relative">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dotted">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dashed">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="wavy">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dotted shadow">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="dashed shadow">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+<p class="wavy shadow">
+<span>&nbsp;&nbsp;&nbsp;&nbsp;</span>
+</p>
+</div>
diff --git a/layout/reftests/text-decoration/complex-decoration-style-standards.html b/layout/reftests/text-decoration/complex-decoration-style-standards.html
new file mode 100644
index 0000000000..8c7f7fa1f2
--- /dev/null
+++ b/layout/reftests/text-decoration/complex-decoration-style-standards.html
@@ -0,0 +1,115 @@
+<!DOCTYPE html>
+<style type="text/css">
+p {
+ margin-left: 11px;
+ padding-left: 11px;
+}
+p.dotted span {
+ text-decoration-style: dotted;
+}
+p.dashed span {
+ text-decoration-style: dashed;
+}
+p.wavy span {
+ text-decoration-style: wavy;
+}
+span {
+ text-decoration: underline line-through overline;
+}
+p.relative span {
+ position: relative;
+ left: 13px;
+}
+
+p.relative2 > span {
+ position: relative;
+ left: 13px;
+ text-decoration: none;
+}
+
+p.relative2 span span {
+ position: relative;
+ left: -13px;
+}
+
+p.shadow {
+ color: transparent;
+ text-shadow: 1em 0.5em black;
+}
+</style>
+<div style="font-size: 16px;">
+<p class="dotted">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dashed">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="wavy">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dotted relative">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dashed relative">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="wavy relative">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dotted relative2">
+<span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span></span>
+</p>
+<p class="dashed relative2">
+<span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span></span>
+</p>
+<p class="wavy relative2">
+<span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span></span>
+</p>
+<p class="dotted shadow">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dashed shadow">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="wavy shadow">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+</div>
+<div style="font-size: 32px;">
+<p class="dotted">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dashed">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="wavy">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dotted relative">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dashed relative">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="wavy relative">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dotted relative2">
+<span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span></span>
+</p>
+<p class="dashed relative2">
+<span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span></span>
+</p>
+<p class="wavy relative2">
+<span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span></span>
+</p>
+<p class="dotted shadow">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="dashed shadow">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+<p class="wavy shadow">
+<span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span><span>&nbsp;</span>
+</p>
+</div>
diff --git a/layout/reftests/text-decoration/decoration-color-override-quirks-ref.html b/layout/reftests/text-decoration/decoration-color-override-quirks-ref.html
new file mode 100644
index 0000000000..5b8481674e
--- /dev/null
+++ b/layout/reftests/text-decoration/decoration-color-override-quirks-ref.html
@@ -0,0 +1,5 @@
+<html>
+ <body>
+ <u>hello</u><img src="../backgrounds/red-128-alpha-32x32.png"><font color="purple"><u>hello</u></font>
+ </body>
+</html>
diff --git a/layout/reftests/text-decoration/decoration-color-override-quirks.html b/layout/reftests/text-decoration/decoration-color-override-quirks.html
new file mode 100644
index 0000000000..67e1346b94
--- /dev/null
+++ b/layout/reftests/text-decoration/decoration-color-override-quirks.html
@@ -0,0 +1,5 @@
+<html>
+ <body>
+ <u>hello<img src="../backgrounds/red-128-alpha-32x32.png"><font color="purple">hello</font></u>
+ </body>
+</html>
diff --git a/layout/reftests/text-decoration/decoration-color-override-standards-ref.html b/layout/reftests/text-decoration/decoration-color-override-standards-ref.html
new file mode 100644
index 0000000000..4420e6fc35
--- /dev/null
+++ b/layout/reftests/text-decoration/decoration-color-override-standards-ref.html
@@ -0,0 +1,6 @@
+<!DOCTYPE HTML>
+<html>
+ <body>
+ <u>hello<img src="../backgrounds/red-128-alpha-32x32.png"><span style="color: purple;">hello</span></u>
+ </body>
+</html>
diff --git a/layout/reftests/text-decoration/decoration-color-override-standards.html b/layout/reftests/text-decoration/decoration-color-override-standards.html
new file mode 100644
index 0000000000..2be52e67de
--- /dev/null
+++ b/layout/reftests/text-decoration/decoration-color-override-standards.html
@@ -0,0 +1,6 @@
+<!DOCTYPE HTML>
+<html>
+ <body>
+ <u>hello<img src="../backgrounds/red-128-alpha-32x32.png"><font color="purple">hello</font></u>
+ </body>
+</html>
diff --git a/layout/reftests/text-decoration/decoration-color-quirks-ref.html b/layout/reftests/text-decoration/decoration-color-quirks-ref.html
new file mode 100644
index 0000000000..0366b7ddba
--- /dev/null
+++ b/layout/reftests/text-decoration/decoration-color-quirks-ref.html
@@ -0,0 +1,75 @@
+<style>
+ *{
+ text-decoration-skip-ink: none;
+ }
+</style>
+<p style="color: #008000;
+ text-decoration: underline line-through overline;">
+ <span style="color: #0000FF;">This blue text has green decoration lines</span>
+</p>
+<p style="color: yellow;
+ text-decoration: underline line-through overline;">
+ <span style="color: red;">This red text has yellow decoration lines</span>
+</p>
+<p style="color: red; text-decoration: underline line-through overline;">
+ <span style="color: #0000FF">This blue text has red lines</span>
+</p>
+<p style="color: orange;">
+ This orange text has transparent lines
+</p>
+<p>
+ Here is no decoration lines, but
+ <span style="font-size: 2em;
+ color: green;
+ text-decoration: underline line-through overline;">
+ <span style="color: blue;">
+ this blue text has green decoration lines</span></span>,
+ and here is no decoration lines too.
+</p>
+<p style="color: red;">
+ This is red paragraph and here is no decoration lines, but
+ <span style="font-size: 2em;
+ color: green;
+ text-decoration: underline line-through overline;">
+ <span style="color: red;">here are green decoration lines</span></span>,
+ and here is no decoration lines too.
+</p>
+<p style="color: purple;
+ text-decoration: underline line-through overline;">
+ This is purple paragraph and here are decoration lines of current color, but
+ <span style="font-size: 2em;
+ color: red;
+ text-decoration: underline line-through overline;">
+ <span style="color: purple;">here are red decoration lines</span></span>,
+ and here are current color decoration lines.
+</p>
+<p style="color: green;
+ text-decoration: underline line-through overline;">
+ This is green paragraph and here are decoration lines of current color, and
+ <span style="font-size: 2em;">
+ here is specified red decoration color but has current color lines</span>,
+ and here are current color decoration lines.
+</p>
+<p style="color: blue;">
+ This is blue paragraph,
+ <span style="font-size:2em;
+ color: red;
+ text-decoration: underline line-through overline;
+ text-decoration-color: red;">
+ here is red text with red decoration lines</span>,
+ and here is blue text without decoration lines.
+</p>
+<p style="color: blue;">
+ This is blue paragraph and decoration color is specified as green,
+ <span style="font-size:2em;
+ color: red;
+ text-decoration: underline line-through overline;
+ text-decoration-color: green;">
+ here is red text with green decoration lines</span>,
+ and here is blue text without decoration lines.
+</p>
+<p style="color: blue;
+ text-decoration: underline line-through overline;">
+ Here has blue decoration lines even though its color is specified as red
+ before text-decoration.
+</p>
diff --git a/layout/reftests/text-decoration/decoration-color-quirks.html b/layout/reftests/text-decoration/decoration-color-quirks.html
new file mode 100644
index 0000000000..17a93c6d6a
--- /dev/null
+++ b/layout/reftests/text-decoration/decoration-color-quirks.html
@@ -0,0 +1,84 @@
+<style>
+ *{
+ text-decoration-skip-ink: none;
+ }
+</style>
+<p style="color: blue;
+ text-decoration: underline line-through overline;
+ text-decoration-color: green;">
+ This blue text has green decoration lines
+</p>
+<p style="color: #ff0000;
+ text-decoration: underline line-through overline;
+ text-decoration-color: #ffff00;">
+ This red text has yellow decoration lines
+</p>
+<p style="color: rgb(0%, 0%, 100%);
+ text-decoration: underline line-through overline;
+ text-decoration-color: rgb(100%, 0%, 0%);">
+ This blue text has red lines
+</p>
+<p style="color: orange;
+ text-decoration: underline line-through overline;
+ text-decoration-color: transparent;">
+ This orange text has transparent lines
+</p>
+<p>
+ Here is no decoration lines, but
+ <span style="font-size: 2em;
+ color: blue;
+ text-decoration: underline line-through overline;
+ text-decoration-color: green;">
+ this blue text has green decoration lines</span>,
+ and here is no decoration lines too.
+</p>
+<p style="color: red;">
+ This is red paragraph and here is no decoration lines, but
+ <span style="font-size: 2em;
+ text-decoration: underline line-through overline;
+ text-decoration-color: green;">
+ here are green decoration lines</span>,
+ and here is no decoration lines too.
+</p>
+<p style="color: purple;
+ text-decoration: underline line-through overline;">
+ This is purple paragraph and here are decoration lines of current color, but
+ <span style="font-size: 2em;
+ text-decoration: underline line-through overline;
+ text-decoration-color: red;">
+ here are red decoration lines</span>,
+ and here are current color decoration lines.
+</p>
+<p style="color: green;
+ text-decoration: underline line-through overline;">
+ This is green paragraph and here are decoration lines of current color, and
+ <span style="font-size: 2em;
+ text-decoration-color: red;">
+ here is specified red decoration color but has current color lines</span>,
+ and here are current color decoration lines.
+</p>
+<p style="color: blue;">
+ This is blue paragraph,
+ <span style="font-size:2em;
+ color: red;
+ text-decoration: underline line-through overline;
+ text-decoration-color: inherit;">
+ here is red text with red decoration lines</span>,
+ and here is blue text without decoration lines.
+</p>
+<p style="color: blue;
+ text-decoration-color: green;">
+ This is blue paragraph and decoration color is specified as green,
+ <span style="font-size:2em;
+ color: red;
+ text-decoration: underline line-through overline;
+ text-decoration-color: inherit;">
+ here is red text with green decoration lines</span>,
+ and here is blue text without decoration lines.
+</p>
+<p style="color: blue;
+ text-decoration-color: red;
+ text-decoration: underline line-through overline;">
+ Here has blue decoration lines even though its color is specified as red
+ before text-decoration.
+</p>
diff --git a/layout/reftests/text-decoration/decoration-color-standards-ref.html b/layout/reftests/text-decoration/decoration-color-standards-ref.html
new file mode 100644
index 0000000000..f478fb5083
--- /dev/null
+++ b/layout/reftests/text-decoration/decoration-color-standards-ref.html
@@ -0,0 +1,77 @@
+<!DOCTYPE html>
+<style>
+ *{
+ text-decoration-skip-ink: none;
+ }
+</style>
+<p style="color: #008000;
+ text-decoration: underline line-through overline;">
+ <span style="color: #0000FF;">This blue text has green decoration lines</span>
+</p>
+<p style="color: yellow;
+ text-decoration: underline line-through overline;">
+ <span style="color: red;">This red text has yellow decoration lines</span>
+</p>
+<p style="color: red;
+ text-decoration: underline line-through overline;">
+ <span style="color: #0000FF">This blue text has red lines</span>
+</p>
+<p style="color: orange;">
+ This orange text has transparent lines
+</p>
+<p>
+ Here is no decoration lines, but
+ <span style="font-size: 2em;
+ color: green;
+ text-decoration: underline line-through overline;">
+ <span style="color: blue;">
+ this blue text has green decoration lines</span></span>,
+ and here is no decoration lines too.
+</p>
+<p style="color: red;">
+ This is red paragraph and here is no decoration lines, but
+ <span style="font-size: 2em;
+ color: green;
+ text-decoration: underline line-through overline;">
+ <span style="color: red;">here are green decoration lines</span></span>,
+ and here is no decoration lines too.
+</p>
+<p style="color: purple;
+ text-decoration: underline line-through overline;">
+ This is purple paragraph and here are decoration lines of current color, but
+ <span style="font-size: 2em;
+ color: red;
+ text-decoration: underline line-through overline;">
+ <span style="color: purple;">here are red decoration lines</span></span>,
+ and here are current color decoration lines.
+</p>
+<p style="color: green;
+ text-decoration: underline line-through overline;">
+ This is green paragraph and here are decoration lines of current color, and
+ <span style="font-size: 2em;">
+ here is specified red decoration color but has current color lines</span>,
+ and here are current color decoration lines.
+</p>
+<p style="color: blue;">
+ This is blue paragraph,
+ <span style="font-size:2em;
+ color: red;
+ text-decoration: underline line-through overline;
+ text-decoration-color: red;">
+ here is red text with red decoration lines</span>,
+ and here is blue text without decoration lines.
+</p>
+<p style="color: blue;">
+ This is blue paragraph and decoration color is specified as green,
+ <span style="font-size:2em;
+ color: red;
+ text-decoration: underline line-through overline;
+ text-decoration-color: green;">
+ here is red text with green decoration lines</span>,
+ and here is blue text without decoration lines.
+</p>
+<p style="color: blue;
+ text-decoration: underline line-through overline;">
+ Here has blue decoration lines even though its color is specified as red
+ before text-decoration.
+</p>
diff --git a/layout/reftests/text-decoration/decoration-color-standards.html b/layout/reftests/text-decoration/decoration-color-standards.html
new file mode 100644
index 0000000000..3f8c5938e4
--- /dev/null
+++ b/layout/reftests/text-decoration/decoration-color-standards.html
@@ -0,0 +1,83 @@
+<!DOCTYPE html>
+<style>
+ *{
+ text-decoration-skip-ink: none;
+ }
+</style>
+<p style="color: blue;
+ text-decoration: underline line-through overline;
+ text-decoration-color: green;">
+ This blue text has green decoration lines
+</p>
+<p style="color: #ff0000;
+ text-decoration: underline line-through overline;
+ text-decoration-color: #ffff00;">
+ This red text has yellow decoration lines
+</p>
+<p style="color: rgb(0%, 0%, 100%);
+ text-decoration: underline line-through overline;
+ text-decoration-color: rgb(100%, 0%, 0%);">
+ This blue text has red lines
+</p>
+<p style="color: orange;
+ text-decoration: underline line-through overline;
+ text-decoration-color: transparent;">
+ This orange text has transparent lines
+</p>
+<p>
+ Here is no decoration lines, but
+ <span style="font-size: 2em; color: blue;
+ text-decoration: underline line-through overline;
+ text-decoration-color: green;">
+ this blue text has green decoration lines</span>,
+ and here is no decoration lines too.
+</p>
+<p style="color: red;">
+ This is red paragraph and here is no decoration lines, but
+ <span style="font-size: 2em;
+ text-decoration: underline line-through overline;
+ text-decoration-color: green;">
+ here are green decoration lines</span>,
+ and here is no decoration lines too.</p>
+<p style="color: purple;
+ text-decoration: underline line-through overline;">
+ This is purple paragraph and here are decoration lines of current color, but
+ <span style="font-size: 2em;
+ text-decoration: underline line-through overline;
+ text-decoration-color: red;">
+ here are red decoration lines</span>,
+ and here are current color decoration lines.
+</p>
+<p style="color: green;
+ text-decoration: underline line-through overline;">
+ This is green paragraph and here are decoration lines of current color, and
+ <span style="font-size: 2em;
+ text-decoration-color: red;">
+ here is specified red decoration color but has current color lines</span>,
+ and here are current color decoration lines.
+</p>
+<p style="color: blue;">
+ This is blue paragraph,
+ <span style="font-size:2em;
+ color: red;
+ text-decoration: underline line-through overline;
+ text-decoration-color: inherit;">
+ here is red text with red decoration lines</span>,
+ and here is blue text without decoration lines.
+</p>
+<p style="color: blue;
+ text-decoration-color: green;">
+ This is blue paragraph and decoration color is specified as green,
+ <span style="font-size:2em;
+ color: red;
+ text-decoration: underline line-through overline;
+ text-decoration-color: inherit;">
+ here is red text with green decoration lines</span>,
+ and here is blue text without decoration lines.
+</p>
+<p style="color: blue;
+ text-decoration-color: red;
+ text-decoration: underline line-through overline;">
+ Here has blue decoration lines even though its color is specified as red
+ before text-decoration.
+</p>
diff --git a/layout/reftests/text-decoration/decoration-css21-block-ref.html b/layout/reftests/text-decoration/decoration-css21-block-ref.html
new file mode 100644
index 0000000000..740f73323e
--- /dev/null
+++ b/layout/reftests/text-decoration/decoration-css21-block-ref.html
@@ -0,0 +1,16 @@
+<html>
+ <head>
+ <style>
+ .high {vertical-align: 5em;}
+ .invisible {color: transparent;}
+ </style>
+ </head>
+ <body>
+ <div>
+ <span style="text-decoration: underline;">
+ underline<span class="invisible">continued<span class="invisible">continued</span></span></span>
+ <span class="invisible high">offset<span class="invisible high">offset</span></span>
+ </div>
+ <span style="text-decoration: underline;">also underlined</span>
+ </body>
+</html> \ No newline at end of file
diff --git a/layout/reftests/text-decoration/decoration-css21-block.html b/layout/reftests/text-decoration/decoration-css21-block.html
new file mode 100644
index 0000000000..761fc6a94d
--- /dev/null
+++ b/layout/reftests/text-decoration/decoration-css21-block.html
@@ -0,0 +1,14 @@
+<html>
+ <head>
+ <style>
+ .high {vertical-align: 5em;}
+ .invisible {color: transparent;}
+ </style>
+ </head>
+ <body>
+ <div style="text-decoration: underline;">
+ underline<span class="invisible high">continued<span class="invisible high">continued</span></span><br>
+ also underlined
+ </div>
+ </body>
+</html> \ No newline at end of file
diff --git a/layout/reftests/text-decoration/decoration-css21-ref.html b/layout/reftests/text-decoration/decoration-css21-ref.html
new file mode 100644
index 0000000000..14b5844ad6
--- /dev/null
+++ b/layout/reftests/text-decoration/decoration-css21-ref.html
@@ -0,0 +1,30 @@
+<html>
+ <head>
+ <style>
+ .sup {vertical-align: super;}
+ .transparent {color: transparent;}
+ .alllines {text-decoration:line-through overline underline; color: purple;}
+ .highRel {position: relative; top: -4em;}
+ .lowRel {position: relative; top: 4em;}
+ .lowVert {vertical-align: -4em;}
+ .highVert {vertical-align: 4em;}
+ * { text-decoration-skip-ink: none;}
+ </style>
+ </head>
+ <body>
+ <p>
+ <span style="text-decoration: underline">Underlined <span class="transparent">still underlined</span></span>
+ <span style="text-decoration: underline">Underlined <span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></span>
+ <span class="sup transparent">Offset</span>
+ </p>
+ <p>
+ <span class="alllines">
+ Before<span class="transparent">highlow</span>After</span>
+ </span>
+ <span class="highVert transparent">Offset</span><span class="lowVert transparent">text</span>
+ </p>
+ <p>
+ <span class="alllines">Before</span><span class="highRel alllines">high</span><span class="lowRel alllines">low</span><span class="alllines">After</span>
+ </p>
+ </body>
+</html>
diff --git a/layout/reftests/text-decoration/decoration-css21.html b/layout/reftests/text-decoration/decoration-css21.html
new file mode 100644
index 0000000000..faaa1af362
--- /dev/null
+++ b/layout/reftests/text-decoration/decoration-css21.html
@@ -0,0 +1,30 @@
+<html>
+ <head>
+ <style>
+ .sup {vertical-align: super;}
+ .transparent {color: transparent;}
+ .alllines {text-decoration:line-through overline underline; color: purple;}
+ .highRel {position: relative; top: -4em;}
+ .lowRel {position: relative; top: 4em;}
+ .lowVert {vertical-align: -4em;}
+ .highVert {vertical-align: 4em;}
+ * { text-decoration-skip-ink: none;}
+ </style>
+ </head>
+ <body>
+ <p>
+ <span style="text-decoration: underline">Underlined <span class="sup transparent">still underlined</span></span>
+ <span style="text-decoration: underline">Underlined <span class="sup">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></span>
+ </p>
+ <p>
+ <span class="alllines">
+ Before<span class="highVert transparent">high</span><span class="lowVert transparent">low</span>After
+ </span>
+ </p>
+ <p>
+ <span class="alllines">
+ Before<span class="highRel">high</span><span class="lowRel">low</span>After</span>
+ </span>
+ </p>
+ </body>
+</html>
diff --git a/layout/reftests/text-decoration/decoration-style-quirks-ref.html b/layout/reftests/text-decoration/decoration-style-quirks-ref.html
new file mode 100644
index 0000000000..cc2ee3df07
--- /dev/null
+++ b/layout/reftests/text-decoration/decoration-style-quirks-ref.html
@@ -0,0 +1,54 @@
+<style>
+ p{
+ text-decoration-skip-ink: none;
+ }
+</style>
+<p>
+ Here is specified the decoration style as dotted but no decoration lines,
+ however,
+ <span style="font-size: 2em;
+ text-decoration: underline line-through overline;
+ text-decoration-style: solid;">
+ here has solid decoration lines</span>,
+ and here has no decoration lines.
+</p>
+<p>
+ Here is specified the decoration style as dashed but no decoration lines,
+ however,
+ <span style="font-size: 2em;
+ text-decoration: underline line-through overline;
+ text-decoration-style: dashed;">
+ here has inherited decoration lines</span>,
+ and here has no decoration lines.
+</p>
+<p>
+ <span style="text-decoration: underline line-through overline;
+ text-decoration-style: dotted;">
+ Here has dotted decoration lines,
+ </span><span style="text-decoration: underline line-through overline;
+ text-decoration-style: dotted">
+ <span style="font-size: 2em;
+ text-decoration: underline line-through overline;
+ text-decoration-style: wavy;">
+ here has wavy decoration
+ lines</span></span><span style="text-decoration: underline line-through overline;
+ text-decoration-style: dotted;">,
+ and here has dotted decoration lines.</span>
+</p>
+<p>
+ <span style="text-decoration: underline line-through overline;
+ text-decoration-style: double;">
+ Here has double decoration lines,
+ <span style="font-size: 2em;">
+ here is specified as dashed decoration lines but should be
+ ignored</span><span style="text-decoration: underline line-through overline;
+ text-decoration-style: double;">,
+ and here has double decoration lines.</span></span>
+</p>
+<p>
+ Here is specified the decoration style as -moz-none.
+</p>
+<p style="text-decoration: underline line-through overline;">
+ Here has solid decoration lines even if its style is specified as dotted
+ before text-decoration.
+</p>
diff --git a/layout/reftests/text-decoration/decoration-style-quirks.html b/layout/reftests/text-decoration/decoration-style-quirks.html
new file mode 100644
index 0000000000..a2c9bf6e62
--- /dev/null
+++ b/layout/reftests/text-decoration/decoration-style-quirks.html
@@ -0,0 +1,47 @@
+<style>
+ p{
+ text-decoration-skip-ink: none;
+ }
+</style>
+<p style="text-decoration-style: dotted;">
+ Here is specified the decoration style as dotted but no decoration lines, however,
+ <span style="font-size: 2em;
+ text-decoration: underline line-through overline;">
+ here has solid decoration lines</span>,
+ and here has no decoration lines.
+</p>
+<p style="text-decoration-style: dashed;">
+ Here is specified the decoration style as dashed but no decoration lines,
+ however,
+ <span style="font-size: 2em;
+ text-decoration: underline line-through overline;
+ text-decoration-style: inherit;">
+ here has inherited decoration lines</span>,
+ and here has no decoration lines.
+</p>
+<p style="text-decoration: underline line-through overline;
+ text-decoration-style: dotted;">
+ Here has dotted decoration lines,
+ <span style="font-size: 2em;
+ text-decoration: underline line-through overline;
+ text-decoration-style: wavy;">
+ here has wavy decoration lines</span>,
+ and here has dotted decoration lines.
+</p>
+<p style="text-decoration: underline line-through overline;
+ text-decoration-style: double;">
+ Here has double decoration lines,
+ <span style="font-size: 2em;
+ text-decoration-style: dashed;">
+ here is specified as dashed decoration lines but should be ignored</span>,
+ and here has double decoration lines.
+</p>
+<p style="text-decoration: underline line-through overline;
+ text-decoration-style: -moz-none;">
+ Here is specified the decoration style as -moz-none.
+</p>
+<p style="text-decoration-style: dotted;
+ text-decoration: underline line-through overline;">
+ Here has solid decoration lines even if its style is specified as dotted
+ before text-decoration.
+</p>
diff --git a/layout/reftests/text-decoration/decoration-style-standards-ref.html b/layout/reftests/text-decoration/decoration-style-standards-ref.html
new file mode 100644
index 0000000000..28d5c11754
--- /dev/null
+++ b/layout/reftests/text-decoration/decoration-style-standards-ref.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<p>
+ Here is specified the decoration style as dotted but no decoration lines,
+ however,
+ <span style="font-size: 2em;
+ text-decoration: underline line-through overline;
+ text-decoration-style: solid;">
+ here has solid decoration lines</span>,
+ and here has no decoration lines.
+</p>
+<p>
+ Here is specified the decoration style as dashed but no decoration lines,
+ however,
+ <span style="font-size: 2em;
+ text-decoration: underline line-through overline;
+ text-decoration-style: dashed;">
+ here has inherited decoration lines</span>,
+ and here has no decoration lines.
+</p>
+<p style="text-decoration: underline line-through overline;
+ text-decoration-style: double;">
+ Here has double decoration lines,
+ <span style="font-size: 2em;
+ text-decoration: none;">
+ here is specified as dashed decoration lines but should be ignored</span>,
+ and here has double decoration lines.
+</p>
+<p>
+ Here is specified the decoration style as -moz-none.
+</p>
+<p style="text-decoration: underline line-through overline;">
+ Here has solid decoration lines even if its style is specified as dotted
+ before text-decoration.
+</p>
diff --git a/layout/reftests/text-decoration/decoration-style-standards.html b/layout/reftests/text-decoration/decoration-style-standards.html
new file mode 100644
index 0000000000..4ad687e126
--- /dev/null
+++ b/layout/reftests/text-decoration/decoration-style-standards.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<p style="text-decoration-style: dotted;">
+ Here is specified the decoration style as dotted but no decoration lines,
+ however,
+ <span style="font-size: 2em;
+ text-decoration: underline line-through overline;">
+ here has solid decoration lines</span>, and here has no decoration lines.
+</p>
+<p style="text-decoration-style: dashed;">
+ Here is specified the decoration style as dashed but no decoration lines,
+ however,
+ <span style="font-size: 2em;
+ text-decoration: underline line-through overline;
+ text-decoration-style: inherit;">
+ here has inherited decoration lines</span>,
+ and here has no decoration lines.
+</p>
+<p style="text-decoration: underline line-through overline;
+ text-decoration-style: double;">
+ Here has double decoration lines,
+ <span style="font-size: 2em;
+ text-decoration-style: dashed;">
+ here is specified as dashed decoration lines but should be ignored</span>,
+ and here has double decoration lines.
+</p>
+<p style="text-decoration: underline line-through overline;
+ text-decoration-style: -moz-none;">
+ Here is specified the decoration style as -moz-none.
+</p>
+<p style="text-decoration-style: dotted;
+ text-decoration: underline line-through overline;">
+ Here has solid decoration lines even if its style is specified as dotted
+ before text-decoration.
+</p>
diff --git a/layout/reftests/text-decoration/dynamic-underline-vertical-align-quirks-1-ref.html b/layout/reftests/text-decoration/dynamic-underline-vertical-align-quirks-1-ref.html
new file mode 100644
index 0000000000..915f3a7bb8
--- /dev/null
+++ b/layout/reftests/text-decoration/dynamic-underline-vertical-align-quirks-1-ref.html
@@ -0,0 +1,21 @@
+<html>
+<head>
+<style>
+.underline {
+ text-decoration: underline;
+}
+.align-bottom {
+ vertical-align: bottom;
+}
+.align-top {
+ vertical-align: top;
+}
+</style>
+</head>
+<body>
+<p class="underline">
+<span class="align-bottom">This</span> line has a bottom vertical align span. <br />
+<span class="align-top">This</span> line has a top vertical align span.
+</p>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/dynamic-underline-vertical-align-quirks-1.html b/layout/reftests/text-decoration/dynamic-underline-vertical-align-quirks-1.html
new file mode 100644
index 0000000000..da84798e41
--- /dev/null
+++ b/layout/reftests/text-decoration/dynamic-underline-vertical-align-quirks-1.html
@@ -0,0 +1,26 @@
+<html class="reftest-wait">
+<head>
+<script type="text/javascript">
+function addUnderline() {
+ var element = document.getElementById("dynamicUnderline");
+ element.style.textDecoration = "underline";
+ document.documentElement.removeAttribute("class");
+}
+document.addEventListener('MozReftestInvalidate', addUnderline);
+</script>
+<style>
+.align-bottom {
+ vertical-align: bottom;
+}
+.align-top {
+ vertical-align: top;
+}
+</style>
+</head>
+<body>
+<p id="dynamicUnderline">
+<span class="align-bottom">This</span> line has a bottom vertical align span. <br />
+<span class="align-top">This</span> line has a top vertical align span.
+</p>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/dynamic-underline-vertical-align-quirks-2-ref.html b/layout/reftests/text-decoration/dynamic-underline-vertical-align-quirks-2-ref.html
new file mode 100644
index 0000000000..7a1ba472fe
--- /dev/null
+++ b/layout/reftests/text-decoration/dynamic-underline-vertical-align-quirks-2-ref.html
@@ -0,0 +1,21 @@
+<html>
+<head>
+<style>
+.underline {
+ text-decoration: underline;
+}
+.align-bottom {
+ vertical-align: bottom;
+}
+.align-top {
+ vertical-align: top;
+}
+</style>
+</head>
+<body>
+<p class="underline">
+<span class="align-bottom">This line has only a bottom vertical align span.</span> <br />
+<span class="align-top">This line has a top vertical align span.</span>
+</p>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/dynamic-underline-vertical-align-quirks-2.html b/layout/reftests/text-decoration/dynamic-underline-vertical-align-quirks-2.html
new file mode 100644
index 0000000000..9f0ca070a7
--- /dev/null
+++ b/layout/reftests/text-decoration/dynamic-underline-vertical-align-quirks-2.html
@@ -0,0 +1,26 @@
+<html class="reftest-wait">
+<head>
+<script type="text/javascript">
+function addUnderline() {
+ var element = document.getElementById("dynamicUnderline");
+ element.style.textDecoration = "underline";
+ document.documentElement.removeAttribute("class");
+}
+document.addEventListener('MozReftestInvalidate', addUnderline);
+</script>
+<style>
+.align-bottom {
+ vertical-align: bottom;
+}
+.align-top {
+ vertical-align: top;
+}
+</style>
+</head>
+<body>
+<p id="dynamicUnderline">
+<span class="align-bottom">This line has only a bottom vertical align span.</span> <br />
+<span class="align-top">This line has a top vertical align span.</span>
+</p>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/dynamic-underline-vertical-align-standards-1-ref.html b/layout/reftests/text-decoration/dynamic-underline-vertical-align-standards-1-ref.html
new file mode 100644
index 0000000000..01ba4d9b6c
--- /dev/null
+++ b/layout/reftests/text-decoration/dynamic-underline-vertical-align-standards-1-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html>
+<head>
+<style>
+.underline {
+ text-decoration: underline;
+}
+.align-bottom {
+ vertical-align: bottom;
+}
+.align-top {
+ vertical-align: top;
+}
+</style>
+</head>
+<body>
+<p class="underline">
+<span class="align-bottom">This</span> line has a bottom vertical align span. <br />
+<span class="align-top">This</span> line has a top vertical align span.
+</p>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/dynamic-underline-vertical-align-standards-1.html b/layout/reftests/text-decoration/dynamic-underline-vertical-align-standards-1.html
new file mode 100644
index 0000000000..64ca1f1252
--- /dev/null
+++ b/layout/reftests/text-decoration/dynamic-underline-vertical-align-standards-1.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+<head>
+<script type="text/javascript">
+function addUnderline() {
+ var element = document.getElementById("dynamicUnderline");
+ element.style.textDecoration = "underline";
+ document.documentElement.removeAttribute("class");
+}
+document.addEventListener('MozReftestInvalidate', addUnderline);
+</script>
+<style>
+.align-bottom {
+ vertical-align: bottom;
+}
+.align-top {
+ vertical-align: top;
+}
+</style>
+</head>
+<body>
+<p id="dynamicUnderline">
+<span class="align-bottom">This</span> line has a bottom vertical align span. <br />
+<span class="align-top">This</span> line has a top vertical align span.
+</p>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/dynamic-underline-vertical-align-standards-2-ref.html b/layout/reftests/text-decoration/dynamic-underline-vertical-align-standards-2-ref.html
new file mode 100644
index 0000000000..fb465cce22
--- /dev/null
+++ b/layout/reftests/text-decoration/dynamic-underline-vertical-align-standards-2-ref.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html>
+<head>
+<style>
+.underline {
+ text-decoration: underline;
+}
+.align-bottom {
+ vertical-align: bottom;
+}
+.align-top {
+ vertical-align: top;
+}
+</style>
+</head>
+<body>
+<p class="underline">
+<span class="align-bottom">This line has only a bottom vertical align span.</span> <br />
+<span class="align-top">This line has a top vertical align span.</span>
+</p>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/dynamic-underline-vertical-align-standards-2.html b/layout/reftests/text-decoration/dynamic-underline-vertical-align-standards-2.html
new file mode 100644
index 0000000000..d9b23e33fd
--- /dev/null
+++ b/layout/reftests/text-decoration/dynamic-underline-vertical-align-standards-2.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html class="reftest-wait">
+<head>
+<script type="text/javascript">
+function addUnderline() {
+ var element = document.getElementById("dynamicUnderline");
+ element.style.textDecoration = "underline";
+ document.documentElement.removeAttribute("class");
+}
+document.addEventListener('MozReftestInvalidate', addUnderline);
+</script>
+<style>
+.align-bottom {
+ vertical-align: bottom;
+}
+.align-top {
+ vertical-align: top;
+}
+</style>
+</head>
+<body>
+<p id="dynamicUnderline">
+<span class="align-bottom">This line has only a bottom vertical align span.</span> <br />
+<span class="align-top">This line has a top vertical align span.</span>
+</p>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/emphasis-style-dynamic-ref.html b/layout/reftests/text-decoration/emphasis-style-dynamic-ref.html
new file mode 100644
index 0000000000..786be94023
--- /dev/null
+++ b/layout/reftests/text-decoration/emphasis-style-dynamic-ref.html
@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="ja">
+<meta charset="UTF-8">
+<title>Bug 1229278 - Dynamic change to text-emphasis-style</title>
+<style>
+ div {
+ line-height: 5;
+ text-emphasis-style: filled triangle;
+ }
+</style>
+<div>テスト</div>
+</html>
diff --git a/layout/reftests/text-decoration/emphasis-style-dynamic.html b/layout/reftests/text-decoration/emphasis-style-dynamic.html
new file mode 100644
index 0000000000..3e9b920eb0
--- /dev/null
+++ b/layout/reftests/text-decoration/emphasis-style-dynamic.html
@@ -0,0 +1,20 @@
+<!doctype html>
+<html lang="ja" class="reftest-wait">
+<meta charset="UTF-8">
+<title>Bug 1229278 - Dynamic change to text-emphasis-style</title>
+<style>
+ div {
+ line-height: 5;
+ text-emphasis-style: filled triangle;
+ }
+ .reftest-wait div {
+ text-emphasis-style: filled circle;
+ }
+</style>
+<div>テスト</div>
+<script>
+ document.addEventListener("MozReftestInvalidate", function() {
+ document.documentElement.className = "";
+ });
+</script>
+</html>
diff --git a/layout/reftests/text-decoration/inline-baseline-almost-standards-ref.html b/layout/reftests/text-decoration/inline-baseline-almost-standards-ref.html
new file mode 100644
index 0000000000..4d193d6c99
--- /dev/null
+++ b/layout/reftests/text-decoration/inline-baseline-almost-standards-ref.html
@@ -0,0 +1,10 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
+ "http://www.w3.org/TR/html4/loose.dtd">
+<html>
+ <title>test for bug 223764 (Almost-standards)</title>
+ <body>
+ <p style="overflow: hidden; padding-bottom: 20px;">
+ <span style="font-size: 100px;"><span style="font-size: 20px">hello</span></span>
+ </p>
+ </body>
+</html>
diff --git a/layout/reftests/text-decoration/inline-baseline-almost-standards.html b/layout/reftests/text-decoration/inline-baseline-almost-standards.html
new file mode 100644
index 0000000000..71bdfc14b8
--- /dev/null
+++ b/layout/reftests/text-decoration/inline-baseline-almost-standards.html
@@ -0,0 +1,10 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
+ "http://www.w3.org/TR/html4/loose.dtd">
+<html>
+ <title>test for bug 223764 (Almost-standards)</title>
+ <body>
+ <p style="overflow: hidden; padding-bottom: 20px;">
+ <span style="font-size: 100px; text-decoration:underline"><span style="font-size: 20px">hello</span></span>
+ </p>
+ </body>
+</html>
diff --git a/layout/reftests/text-decoration/inline-baseline-quirks-ref.html b/layout/reftests/text-decoration/inline-baseline-quirks-ref.html
new file mode 100644
index 0000000000..a1f2bd5aea
--- /dev/null
+++ b/layout/reftests/text-decoration/inline-baseline-quirks-ref.html
@@ -0,0 +1,8 @@
+<html>
+ <title>test for bug 223764 (Quirks)</title>
+ <body>
+ <p style="overflow: hidden; padding-bottom: 20px;">
+ <span style="font-size: 100px;"><span style="font-size: 20px">hello</span></span>
+ </p>
+ </body>
+</html>
diff --git a/layout/reftests/text-decoration/inline-baseline-quirks.html b/layout/reftests/text-decoration/inline-baseline-quirks.html
new file mode 100644
index 0000000000..599b1e8da0
--- /dev/null
+++ b/layout/reftests/text-decoration/inline-baseline-quirks.html
@@ -0,0 +1,8 @@
+<html>
+ <title>test for bug 223764 (Quirks)</title>
+ <body>
+ <p style="overflow: hidden; padding-bottom: 20px;">
+ <span style="font-size: 100px; text-decoration:underline"><span style="font-size: 20px">hello</span></span>
+ </p>
+ </body>
+</html>
diff --git a/layout/reftests/text-decoration/line-through-style-block-dashed-quirks.html b/layout/reftests/text-decoration/line-through-style-block-dashed-quirks.html
new file mode 100644
index 0000000000..77503d4669
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-block-dashed-quirks.html
@@ -0,0 +1 @@
+<p style="text-decoration: line-through; text-decoration-style: dashed;">This paragraph has line-through</p>
diff --git a/layout/reftests/text-decoration/line-through-style-block-dashed-standards.html b/layout/reftests/text-decoration/line-through-style-block-dashed-standards.html
new file mode 100644
index 0000000000..782a237cb8
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-block-dashed-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p style="text-decoration: line-through; text-decoration-style: dashed;">This paragraph has line-through</p>
diff --git a/layout/reftests/text-decoration/line-through-style-block-dotted-quirks.html b/layout/reftests/text-decoration/line-through-style-block-dotted-quirks.html
new file mode 100644
index 0000000000..6e6741ccf6
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-block-dotted-quirks.html
@@ -0,0 +1 @@
+<p style="text-decoration: line-through; text-decoration-style: dotted;">This paragraph has line-through</p>
diff --git a/layout/reftests/text-decoration/line-through-style-block-dotted-standards.html b/layout/reftests/text-decoration/line-through-style-block-dotted-standards.html
new file mode 100644
index 0000000000..6151a80eed
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-block-dotted-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p style="text-decoration: line-through; text-decoration-style: dotted;">This paragraph has line-through</p>
diff --git a/layout/reftests/text-decoration/line-through-style-block-double-quirks.html b/layout/reftests/text-decoration/line-through-style-block-double-quirks.html
new file mode 100644
index 0000000000..47ea921443
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-block-double-quirks.html
@@ -0,0 +1 @@
+<p style="text-decoration: line-through; text-decoration-style: double;">This paragraph has line-through</p>
diff --git a/layout/reftests/text-decoration/line-through-style-block-double-standards.html b/layout/reftests/text-decoration/line-through-style-block-double-standards.html
new file mode 100644
index 0000000000..1439dcb791
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-block-double-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p style="text-decoration: line-through; text-decoration-style: double;">This paragraph has line-through</p>
diff --git a/layout/reftests/text-decoration/line-through-style-block-quirks-ref.html b/layout/reftests/text-decoration/line-through-style-block-quirks-ref.html
new file mode 100644
index 0000000000..53c4a2fd4a
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-block-quirks-ref.html
@@ -0,0 +1 @@
+<p style="text-decoration: line-through;">This paragraph has line-through</p>
diff --git a/layout/reftests/text-decoration/line-through-style-block-solid-quirks.html b/layout/reftests/text-decoration/line-through-style-block-solid-quirks.html
new file mode 100644
index 0000000000..0ff5cc0028
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-block-solid-quirks.html
@@ -0,0 +1 @@
+<p style="text-decoration: line-through; text-decoration-style: solid;">This paragraph has line-through</p>
diff --git a/layout/reftests/text-decoration/line-through-style-block-solid-standards.html b/layout/reftests/text-decoration/line-through-style-block-solid-standards.html
new file mode 100644
index 0000000000..9d49671152
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-block-solid-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p style="text-decoration: line-through; text-decoration-style: solid;">This paragraph has line-through</p>
diff --git a/layout/reftests/text-decoration/line-through-style-block-standards-ref.html b/layout/reftests/text-decoration/line-through-style-block-standards-ref.html
new file mode 100644
index 0000000000..cea0d3718b
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-block-standards-ref.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p style="text-decoration: line-through;">This paragraph has line-through</p>
diff --git a/layout/reftests/text-decoration/line-through-style-block-wavy-quirks.html b/layout/reftests/text-decoration/line-through-style-block-wavy-quirks.html
new file mode 100644
index 0000000000..437b2c3348
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-block-wavy-quirks.html
@@ -0,0 +1 @@
+<p style="text-decoration: line-through; text-decoration-style: wavy;">This paragraph has line-through</p>
diff --git a/layout/reftests/text-decoration/line-through-style-block-wavy-standards.html b/layout/reftests/text-decoration/line-through-style-block-wavy-standards.html
new file mode 100644
index 0000000000..f00c7a48f8
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-block-wavy-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p style="text-decoration: line-through; text-decoration-style: wavy;">This paragraph has line-through</p>
diff --git a/layout/reftests/text-decoration/line-through-style-inline-dashed-quirks.html b/layout/reftests/text-decoration/line-through-style-inline-dashed-quirks.html
new file mode 100644
index 0000000000..ae0e01e6d5
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-inline-dashed-quirks.html
@@ -0,0 +1 @@
+<p>This paragraph has no decoration lines, but <span style="text-decoration: line-through; text-decoration-style: dashed;">here has line-through</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/line-through-style-inline-dashed-standards.html b/layout/reftests/text-decoration/line-through-style-inline-dashed-standards.html
new file mode 100644
index 0000000000..588f85e2d8
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-inline-dashed-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p>This paragraph has no decoration lines, but <span style="text-decoration: line-through; text-decoration-style: dashed;">here has line-through</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/line-through-style-inline-dotted-quirks.html b/layout/reftests/text-decoration/line-through-style-inline-dotted-quirks.html
new file mode 100644
index 0000000000..f47816e564
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-inline-dotted-quirks.html
@@ -0,0 +1 @@
+<p>This paragraph has no decoration lines, but <span style="text-decoration: line-through; text-decoration-style: dotted;">here has line-through</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/line-through-style-inline-dotted-standards.html b/layout/reftests/text-decoration/line-through-style-inline-dotted-standards.html
new file mode 100644
index 0000000000..1096674d40
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-inline-dotted-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p>This paragraph has no decoration lines, but <span style="text-decoration: line-through; text-decoration-style: dotted;">here has line-through</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/line-through-style-inline-double-quirks.html b/layout/reftests/text-decoration/line-through-style-inline-double-quirks.html
new file mode 100644
index 0000000000..9daf8458c1
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-inline-double-quirks.html
@@ -0,0 +1 @@
+<p>This paragraph has no decoration lines, but <span style="text-decoration: line-through; text-decoration-style: double;">here has line-through</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/line-through-style-inline-double-standards.html b/layout/reftests/text-decoration/line-through-style-inline-double-standards.html
new file mode 100644
index 0000000000..2db67bd36d
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-inline-double-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p>This paragraph has no decoration lines, but <span style="text-decoration: line-through; text-decoration-style: double;">here has line-through</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/line-through-style-inline-quirks-ref.html b/layout/reftests/text-decoration/line-through-style-inline-quirks-ref.html
new file mode 100644
index 0000000000..789426b018
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-inline-quirks-ref.html
@@ -0,0 +1 @@
+<p>This paragraph has no decoration lines, but <span style="text-decoration: line-through;">here has line-through</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/line-through-style-inline-solid-quirks.html b/layout/reftests/text-decoration/line-through-style-inline-solid-quirks.html
new file mode 100644
index 0000000000..746f67ce15
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-inline-solid-quirks.html
@@ -0,0 +1 @@
+<p>This paragraph has no decoration lines, but <span style="text-decoration: line-through; text-decoration-style: solid;">here has line-through</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/line-through-style-inline-solid-standards.html b/layout/reftests/text-decoration/line-through-style-inline-solid-standards.html
new file mode 100644
index 0000000000..a59ba91fb4
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-inline-solid-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p>This paragraph has no decoration lines, but <span style="text-decoration: line-through; text-decoration-style: solid;">here has line-through</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/line-through-style-inline-standards-ref.html b/layout/reftests/text-decoration/line-through-style-inline-standards-ref.html
new file mode 100644
index 0000000000..8b401685f8
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-inline-standards-ref.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p>This paragraph has no decoration lines, but <span style="text-decoration: line-through;">here has line-through</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/line-through-style-inline-wavy-quirks.html b/layout/reftests/text-decoration/line-through-style-inline-wavy-quirks.html
new file mode 100644
index 0000000000..1f89c11ef4
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-inline-wavy-quirks.html
@@ -0,0 +1 @@
+<p>This paragraph has no decoration lines, but <span style="text-decoration: line-through; text-decoration-style: wavy;">here has line-through</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/line-through-style-inline-wavy-standards.html b/layout/reftests/text-decoration/line-through-style-inline-wavy-standards.html
new file mode 100644
index 0000000000..6914b74542
--- /dev/null
+++ b/layout/reftests/text-decoration/line-through-style-inline-wavy-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p>This paragraph has no decoration lines, but <span style="text-decoration: line-through; text-decoration-style: wavy;">here has line-through</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/overline-style-block-dashed-quirks.html b/layout/reftests/text-decoration/overline-style-block-dashed-quirks.html
new file mode 100644
index 0000000000..09b78f7117
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-block-dashed-quirks.html
@@ -0,0 +1 @@
+<p style="text-decoration: overline; text-decoration-style: dashed;">This paragraph has overline</p>
diff --git a/layout/reftests/text-decoration/overline-style-block-dashed-standards.html b/layout/reftests/text-decoration/overline-style-block-dashed-standards.html
new file mode 100644
index 0000000000..9204157cfb
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-block-dashed-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p style="text-decoration: overline; text-decoration-style: dashed;">This paragraph has overline</p>
diff --git a/layout/reftests/text-decoration/overline-style-block-dotted-quirks.html b/layout/reftests/text-decoration/overline-style-block-dotted-quirks.html
new file mode 100644
index 0000000000..5f8d676e88
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-block-dotted-quirks.html
@@ -0,0 +1 @@
+<p style="text-decoration: overline; text-decoration-style: dotted;">This paragraph has overline</p>
diff --git a/layout/reftests/text-decoration/overline-style-block-dotted-standards.html b/layout/reftests/text-decoration/overline-style-block-dotted-standards.html
new file mode 100644
index 0000000000..b653753b42
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-block-dotted-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p style="text-decoration: overline; text-decoration-style: dotted;">This paragraph has overline</p>
diff --git a/layout/reftests/text-decoration/overline-style-block-double-quirks.html b/layout/reftests/text-decoration/overline-style-block-double-quirks.html
new file mode 100644
index 0000000000..37bb368007
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-block-double-quirks.html
@@ -0,0 +1 @@
+<p style="text-decoration: overline; text-decoration-style: double;">This paragraph has overline</p>
diff --git a/layout/reftests/text-decoration/overline-style-block-double-standards.html b/layout/reftests/text-decoration/overline-style-block-double-standards.html
new file mode 100644
index 0000000000..2bce4cc1d7
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-block-double-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p style="text-decoration: overline; text-decoration-style: double;">This paragraph has overline</p>
diff --git a/layout/reftests/text-decoration/overline-style-block-quirks-ref.html b/layout/reftests/text-decoration/overline-style-block-quirks-ref.html
new file mode 100644
index 0000000000..07353927d9
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-block-quirks-ref.html
@@ -0,0 +1 @@
+<p style="text-decoration: overline;">This paragraph has overline</p>
diff --git a/layout/reftests/text-decoration/overline-style-block-solid-quirks.html b/layout/reftests/text-decoration/overline-style-block-solid-quirks.html
new file mode 100644
index 0000000000..b8d6f30c97
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-block-solid-quirks.html
@@ -0,0 +1 @@
+<p style="text-decoration: overline; text-decoration-style: solid;">This paragraph has overline</p>
diff --git a/layout/reftests/text-decoration/overline-style-block-solid-standards.html b/layout/reftests/text-decoration/overline-style-block-solid-standards.html
new file mode 100644
index 0000000000..e795637836
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-block-solid-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p style="text-decoration: overline; text-decoration-style: solid;">This paragraph has overline</p>
diff --git a/layout/reftests/text-decoration/overline-style-block-standards-ref.html b/layout/reftests/text-decoration/overline-style-block-standards-ref.html
new file mode 100644
index 0000000000..c349ca362f
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-block-standards-ref.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p style="text-decoration: overline;">This paragraph has overline</p>
diff --git a/layout/reftests/text-decoration/overline-style-block-wavy-quirks.html b/layout/reftests/text-decoration/overline-style-block-wavy-quirks.html
new file mode 100644
index 0000000000..b3e159e320
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-block-wavy-quirks.html
@@ -0,0 +1 @@
+<p style="text-decoration: overline; text-decoration-style: wavy;">This paragraph has overline</p>
diff --git a/layout/reftests/text-decoration/overline-style-block-wavy-standards.html b/layout/reftests/text-decoration/overline-style-block-wavy-standards.html
new file mode 100644
index 0000000000..ac34fc5ac1
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-block-wavy-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p style="text-decoration: overline; text-decoration-style: wavy;">This paragraph has overline</p>
diff --git a/layout/reftests/text-decoration/overline-style-inline-dashed-quirks.html b/layout/reftests/text-decoration/overline-style-inline-dashed-quirks.html
new file mode 100644
index 0000000000..bed18d95a6
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-inline-dashed-quirks.html
@@ -0,0 +1 @@
+<p>This paragraph has no decoration lines, but <span style="text-decoration: overline; text-decoration-style: dashed;">here has overline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/overline-style-inline-dashed-standards.html b/layout/reftests/text-decoration/overline-style-inline-dashed-standards.html
new file mode 100644
index 0000000000..a5ce662f38
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-inline-dashed-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p>This paragraph has no decoration lines, but <span style="text-decoration: overline; text-decoration-style: dashed;">here has overline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/overline-style-inline-dotted-quirks.html b/layout/reftests/text-decoration/overline-style-inline-dotted-quirks.html
new file mode 100644
index 0000000000..fd8bcf88ad
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-inline-dotted-quirks.html
@@ -0,0 +1 @@
+<p>This paragraph has no decoration lines, but <span style="text-decoration: overline; text-decoration-style: dotted;">here has overline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/overline-style-inline-dotted-standards.html b/layout/reftests/text-decoration/overline-style-inline-dotted-standards.html
new file mode 100644
index 0000000000..be2f98c755
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-inline-dotted-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p>This paragraph has no decoration lines, but <span style="text-decoration: overline; text-decoration-style: dotted;">here has overline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/overline-style-inline-double-quirks.html b/layout/reftests/text-decoration/overline-style-inline-double-quirks.html
new file mode 100644
index 0000000000..a481122aee
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-inline-double-quirks.html
@@ -0,0 +1 @@
+<p>This paragraph has no decoration lines, but <span style="text-decoration: overline; text-decoration-style: double;">here has overline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/overline-style-inline-double-standards.html b/layout/reftests/text-decoration/overline-style-inline-double-standards.html
new file mode 100644
index 0000000000..b305725016
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-inline-double-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p>This paragraph has no decoration lines, but <span style="text-decoration: overline; text-decoration-style: double;">here has overline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/overline-style-inline-quirks-ref.html b/layout/reftests/text-decoration/overline-style-inline-quirks-ref.html
new file mode 100644
index 0000000000..a0a2c6c3f7
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-inline-quirks-ref.html
@@ -0,0 +1 @@
+<p>This paragraph has no decoration lines, but <span style="text-decoration: overline;">here has overline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/overline-style-inline-solid-quirks.html b/layout/reftests/text-decoration/overline-style-inline-solid-quirks.html
new file mode 100644
index 0000000000..fb9b72332f
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-inline-solid-quirks.html
@@ -0,0 +1 @@
+<p>This paragraph has no decoration lines, but <span style="text-decoration: overline; text-decoration-style: solid;">here has overline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/overline-style-inline-solid-standards.html b/layout/reftests/text-decoration/overline-style-inline-solid-standards.html
new file mode 100644
index 0000000000..d02f2021e2
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-inline-solid-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p>This paragraph has no decoration lines, but <span style="text-decoration: overline; text-decoration-style: solid;">here has overline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/overline-style-inline-standards-ref.html b/layout/reftests/text-decoration/overline-style-inline-standards-ref.html
new file mode 100644
index 0000000000..c4890983a8
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-inline-standards-ref.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p>This paragraph has no decoration lines, but <span style="text-decoration: overline;">here has overline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/overline-style-inline-wavy-quirks.html b/layout/reftests/text-decoration/overline-style-inline-wavy-quirks.html
new file mode 100644
index 0000000000..6b1829c7d9
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-inline-wavy-quirks.html
@@ -0,0 +1 @@
+<p>This paragraph has no decoration lines, but <span style="text-decoration: overline; text-decoration-style: wavy;">here has overline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/overline-style-inline-wavy-standards.html b/layout/reftests/text-decoration/overline-style-inline-wavy-standards.html
new file mode 100644
index 0000000000..bd8e24268a
--- /dev/null
+++ b/layout/reftests/text-decoration/overline-style-inline-wavy-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p>This paragraph has no decoration lines, but <span style="text-decoration: overline; text-decoration-style: wavy;">here has overline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/reftest.list b/layout/reftests/text-decoration/reftest.list
new file mode 100644
index 0000000000..c4094dc7c5
--- /dev/null
+++ b/layout/reftests/text-decoration/reftest.list
@@ -0,0 +1,123 @@
+fuzzy-if(gtkWidget,0-208,0-12) == complex-decoration-style-quirks.html complex-decoration-style-quirks-ref.html
+fuzzy-if(gtkWidget,0-208,0-12) == complex-decoration-style-standards.html complex-decoration-style-standards-ref.html
+== decoration-color-quirks.html decoration-color-quirks-ref.html
+== decoration-color-standards.html decoration-color-standards-ref.html
+== decoration-style-quirks.html decoration-style-quirks-ref.html
+== decoration-style-standards.html decoration-style-standards-ref.html
+== dynamic-underline-vertical-align-quirks-1.html dynamic-underline-vertical-align-quirks-1-ref.html
+== dynamic-underline-vertical-align-standards-1.html dynamic-underline-vertical-align-standards-1-ref.html
+== dynamic-underline-vertical-align-quirks-2.html dynamic-underline-vertical-align-quirks-2-ref.html
+== dynamic-underline-vertical-align-standards-2.html dynamic-underline-vertical-align-standards-2-ref.html
+== line-through-style-block-solid-quirks.html line-through-style-block-quirks-ref.html
+!= line-through-style-block-dotted-quirks.html line-through-style-block-quirks-ref.html
+!= line-through-style-block-dashed-quirks.html line-through-style-block-quirks-ref.html
+!= line-through-style-block-double-quirks.html line-through-style-block-quirks-ref.html
+!= line-through-style-block-wavy-quirks.html line-through-style-block-quirks-ref.html
+== line-through-style-inline-solid-quirks.html line-through-style-inline-quirks-ref.html
+!= line-through-style-inline-dotted-quirks.html line-through-style-inline-quirks-ref.html
+!= line-through-style-inline-dashed-quirks.html line-through-style-inline-quirks-ref.html
+!= line-through-style-inline-double-quirks.html line-through-style-inline-quirks-ref.html
+!= line-through-style-inline-wavy-quirks.html line-through-style-inline-quirks-ref.html
+== line-through-style-block-solid-standards.html line-through-style-block-standards-ref.html
+!= line-through-style-block-dotted-standards.html line-through-style-block-standards-ref.html
+!= line-through-style-block-dashed-standards.html line-through-style-block-standards-ref.html
+!= line-through-style-block-double-standards.html line-through-style-block-standards-ref.html
+!= line-through-style-block-wavy-standards.html line-through-style-block-standards-ref.html
+== line-through-style-inline-solid-standards.html line-through-style-inline-standards-ref.html
+!= line-through-style-inline-dotted-standards.html line-through-style-inline-standards-ref.html
+!= line-through-style-inline-dashed-standards.html line-through-style-inline-standards-ref.html
+!= line-through-style-inline-double-standards.html line-through-style-inline-standards-ref.html
+!= line-through-style-inline-wavy-standards.html line-through-style-inline-standards-ref.html
+== overline-style-block-solid-quirks.html overline-style-block-quirks-ref.html
+!= overline-style-block-dotted-quirks.html overline-style-block-quirks-ref.html
+!= overline-style-block-dashed-quirks.html overline-style-block-quirks-ref.html
+!= overline-style-block-double-quirks.html overline-style-block-quirks-ref.html
+!= overline-style-block-wavy-quirks.html overline-style-block-quirks-ref.html
+== overline-style-inline-solid-quirks.html overline-style-inline-quirks-ref.html
+!= overline-style-inline-dotted-quirks.html overline-style-inline-quirks-ref.html
+!= overline-style-inline-dashed-quirks.html overline-style-inline-quirks-ref.html
+!= overline-style-inline-double-quirks.html overline-style-inline-quirks-ref.html
+!= overline-style-inline-wavy-quirks.html overline-style-inline-quirks-ref.html
+== overline-style-block-solid-standards.html overline-style-block-standards-ref.html
+!= overline-style-block-dotted-standards.html overline-style-block-standards-ref.html
+!= overline-style-block-dashed-standards.html overline-style-block-standards-ref.html
+!= overline-style-block-double-standards.html overline-style-block-standards-ref.html
+!= overline-style-block-wavy-standards.html overline-style-block-standards-ref.html
+== overline-style-inline-solid-standards.html overline-style-inline-standards-ref.html
+!= overline-style-inline-dotted-standards.html overline-style-inline-standards-ref.html
+!= overline-style-inline-dashed-standards.html overline-style-inline-standards-ref.html
+!= overline-style-inline-double-standards.html overline-style-inline-standards-ref.html
+!= overline-style-inline-wavy-standards.html overline-style-inline-standards-ref.html
+== underline-style-block-solid-quirks.html underline-style-block-quirks-ref.html
+!= underline-style-block-dotted-quirks.html underline-style-block-quirks-ref.html
+!= underline-style-block-dashed-quirks.html underline-style-block-quirks-ref.html
+!= underline-style-block-double-quirks.html underline-style-block-quirks-ref.html
+!= underline-style-block-wavy-quirks.html underline-style-block-quirks-ref.html
+== underline-style-inline-solid-quirks.html underline-style-inline-quirks-ref.html
+!= underline-style-inline-dotted-quirks.html underline-style-inline-quirks-ref.html
+!= underline-style-inline-dashed-quirks.html underline-style-inline-quirks-ref.html
+!= underline-style-inline-double-quirks.html underline-style-inline-quirks-ref.html
+!= underline-style-inline-wavy-quirks.html underline-style-inline-quirks-ref.html
+== underline-style-block-solid-standards.html underline-style-block-standards-ref.html
+!= underline-style-block-dotted-standards.html underline-style-block-standards-ref.html
+!= underline-style-block-dashed-standards.html underline-style-block-standards-ref.html
+!= underline-style-block-double-standards.html underline-style-block-standards-ref.html
+!= underline-style-block-wavy-standards.html underline-style-block-standards-ref.html
+== underline-style-inline-solid-standards.html underline-style-inline-standards-ref.html
+!= underline-style-inline-dotted-standards.html underline-style-inline-standards-ref.html
+!= underline-style-inline-dashed-standards.html underline-style-inline-standards-ref.html
+!= underline-style-inline-double-standards.html underline-style-inline-standards-ref.html
+!= underline-style-inline-wavy-standards.html underline-style-inline-standards-ref.html
+== underline-block-quirks.html underline-block-quirks-ref.html
+!= underline-block-quirks.html underline-block-quirks-notref.html
+== underline-inline-block-quirks.html underline-inline-block-quirks-ref.html
+!= underline-inline-block-quirks.html underline-inline-block-quirks-notref.html
+== underline-table-caption-quirks.html underline-table-caption-quirks-ref.html
+!= underline-table-caption-quirks.html underline-table-caption-quirks-notref.html
+== underline-table-cell-quirks.html underline-table-cell-quirks-ref.html
+!= underline-table-cell-quirks.html underline-table-cell-quirks-notref.html
+== underline-block-propagation-quirks.html underline-block-propagation-quirks-ref.html
+== underline-block-propagation-2-quirks.html underline-block-propagation-2-quirks-ref.html
+== underline-block-standards.html underline-block-standards-ref.html
+!= underline-block-standards.html underline-block-standards-notref.html
+== underline-inline-block-standards.html underline-inline-block-standards-ref.html
+!= underline-inline-block-standards.html underline-inline-block-standards-notref.html
+== underline-table-caption-standards.html underline-table-caption-standards-ref.html
+!= underline-table-caption-standards.html underline-table-caption-standards-notref.html
+== underline-table-cell-standards.html underline-table-cell-standards-ref.html
+!= underline-table-cell-standards.html underline-table-cell-standards-notref.html
+== underline-block-propagation-standards.html underline-block-propagation-standards-ref.html
+== underline-block-propagation-2-standards.html underline-block-propagation-2-standards-ref.html
+== text-decoration-zorder-1-standards.html text-decoration-zorder-1-ref.html
+== text-decoration-zorder-1-quirks.html text-decoration-zorder-1-ref.html
+== table-quirk-1.html table-quirk-1-ref.html
+== table-quirk-2.html table-quirk-2-ref.html
+== text-decoration-propagation-1-quirks.html text-decoration-propagation-1-quirks-ref.html
+== text-decoration-propagation-1-standards.html text-decoration-propagation-1-standards-ref.html
+== 641444-1.html 641444-1-ref.html
+== decoration-css21.html decoration-css21-ref.html
+fuzzy-if(cocoaWidget,0-1,0-5) == decoration-color-override-quirks.html decoration-color-override-quirks-ref.html
+== decoration-color-override-standards.html decoration-color-override-standards-ref.html
+!= decoration-color-override-standards-ref.html decoration-color-override-quirks-ref.html
+== decoration-css21-block.html decoration-css21-block-ref.html
+!= inline-baseline-almost-standards.html inline-baseline-almost-standards-ref.html
+!= inline-baseline-quirks.html inline-baseline-quirks-ref.html
+== 676538-1.html 676538-1-ref.html
+== underline-button-1.html underline-button-1-ref.html
+== underline-button-2.html underline-button-2-ref.html
+fuzzy(0-4,0-2) == underline-select-1.html underline-select-1-ref.html
+== underline-select-2.html underline-select-2-ref.html
+== 1133392.html 1133392-ref.html
+!= 1159729-offset-adjustment.html 1159729-offset-adjustment-notref.html
+== emphasis-style-dynamic.html emphasis-style-dynamic-ref.html
+== vertical-mode-decorations-1.html vertical-mode-decorations-1-ref.html
+fuzzy-if(Android,0-238,0-36) == vertical-mode-decorations-2.html vertical-mode-decorations-2-ref.html
+!= 1415214.html 1415214-notref.html
+== skip-ink-multiline-position.html skip-ink-multiline-position-ref.html
+== skip-ink-vertical-align.html skip-ink-vertical-align-ref.html
+!= skip-ink-vertical-align-2.html skip-ink-vertical-align-2-notref.html
+fuzzy(0-94,0-4) == skip-ink-cjk-1.html skip-ink-cjk-1-ref.html
+== skip-ink-cjk-2.html skip-ink-cjk-2-ref.html
+== skip-ink-cjk-3.html skip-ink-cjk-3-ref.html
+!= always-underline-links.html always-underline-links-ref.html
+pref(layout.css.always_underline_links,true) == always-underline-links.html always-underline-links-ref.html
diff --git a/layout/reftests/text-decoration/skip-ink-cjk-1-ref.html b/layout/reftests/text-decoration/skip-ink-cjk-1-ref.html
new file mode 100644
index 0000000000..fd0a816f01
--- /dev/null
+++ b/layout/reftests/text-decoration/skip-ink-cjk-1-ref.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="ja">
+<meta charset="utf-8">
+<style>
+body {
+ font: 16px/2 sans-serif;
+}
+.test {
+ font: 32px sans-serif;
+ text-decoration: 2px red underline;
+ text-underline-offset: 1px;
+}
+span {
+ text-decoration-skip-ink: none;
+}
+</style>
+<div>The underline should skip descenders on the English but not the Japanese:</div>
+<div class=test>skipping <span>土砂災害警戒情報</span> skipping</div>
diff --git a/layout/reftests/text-decoration/skip-ink-cjk-1.html b/layout/reftests/text-decoration/skip-ink-cjk-1.html
new file mode 100644
index 0000000000..3dbe2c7f6b
--- /dev/null
+++ b/layout/reftests/text-decoration/skip-ink-cjk-1.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="ja">
+<meta charset="utf-8">
+<style>
+body {
+ font: 16px/2 sans-serif;
+}
+.test {
+ font: 32px sans-serif;
+ text-decoration: 2px red underline;
+ text-underline-offset: 1px;
+}
+</style>
+<div>The underline should skip descenders on the English but not the Japanese:</div>
+<div class=test>skipping 土砂災害警戒情報 skipping</div>
diff --git a/layout/reftests/text-decoration/skip-ink-cjk-2-ref.html b/layout/reftests/text-decoration/skip-ink-cjk-2-ref.html
new file mode 100644
index 0000000000..2e28752e15
--- /dev/null
+++ b/layout/reftests/text-decoration/skip-ink-cjk-2-ref.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="ja">
+<!-- lang=ja will cause the default japanese font to be used throughout -->
+<meta charset="utf-8">
+<style>
+body {
+ font: 16px/2 sans-serif;
+}
+.test {
+ font: 32px sans-serif;
+ text-decoration: 2px red underline;
+ text-underline-offset: -1px; /* make underline clash with digits etc */
+ text-decoration-skip-ink: none;
+}
+</style>
+<div>The underline should not skip-ink in Japanese runs, even on embedded "common" characters:</div>
+<div class=test>黄砂情報 実況図 / 予測図</div>
+<div class=test>気象衛星 10分ごと / 2.5分ごと</div>
+<div class=test>レーダー•ナウキャスト(降水•雷•竜巻)</div>
diff --git a/layout/reftests/text-decoration/skip-ink-cjk-2.html b/layout/reftests/text-decoration/skip-ink-cjk-2.html
new file mode 100644
index 0000000000..5d180d57c3
--- /dev/null
+++ b/layout/reftests/text-decoration/skip-ink-cjk-2.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="ja">
+<!-- lang=ja will cause the default japanese font to be used throughout -->
+<meta charset="utf-8">
+<style>
+body {
+ font: 16px/2 sans-serif;
+}
+.test {
+ font: 32px sans-serif;
+ text-decoration: 2px red underline;
+ text-underline-offset: -1px; /* make underline clash with digits etc */
+}
+</style>
+<div>The underline should not skip-ink in Japanese runs, even on embedded "common" characters:</div>
+<div class=test>黄砂情報 実況図 / 予測図</div>
+<div class=test>気象衛星 10分ごと / 2.5分ごと</div>
+<div class=test>レーダー•ナウキャスト(降水•雷•竜巻)</div>
diff --git a/layout/reftests/text-decoration/skip-ink-cjk-3-ref.html b/layout/reftests/text-decoration/skip-ink-cjk-3-ref.html
new file mode 100644
index 0000000000..49829ffb6a
--- /dev/null
+++ b/layout/reftests/text-decoration/skip-ink-cjk-3-ref.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+<!-- lang=en will result in a mix of western and japanese fonts -->
+<meta charset="utf-8">
+<style>
+body {
+ font: 16px/2 sans-serif;
+}
+.test {
+ font: 32px sans-serif;
+ text-decoration: 2px red underline;
+ text-underline-offset: -1px; /* make underline clash with digits etc */
+ text-decoration-skip-ink: none;
+}
+</style>
+<div>The underline should not skip-ink in Japanese runs, even on embedded "common" characters:</div>
+<div class=test>黄砂情報 実況図 / 予測図</div>
+<div class=test>気象衛星 10分ごと / 2.5分ごと</div>
+<div class=test>レーダー•ナウキャスト(降水•雷•竜巻)</div>
diff --git a/layout/reftests/text-decoration/skip-ink-cjk-3.html b/layout/reftests/text-decoration/skip-ink-cjk-3.html
new file mode 100644
index 0000000000..7782f74929
--- /dev/null
+++ b/layout/reftests/text-decoration/skip-ink-cjk-3.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<!-- lang=en will result in a mix of western and japanese fonts -->
+<meta charset="utf-8">
+<style>
+body {
+ font: 16px/2 sans-serif;
+}
+.test {
+ font: 32px sans-serif;
+ text-decoration: 2px red underline;
+ text-underline-offset: -1px; /* make underline clash with digits etc */
+}
+</style>
+<div>The underline should not skip-ink in Japanese runs, even on embedded "common" characters:</div>
+<div class=test>黄砂情報 実況図 / 予測図</div>
+<div class=test>気象衛星 10分ごと / 2.5分ごと</div>
+<div class=test>レーダー•ナウキャスト(降水•雷•竜巻)</div>
diff --git a/layout/reftests/text-decoration/skip-ink-multiline-position-ref.html b/layout/reftests/text-decoration/skip-ink-multiline-position-ref.html
new file mode 100644
index 0000000000..5d264244ad
--- /dev/null
+++ b/layout/reftests/text-decoration/skip-ink-multiline-position-ref.html
@@ -0,0 +1,26 @@
+<!DOCTYPE HTML>
+<html>
+ <head>
+ <meta charset="utf-8">
+ <title>Reference case for text-decoration-skip-ink: text on the second line should not change the position of the first line's underline</title>
+ <style>
+ @font-face {
+ font-family: awami;
+ src: url("../fonts/AwamiNastaliq-Regular.woff");
+ }
+ div{
+ font: 36px/2 awami, sans-serif;
+ unicode-bidi:bidi-override;
+ width: 70px;
+ height: 70px;
+ overflow: hidden;
+ text-decoration: red underline;
+ text-underline-offset: -0.5em;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Adding more characters on the second line should not affect the position of the underline on line one. <br>See <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1572302"> Bug 1572302</a> </p>
+ <div dir="rtl">fی sعلي</div>
+ </body>
+</html>
diff --git a/layout/reftests/text-decoration/skip-ink-multiline-position.html b/layout/reftests/text-decoration/skip-ink-multiline-position.html
new file mode 100644
index 0000000000..ab7dcefa62
--- /dev/null
+++ b/layout/reftests/text-decoration/skip-ink-multiline-position.html
@@ -0,0 +1,26 @@
+<!DOCTYPE HTML>
+<html>
+ <head>
+ <meta charset="utf-8">
+ <title>Test case for text-decoration-skip-ink: text on the second line should not change the position of the first line's underline</title>
+ <style>
+ @font-face {
+ font-family: awami;
+ src: url("../fonts/AwamiNastaliq-Regular.woff");
+ }
+ div{
+ font: 36px/2 awami, sans-serif;
+ unicode-bidi:bidi-override;
+ width: 70px;
+ height: 70px;
+ overflow: hidden;
+ text-decoration: red underline;
+ text-underline-offset: -0.5em;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Adding more characters on the second line should not affect the position of the underline on line one. <br>See <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1572302"> Bug 1572302</a> </p>
+ <div dir="rtl">fی علي</div>
+ </body>
+</html>
diff --git a/layout/reftests/text-decoration/skip-ink-vertical-align-2-notref.html b/layout/reftests/text-decoration/skip-ink-vertical-align-2-notref.html
new file mode 100644
index 0000000000..191490ca5c
--- /dev/null
+++ b/layout/reftests/text-decoration/skip-ink-vertical-align-2-notref.html
@@ -0,0 +1,5 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<p>Underline should skip over the subscripted 'x'</p>
+<div style="font:36px serif; color:rgba(0,0,255,0.5);">
+ <u style="text-decoration-color:red;text-decoration-skip-ink:none;">xx<sub>x</sub>xx</u></div>
diff --git a/layout/reftests/text-decoration/skip-ink-vertical-align-2.html b/layout/reftests/text-decoration/skip-ink-vertical-align-2.html
new file mode 100644
index 0000000000..0ee9582700
--- /dev/null
+++ b/layout/reftests/text-decoration/skip-ink-vertical-align-2.html
@@ -0,0 +1,5 @@
+<!DOCTYPE html>
+<meta charset=utf-8>
+<p>Underline should skip over the subscripted 'x'</p>
+<div style="font:36px serif; color:rgba(0,0,255,0.5);">
+ <u style="text-decoration-color:red;">xx<sub>x</sub>xx</u></div>
diff --git a/layout/reftests/text-decoration/skip-ink-vertical-align-ref.html b/layout/reftests/text-decoration/skip-ink-vertical-align-ref.html
new file mode 100644
index 0000000000..ea4952ab29
--- /dev/null
+++ b/layout/reftests/text-decoration/skip-ink-vertical-align-ref.html
@@ -0,0 +1,20 @@
+<!DOCTYPE HTML>
+<html>
+ <head>
+ <title>Reference case for text-decoration-skip-ink: skip-ink should detect and work with vertical-align</title>
+ <style>
+ div{
+ font: 48px/2 Times;
+ text-decoration: purple underline;
+ text-decoration-skip-ink: none;
+ }
+ span{
+ vertical-align: super;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Ink should not be skipped when vertical-align moves text away from the underline</p>
+ <div>test <span>pgqy</span> test</div>
+ </body>
+</html>
diff --git a/layout/reftests/text-decoration/skip-ink-vertical-align.html b/layout/reftests/text-decoration/skip-ink-vertical-align.html
new file mode 100644
index 0000000000..72932f95ef
--- /dev/null
+++ b/layout/reftests/text-decoration/skip-ink-vertical-align.html
@@ -0,0 +1,19 @@
+<!DOCTYPE HTML>
+<html>
+ <head>
+ <title>Test case for text-decoration-skip-ink: skip-ink should detect and work with vertical-align</title>
+ <style>
+ div{
+ font: 48px/2 Times;
+ text-decoration: purple underline;
+ }
+ span{
+ vertical-align: super;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Ink should not be skipped when vertical-align moves text away from the underline</p>
+ <div>test <span>pgqy</span> test</div>
+ </body>
+</html>
diff --git a/layout/reftests/text-decoration/table-quirk-1-ref.html b/layout/reftests/text-decoration/table-quirk-1-ref.html
new file mode 100644
index 0000000000..844ec63e85
--- /dev/null
+++ b/layout/reftests/text-decoration/table-quirk-1-ref.html
@@ -0,0 +1,7 @@
+<title>text-decoration quirk on tables (Bug 572713)</title>
+
+<div><table><tbody><tr><td>text-decoration on container of table</td></tr></tbody></table></div>
+<div><table><tbody><tr><td style="text-decoration: underline">text-decoration on table</td></tr></tbody></table></div>
+<div><table><tbody><tr><td style="text-decoration: underline">text-decoration on tbody</td></tr></tbody></table></div>
+<div><table><tbody><tr><td style="text-decoration: underline">text-decoration on tr</td></tr></tbody></table></div>
+<div><table><tbody><tr><td style="text-decoration: underline">text-decoration on td</td></tr></tbody></table></div>
diff --git a/layout/reftests/text-decoration/table-quirk-1.html b/layout/reftests/text-decoration/table-quirk-1.html
new file mode 100644
index 0000000000..98375f44da
--- /dev/null
+++ b/layout/reftests/text-decoration/table-quirk-1.html
@@ -0,0 +1,7 @@
+<title>text-decoration quirk on tables (Bug 572713)</title>
+
+<div style="text-decoration: underline"><table><tbody><tr><td>text-decoration on container of table</td></tr></tbody></table></div>
+<div><table style="text-decoration: underline"><tbody><tr><td>text-decoration on table</td></tr></tbody></table></div>
+<div><table><tbody style="text-decoration: underline"><tr><td>text-decoration on tbody</td></tr></tbody></table></div>
+<div><table><tbody><tr style="text-decoration: underline"><td>text-decoration on tr</td></tr></tbody></table></div>
+<div><table><tbody><tr><td style="text-decoration: underline">text-decoration on td</td></tr></tbody></table></div>
diff --git a/layout/reftests/text-decoration/table-quirk-2-ref.html b/layout/reftests/text-decoration/table-quirk-2-ref.html
new file mode 100644
index 0000000000..49786fa6e6
--- /dev/null
+++ b/layout/reftests/text-decoration/table-quirk-2-ref.html
@@ -0,0 +1,26 @@
+<title>text-decoration quirk on tables (Bug 572713)</title>
+
+<h1>text-decoration on a block</h1>
+
+<u>text in the block</u>
+
+<div><u>text in a block in the block</u></div>
+
+<table><tbody><tr><td>an HTML table</td></tr></tbody></table>
+
+<table style="display:block"><tbody style="display:block"><tr style="display:block"><td style="display:block">an HTML table that's not table-display</td></tr></tbody></table>
+
+<div style="display: table"><div style="display: table-row-group"><div style="display: table-row"><div style="display: table-cell"><u>a div with table display types</u></div></div></div></div>
+
+<h1>text-decoration on an inline</h1>
+
+<u>text in the block</u>
+
+<div><u>text in a block in the block</u></div>
+
+<table><tbody><tr><td>an HTML table</td></tr></tbody></table>
+
+<table style="display:block"><tbody style="display:block"><tr style="display:block"><td style="display:block">an HTML table that's not table-display</td></tr></tbody></table>
+
+<div style="display: table"><div style="display: table-row-group"><div style="display: table-row"><div style="display: table-cell"><u>a div with table display types</u></div></div></div></div>
+
diff --git a/layout/reftests/text-decoration/table-quirk-2.html b/layout/reftests/text-decoration/table-quirk-2.html
new file mode 100644
index 0000000000..b02c95ab1a
--- /dev/null
+++ b/layout/reftests/text-decoration/table-quirk-2.html
@@ -0,0 +1,35 @@
+<title>text-decoration quirk on tables (Bug 572713)</title>
+
+<h1>text-decoration on a block</h1>
+
+<div style="text-decoration: underline">
+
+text in the block
+
+<div>text in a block in the block</div>
+
+<table><tbody><tr><td>an HTML table</td></tr></tbody></table>
+
+<table style="display:block"><tbody style="display:block"><tr style="display:block"><td style="display:block">an HTML table that's not table-display</td></tr></tbody></table>
+
+<div style="display: table"><div style="display: table-row-group"><div style="display: table-row"><div style="display: table-cell">a div with table display types</div></div></div></div>
+
+
+</div>
+
+<h1>text-decoration on an inline</h1>
+
+<div style="text-decoration: underline; display: inline">
+
+text in the block
+
+<div>text in a block in the block</div>
+
+<table><tbody><tr><td>an HTML table</td></tr></tbody></table>
+
+<table style="display:block"><tbody style="display:block"><tr style="display:block"><td style="display:block">an HTML table that's not table-display</td></tr></tbody></table>
+
+<div style="display: table"><div style="display: table-row-group"><div style="display: table-row"><div style="display: table-cell">a div with table display types</div></div></div></div>
+
+
+</div>
diff --git a/layout/reftests/text-decoration/text-decoration-propagation-1-quirks-ref.html b/layout/reftests/text-decoration/text-decoration-propagation-1-quirks-ref.html
new file mode 100644
index 0000000000..91130e61cd
--- /dev/null
+++ b/layout/reftests/text-decoration/text-decoration-propagation-1-quirks-ref.html
@@ -0,0 +1,38 @@
+<title>text-decoration</title>
+<style>
+ *{
+ text-decoration-skip-ink: none;
+ }
+</style>
+<h1>text-decoration on a block</h1>
+
+ <u>text directly in parent</u>
+
+ <div><u>text in block</u></div>
+
+ <div style="float:left; clear: left">text in float</div>
+ <div style="clear:left"></div>
+
+ <div style="display:inline-block">text in<br>inline-block</div><u>
+ </u><div style="display:inline-table">text in<br>inline-table</div>
+
+ <div style="height: 2em">
+ <div style="position: absolute">text in abs-pos</div>
+ </div>
+
+<h1>text-decoration on an inline</h1>
+
+ <u>text directly in parent</u>
+
+ <div><u>text in block</u></div>
+
+ <div style="float:left; clear: left">text in float</div>
+ <div style="clear:left"></div>
+
+ <div style="display:inline-block">text in<br>inline-block</div><u>
+ </u><div style="display:inline-table">text in<br>inline-table</div>
+
+ <div style="height: 2em">
+ <div style="position: absolute">text in abs-pos</div>
+ </div>
+
diff --git a/layout/reftests/text-decoration/text-decoration-propagation-1-quirks.html b/layout/reftests/text-decoration/text-decoration-propagation-1-quirks.html
new file mode 100644
index 0000000000..18b0e893ab
--- /dev/null
+++ b/layout/reftests/text-decoration/text-decoration-propagation-1-quirks.html
@@ -0,0 +1,46 @@
+<title>text-decoration</title>
+<style>
+ *{
+ text-decoration-skip-ink: none;
+ }
+</style>
+<h1>text-decoration on a block</h1>
+
+<div style="text-decoration: underline">
+
+ text directly in parent
+
+ <div>text in block</div>
+
+ <div style="float:left; clear: left">text in float</div>
+ <div style="clear:left"></div>
+
+ <div style="display:inline-block">text in<br>inline-block</div>
+ <div style="display:inline-table">text in<br>inline-table</div>
+
+ <div style="height: 2em">
+ <div style="position: absolute">text in abs-pos</div>
+ </div>
+
+</div>
+
+<h1>text-decoration on an inline</h1>
+
+<div style="text-decoration: underline; display: inline">
+
+ text directly in parent
+
+ <div>text in block</div>
+
+ <div style="float:left; clear: left">text in float</div>
+ <div style="clear:left"></div>
+
+ <div style="display:inline-block">text in<br>inline-block</div>
+ <div style="display:inline-table">text in<br>inline-table</div>
+
+ <div style="height: 2em">
+ <div style="position: absolute">text in abs-pos</div>
+ </div>
+
+</div>
+
diff --git a/layout/reftests/text-decoration/text-decoration-propagation-1-standards-ref.html b/layout/reftests/text-decoration/text-decoration-propagation-1-standards-ref.html
new file mode 100644
index 0000000000..a5c67cc425
--- /dev/null
+++ b/layout/reftests/text-decoration/text-decoration-propagation-1-standards-ref.html
@@ -0,0 +1,39 @@
+<!DOCTYPE HTML>
+<title>text-decoration</title>
+<style>
+ *{
+ text-decoration-skip-ink: none;
+ }
+</style>
+<h1>text-decoration on a block</h1>
+
+ <u>text directly in parent</u>
+
+ <div><u>text in block</u></div>
+
+ <div style="float:left; clear: left">text in float</div>
+ <div style="clear:left"></div>
+
+ <div style="display:inline-block">text in<br>inline-block</div><u>
+ </u><div style="display:inline-table">text in<br>inline-table</div>
+
+ <div style="height: 2em">
+ <div style="position: absolute">text in abs-pos</div>
+ </div>
+
+<h1>text-decoration on an inline</h1>
+
+ <u>text directly in parent</u>
+
+ <div><u>text in block</u></div>
+
+ <div style="float:left; clear: left">text in float</div>
+ <div style="clear:left"></div>
+
+ <div style="display:inline-block">text in<br>inline-block</div><u>
+ </u><div style="display:inline-table">text in<br>inline-table</div>
+
+ <div style="height: 2em">
+ <div style="position: absolute">text in abs-pos</div>
+ </div>
+
diff --git a/layout/reftests/text-decoration/text-decoration-propagation-1-standards.html b/layout/reftests/text-decoration/text-decoration-propagation-1-standards.html
new file mode 100644
index 0000000000..ff37d5db41
--- /dev/null
+++ b/layout/reftests/text-decoration/text-decoration-propagation-1-standards.html
@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<title>text-decoration</title>
+<style>
+ *{
+ text-decoration-skip-ink: none;
+ }
+</style>
+<h1>text-decoration on a block</h1>
+
+<div style="text-decoration: underline">
+
+ text directly in parent
+
+ <div>text in block</div>
+
+ <div style="float:left; clear: left">text in float</div>
+ <div style="clear:left"></div>
+
+ <div style="display:inline-block">text in<br>inline-block</div>
+ <div style="display:inline-table">text in<br>inline-table</div>
+
+ <div style="height: 2em">
+ <div style="position: absolute">text in abs-pos</div>
+ </div>
+
+</div>
+
+<h1>text-decoration on an inline</h1>
+
+<div style="text-decoration: underline; display: inline">
+
+ text directly in parent
+
+ <div>text in block</div>
+
+ <div style="float:left; clear: left">text in float</div>
+ <div style="clear:left"></div>
+
+ <div style="display:inline-block">text in<br>inline-block</div>
+ <div style="display:inline-table">text in<br>inline-table</div>
+
+ <div style="height: 2em">
+ <div style="position: absolute">text in abs-pos</div>
+ </div>
+
+</div>
+
diff --git a/layout/reftests/text-decoration/text-decoration-zorder-1-quirks.html b/layout/reftests/text-decoration/text-decoration-zorder-1-quirks.html
new file mode 100644
index 0000000000..18eaeba0d8
--- /dev/null
+++ b/layout/reftests/text-decoration/text-decoration-zorder-1-quirks.html
@@ -0,0 +1,44 @@
+<html lang="en-US">
+<head>
+ <title></title>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+ <meta http-equiv="Content-Style-Type" content="text/css">
+ <style type="text/css">
+
+ body { background: white; }
+
+ p.serif { font-family: serif; left: 20px; }
+ p.sans { font-family: sans-serif; left: 220px; }
+
+ p {
+ margin: 0;
+ position: absolute;
+ font-weight: bold;
+ font-size: 50px;
+ color: fuchsia;
+ }
+
+ span { color: blue; }
+
+ p.under { text-decoration: underline; top: 25px; }
+ p.over { text-decoration: overline; top: 125px; }
+ p.through { text-decoration: line-through; top: 225px; }
+
+ </style>
+</head>
+<body>
+
+<p class="serif under"><span>&Aacute;p|/</span></p>
+
+<p class="serif over"><span>&Aacute;p|/</span></p>
+
+<p class="serif through"><span>&Aacute;p|/</span></p>
+
+<p class="sans under"><span>&Aacute;p|/</span></p>
+
+<p class="sans over"><span>&Aacute;p|/</span></p>
+
+<p class="sans through"><span>&Aacute;p|/</span></p>
+
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/text-decoration-zorder-1-ref.html b/layout/reftests/text-decoration/text-decoration-zorder-1-ref.html
new file mode 100644
index 0000000000..e125987307
--- /dev/null
+++ b/layout/reftests/text-decoration/text-decoration-zorder-1-ref.html
@@ -0,0 +1,55 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
+ "http://www.w3.org/TR/html4/strict.dtd">
+<html lang="en-US">
+<head>
+ <title></title>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+ <meta http-equiv="Content-Style-Type" content="text/css">
+ <style type="text/css">
+
+ body { background: white; }
+
+ p.serif { font-family: serif; left: 20px; }
+ p.sans { font-family: sans-serif; left: 220px; }
+
+ p {
+ margin: 0;
+ position: absolute;
+ font-weight: bold;
+ font-size: 50px;
+ }
+
+ p.under { text-decoration: underline; top: 25px; }
+ p.over { text-decoration: overline; top: 125px; }
+ p.through { text-decoration: line-through; top: 225px; }
+
+ p.text { text-decoration: none ! important; }
+ p.line span { color: transparent; }
+
+ p.text { color: blue; }
+ p.line { color: fuchsia; }
+
+ </style>
+</head>
+<body>
+
+<p class="serif line under"><span>&Aacute;p|/</span></p>
+<p class="serif text under"><span>&Aacute;p|/</span></p>
+
+<p class="serif line over"><span>&Aacute;p|/</span></p>
+<p class="serif text over"><span>&Aacute;p|/</span></p>
+
+<p class="serif text through"><span>&Aacute;p|/</span></p>
+<p class="serif line through"><span>&Aacute;p|/</span></p>
+
+<p class="sans line under"><span>&Aacute;p|/</span></p>
+<p class="sans text under"><span>&Aacute;p|/</span></p>
+
+<p class="sans line over"><span>&Aacute;p|/</span></p>
+<p class="sans text over"><span>&Aacute;p|/</span></p>
+
+<p class="sans text through"><span>&Aacute;p|/</span></p>
+<p class="sans line through"><span>&Aacute;p|/</span></p>
+
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/text-decoration-zorder-1-standards.html b/layout/reftests/text-decoration/text-decoration-zorder-1-standards.html
new file mode 100644
index 0000000000..38d377f8b8
--- /dev/null
+++ b/layout/reftests/text-decoration/text-decoration-zorder-1-standards.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
+ "http://www.w3.org/TR/html4/strict.dtd">
+<html lang="en-US">
+<head>
+ <title></title>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+ <meta http-equiv="Content-Style-Type" content="text/css">
+ <style type="text/css">
+
+ body { background: white; }
+
+ p.serif { font-family: serif; left: 20px; }
+ p.sans { font-family: sans-serif; left: 220px; }
+
+ p {
+ margin: 0;
+ position: absolute;
+ font-weight: bold;
+ font-size: 50px;
+ color: fuchsia;
+ }
+
+ span { color: blue; }
+
+ p.under { text-decoration: underline; top: 25px; }
+ p.over { text-decoration: overline; top: 125px; }
+ p.through { text-decoration: line-through; top: 225px; }
+
+ </style>
+</head>
+<body>
+
+<p class="serif under"><span>&Aacute;p|/</span></p>
+
+<p class="serif over"><span>&Aacute;p|/</span></p>
+
+<p class="serif through"><span>&Aacute;p|/</span></p>
+
+<p class="sans under"><span>&Aacute;p|/</span></p>
+
+<p class="sans over"><span>&Aacute;p|/</span></p>
+
+<p class="sans through"><span>&Aacute;p|/</span></p>
+
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/underline-block-propagation-2-quirks-ref.html b/layout/reftests/text-decoration/underline-block-propagation-2-quirks-ref.html
new file mode 100644
index 0000000000..6f4bc8ecd2
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-block-propagation-2-quirks-ref.html
@@ -0,0 +1,40 @@
+<html><head>
+<title>More tests of propagation of text-decoration</title>
+<style>
+textarea { -moz-appearance: none }
+textarea + textarea { margin-left: 10px }
+</style>
+</head>
+<body>
+<!-- t-d should not propagate to the content of a form control -->
+<form>
+<span style="text-decoration:underline">This text should be underlined.</span><br>
+<textarea rows="2" cols="40">This text should not be underlined.</textarea
+><textarea rows="2" cols="40" style="text-decoration:line-through"
+>This text should be struck out.</textarea>
+<p style="text-decoration:underline">This text should also be underlined.</p>
+</form>
+<!-- t-d should propagate from parent elements to table-cells, except
+ not through a table element in quirks mode, per
+ https://quirks.spec.whatwg.org/#the-text-decoration-doesn't-propagate-into-tables-quirk
+ -->
+<div>
+ <table>
+ <tr>
+ <td>
+ <span style="text-decoration:overline">
+ <span style="text-decoration:line-through">
+ overlined, and struck out
+ </span></span>
+ </td>
+ </tr>
+ </table>
+</div>
+<!-- t-d on a float itself should apply -->
+<div>
+ <p style="text-decoration:underline">This text should be underlined.</p>
+ <p style="float:left; text-decoration:overline"
+ >This text should be overlined (only).</p>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/underline-block-propagation-2-quirks.html b/layout/reftests/text-decoration/underline-block-propagation-2-quirks.html
new file mode 100644
index 0000000000..7e32b7581f
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-block-propagation-2-quirks.html
@@ -0,0 +1,35 @@
+<html><head>
+<title>More tests of propagation of text-decoration</title>
+<style>
+textarea { -moz-appearance: none }
+textarea + textarea { margin-left: 10px }
+</style>
+</head>
+<body>
+<!-- t-d should not propagate to the content of a form control -->
+<form style="text-decoration:underline">
+This text should be underlined.<br>
+<textarea rows="2" cols="40">This text should not be underlined.</textarea
+><textarea rows="2" cols="40" style="text-decoration:line-through"
+>This text should be struck out.</textarea>
+<p>This text should also be underlined.</p>
+</form>
+<!-- t-d should propagate from parent elements to table-cells, except
+ not through a table element in quirks mode, per
+ https://quirks.spec.whatwg.org/#the-text-decoration-doesn't-propagate-into-tables-quirk
+ -->
+<div style="text-decoration:underline">
+ <table style="text-decoration:overline">
+ <tr style="text-decoration:line-through">
+ <td>overlined, and struck out</td>
+ </tr>
+ </table>
+</div>
+<!-- t-d on a float itself should apply -->
+<div style="text-decoration:underline">
+ <p>This text should be underlined.</p>
+ <p style="float:left; text-decoration:overline"
+ >This text should be overlined (only).</p>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/underline-block-propagation-2-standards-ref.html b/layout/reftests/text-decoration/underline-block-propagation-2-standards-ref.html
new file mode 100644
index 0000000000..eb7c3273cd
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-block-propagation-2-standards-ref.html
@@ -0,0 +1,40 @@
+<!DOCTYPE HTML>
+<html><head>
+<title>More tests of propagation of text-decoration</title>
+<style>
+textarea { -moz-appearance: none }
+textarea + textarea { margin-left: 10px }
+* { text-decoration-skip-ink: none }
+</style>
+</head>
+<body>
+<!-- t-d should not propagate to the content of a form control -->
+<form>
+<span style="text-decoration:underline">This text should be underlined.</span><br>
+<textarea rows="2" cols="40">This text should not be underlined.</textarea
+><textarea rows="2" cols="40" style="text-decoration:line-through"
+>This text should be struck out.</textarea>
+<p style="text-decoration:underline">This text should also be underlined.</p>
+</form>
+<!-- t-d should propagate from parent elements to table-cells -->
+<div>
+ <table>
+ <tr>
+ <td>
+ <span style="text-decoration:underline">
+ <span style="text-decoration:overline">
+ <span style="text-decoration:line-through">
+ underlined, overlined, and struck out
+ </span></span></span>
+ </td>
+ </tr>
+ </table>
+</div>
+<!-- t-d on a float itself should apply -->
+<div>
+ <p style="text-decoration:underline">This text should be underlined.</p>
+ <p style="float:left; text-decoration:overline"
+ >This text should be overlined (only).</p>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/underline-block-propagation-2-standards.html b/layout/reftests/text-decoration/underline-block-propagation-2-standards.html
new file mode 100644
index 0000000000..5a9997e365
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-block-propagation-2-standards.html
@@ -0,0 +1,34 @@
+<!DOCTYPE HTML>
+<html><head>
+<title>More tests of propagation of text-decoration</title>
+<style>
+textarea { -moz-appearance: none }
+textarea + textarea { margin-left: 10px }
+* { text-decoration-skip-ink: none }
+</style>
+</head>
+<body>
+<!-- t-d should not propagate to the content of a form control -->
+<form style="text-decoration:underline">
+This text should be underlined.<br>
+<textarea rows="2" cols="40">This text should not be underlined.</textarea
+><textarea rows="2" cols="40" style="text-decoration:line-through"
+>This text should be struck out.</textarea>
+<p>This text should also be underlined.</p>
+</form>
+<!-- t-d should propagate from parent elements to table-cells -->
+<div style="text-decoration:underline">
+ <table style="text-decoration:overline">
+ <tr style="text-decoration:line-through">
+ <td>underlined, overlined, and struck out</td>
+ </tr>
+ </table>
+</div>
+<!-- t-d on a float itself should apply -->
+<div style="text-decoration:underline">
+ <p>This text should be underlined.</p>
+ <p style="float:left; text-decoration:overline"
+ >This text should be overlined (only).</p>
+</div>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/underline-block-propagation-quirks-ref.html b/layout/reftests/text-decoration/underline-block-propagation-quirks-ref.html
new file mode 100644
index 0000000000..73d8fe301f
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-block-propagation-quirks-ref.html
@@ -0,0 +1,13 @@
+<title>text-decoration: underline test</title>
+<div>
+<span style="text-decoration:underline">This text should be underlined.</span>
+
+<div style="float:left;width:10em">This text should not be underlined.</div>
+
+<div style="clear:both; margin: 1px 2px 3px 4px; border: medium solid; padding: 6px 8px 10px 12px"><span style="text-decoration:underline">This text should be underlined.</span></div>
+
+<div style="position:absolute; top: 400px;left:400px">This should not be underlined.</div>
+
+<div><span style="text-decoration:underline">This should be underlined but </span><span style="display:inline-block">this should not<br>be underlined<br>on any line</span><span style="text-decoration:underline">.</span></div>
+
+<div><span style="text-decoration:underline">This should be underlined but </span><span style="display:inline-table">this should not<br>be underlined<br>on any line</span><span style="text-decoration:underline">.</span></div>
diff --git a/layout/reftests/text-decoration/underline-block-propagation-quirks.html b/layout/reftests/text-decoration/underline-block-propagation-quirks.html
new file mode 100644
index 0000000000..ef3e255377
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-block-propagation-quirks.html
@@ -0,0 +1,13 @@
+<title>text-decoration: underline test</title>
+<div style="text-decoration:underline">
+This text should be underlined.
+
+<div style="float:left;width:10em">This text should not be underlined.</div>
+
+<div style="clear:both; margin: 1px 2px 3px 4px; border: medium solid; padding: 6px 8px 10px 12px">This text should be underlined.</div>
+
+<div style="position:absolute; top: 400px;left:400px">This should not be underlined.</div>
+
+<div>This should be underlined but <span style="display:inline-block">this should not<br>be underlined<br>on any line</span>.</div>
+
+<div>This should be underlined but <span style="display:inline-table">this should not<br>be underlined<br>on any line</span>.</div>
diff --git a/layout/reftests/text-decoration/underline-block-propagation-standards-ref.html b/layout/reftests/text-decoration/underline-block-propagation-standards-ref.html
new file mode 100644
index 0000000000..d7ce633de6
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-block-propagation-standards-ref.html
@@ -0,0 +1,14 @@
+<!DOCTYPE HTML>
+<title>text-decoration: underline test</title>
+<div>
+<span style="text-decoration:underline">This text should be underlined.</span>
+
+<div style="float:left;width:10em">This text should not be underlined.</div>
+
+<div style="clear:both; margin: 1px 2px 3px 4px; border: medium solid; padding: 6px 8px 10px 12px"><span style="text-decoration:underline">This text should be underlined.</span></div>
+
+<div style="position:absolute; top: 400px;left:400px">This should not be underlined.</div>
+
+<div><span style="text-decoration:underline">This should be underlined but </span><span style="display:inline-block">this should not<br>be underlined<br>on any line</span><span style="text-decoration:underline">.</span></div>
+
+<div><span style="text-decoration:underline">This should be underlined but </span><span style="display:inline-table">this should not<br>be underlined<br>on any line</span><span style="text-decoration:underline">.</span></div>
diff --git a/layout/reftests/text-decoration/underline-block-propagation-standards.html b/layout/reftests/text-decoration/underline-block-propagation-standards.html
new file mode 100644
index 0000000000..a010e93a74
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-block-propagation-standards.html
@@ -0,0 +1,14 @@
+<!DOCTYPE HTML>
+<title>text-decoration: underline test</title>
+<div style="text-decoration:underline">
+This text should be underlined.
+
+<div style="float:left;width:10em">This text should not be underlined.</div>
+
+<div style="clear:both; margin: 1px 2px 3px 4px; border: medium solid; padding: 6px 8px 10px 12px">This text should be underlined.</div>
+
+<div style="position:absolute; top: 400px;left:400px">This should not be underlined.</div>
+
+<div>This should be underlined but <span style="display:inline-block">this should not<br>be underlined<br>on any line</span>.</div>
+
+<div>This should be underlined but <span style="display:inline-table">this should not<br>be underlined<br>on any line</span>.</div>
diff --git a/layout/reftests/text-decoration/underline-block-quirks-notref.html b/layout/reftests/text-decoration/underline-block-quirks-notref.html
new file mode 100644
index 0000000000..141a199518
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-block-quirks-notref.html
@@ -0,0 +1,2 @@
+<title>text-decoration: underline test</title>
+<div>This text should be underlined.</div>
diff --git a/layout/reftests/text-decoration/underline-block-quirks-ref.html b/layout/reftests/text-decoration/underline-block-quirks-ref.html
new file mode 100644
index 0000000000..8f70b8e28c
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-block-quirks-ref.html
@@ -0,0 +1,2 @@
+<title>text-decoration: underline test</title>
+<div><span style="text-decoration:underline">This text should be underlined.</span></div>
diff --git a/layout/reftests/text-decoration/underline-block-quirks.html b/layout/reftests/text-decoration/underline-block-quirks.html
new file mode 100644
index 0000000000..6860b3aee6
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-block-quirks.html
@@ -0,0 +1,2 @@
+<title>text-decoration: underline test</title>
+<div style="text-decoration:underline">This text should be underlined.</div>
diff --git a/layout/reftests/text-decoration/underline-block-standards-notref.html b/layout/reftests/text-decoration/underline-block-standards-notref.html
new file mode 100644
index 0000000000..ed47f3becc
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-block-standards-notref.html
@@ -0,0 +1,3 @@
+<!DOCTYPE HTML>
+<title>text-decoration: underline test</title>
+<div>This text should be underlined.</div>
diff --git a/layout/reftests/text-decoration/underline-block-standards-ref.html b/layout/reftests/text-decoration/underline-block-standards-ref.html
new file mode 100644
index 0000000000..ea53cd446b
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-block-standards-ref.html
@@ -0,0 +1,3 @@
+<!DOCTYPE HTML>
+<title>text-decoration: underline test</title>
+<div><span style="text-decoration:underline">This text should be underlined.</span></div>
diff --git a/layout/reftests/text-decoration/underline-block-standards.html b/layout/reftests/text-decoration/underline-block-standards.html
new file mode 100644
index 0000000000..b9b527d7a5
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-block-standards.html
@@ -0,0 +1,3 @@
+<!DOCTYPE HTML>
+<title>text-decoration: underline test</title>
+<div style="text-decoration:underline">This text should be underlined.</div>
diff --git a/layout/reftests/text-decoration/underline-button-1-ref.html b/layout/reftests/text-decoration/underline-button-1-ref.html
new file mode 100644
index 0000000000..c5b84e1c2d
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-button-1-ref.html
@@ -0,0 +1,9 @@
+<!doctype html>
+<html>
+<body>
+ <span style="text-decoration: underline">
+ Some</span><button>text</button><span
+ style="text-decoration: underline">and a button
+ </span>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/underline-button-1.html b/layout/reftests/text-decoration/underline-button-1.html
new file mode 100644
index 0000000000..4c40e8bdfd
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-button-1.html
@@ -0,0 +1,8 @@
+<!doctype html>
+<html>
+<body>
+ <span style="text-decoration: underline">
+ Some<button>text</button>and a button
+ </span>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/underline-button-2-ref.html b/layout/reftests/text-decoration/underline-button-2-ref.html
new file mode 100644
index 0000000000..f003bae646
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-button-2-ref.html
@@ -0,0 +1,9 @@
+<!doctype html>
+<html>
+<body>
+ <span style="text-decoration: underline; font: 16px sans-serif">
+ Some</span><button style="text-decoration: underline; color: black; font: 16px sans-serif">text</button><span
+ style="text-decoration: underline; font: 16px sans-serif">and a button
+ </span>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/underline-button-2.html b/layout/reftests/text-decoration/underline-button-2.html
new file mode 100644
index 0000000000..c61afd2a18
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-button-2.html
@@ -0,0 +1,8 @@
+<!doctype html>
+<html>
+<body>
+ <span style="text-decoration: underline; font: 16px sans-serif">
+ Some<button style="display: inline; color: black; font: 16px sans-serif">text</button>and a button
+ </span>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/underline-inline-block-quirks-notref.html b/layout/reftests/text-decoration/underline-inline-block-quirks-notref.html
new file mode 100644
index 0000000000..17b221274e
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-inline-block-quirks-notref.html
@@ -0,0 +1,2 @@
+<title>text-decoration: underline test</title>
+<p>This has an <span style="display:inline-block">inline<br>block</span> in it.</p>
diff --git a/layout/reftests/text-decoration/underline-inline-block-quirks-ref.html b/layout/reftests/text-decoration/underline-inline-block-quirks-ref.html
new file mode 100644
index 0000000000..27c474675e
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-inline-block-quirks-ref.html
@@ -0,0 +1,2 @@
+<title>text-decoration: underline test</title>
+<p>This has an <span style="display:inline-block"><span style="text-decoration:underline">inline</span><br><span style="text-decoration:underline">block</span></span> in it.</p>
diff --git a/layout/reftests/text-decoration/underline-inline-block-quirks.html b/layout/reftests/text-decoration/underline-inline-block-quirks.html
new file mode 100644
index 0000000000..b75286d7dd
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-inline-block-quirks.html
@@ -0,0 +1,2 @@
+<title>text-decoration: underline test</title>
+<p>This has an <span style="display:inline-block;text-decoration:underline">inline<br>block</span> in it.</p>
diff --git a/layout/reftests/text-decoration/underline-inline-block-standards-notref.html b/layout/reftests/text-decoration/underline-inline-block-standards-notref.html
new file mode 100644
index 0000000000..f2325dfe11
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-inline-block-standards-notref.html
@@ -0,0 +1,3 @@
+<!DOCTYPE HTML>
+<title>text-decoration: underline test</title>
+<p>This has an <span style="display:inline-block">inline<br>block</span> in it.</p>
diff --git a/layout/reftests/text-decoration/underline-inline-block-standards-ref.html b/layout/reftests/text-decoration/underline-inline-block-standards-ref.html
new file mode 100644
index 0000000000..6b23d0f4f5
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-inline-block-standards-ref.html
@@ -0,0 +1,3 @@
+<!DOCTYPE HTML>
+<title>text-decoration: underline test</title>
+<p>This has an <span style="display:inline-block"><span style="text-decoration:underline">inline</span><br><span style="text-decoration:underline">block</span></span> in it.</p>
diff --git a/layout/reftests/text-decoration/underline-inline-block-standards.html b/layout/reftests/text-decoration/underline-inline-block-standards.html
new file mode 100644
index 0000000000..24b519ebe3
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-inline-block-standards.html
@@ -0,0 +1,3 @@
+<!DOCTYPE HTML>
+<title>text-decoration: underline test</title>
+<p>This has an <span style="display:inline-block;text-decoration:underline">inline<br>block</span> in it.</p>
diff --git a/layout/reftests/text-decoration/underline-select-1-ref.html b/layout/reftests/text-decoration/underline-select-1-ref.html
new file mode 100644
index 0000000000..e10ebe9783
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-select-1-ref.html
@@ -0,0 +1,9 @@
+<!doctype html>
+<html>
+<body>
+ <span style="text-decoration: underline">
+ Some</span><select><option>text</option></select><span
+ style="text-decoration: underline">and a button
+ </span>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/underline-select-1.html b/layout/reftests/text-decoration/underline-select-1.html
new file mode 100644
index 0000000000..84c74d5f76
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-select-1.html
@@ -0,0 +1,8 @@
+<!doctype html>
+<html>
+<body>
+ <span style="text-decoration: underline">
+ Some<select><option>text</option></select>and a button
+ </span>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/underline-select-2-ref.html b/layout/reftests/text-decoration/underline-select-2-ref.html
new file mode 100644
index 0000000000..3c032949d1
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-select-2-ref.html
@@ -0,0 +1,9 @@
+<!doctype html>
+<html>
+<body>
+ <span style="text-decoration: underline">
+ Some</span><select size="5"><option>text</option></select><span
+ style="text-decoration: underline">and a button
+ </span>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/underline-select-2.html b/layout/reftests/text-decoration/underline-select-2.html
new file mode 100644
index 0000000000..e2b014eb47
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-select-2.html
@@ -0,0 +1,8 @@
+<!doctype html>
+<html>
+<body>
+ <span style="text-decoration: underline">
+ Some<select size="5"><option>text</option></select>and a button
+ </span>
+</body>
+</html>
diff --git a/layout/reftests/text-decoration/underline-style-block-dashed-quirks.html b/layout/reftests/text-decoration/underline-style-block-dashed-quirks.html
new file mode 100644
index 0000000000..5e8beec1ec
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-block-dashed-quirks.html
@@ -0,0 +1 @@
+<p style="text-decoration: underline; text-decoration-style: dashed;">This paragraph has underline</p>
diff --git a/layout/reftests/text-decoration/underline-style-block-dashed-standards.html b/layout/reftests/text-decoration/underline-style-block-dashed-standards.html
new file mode 100644
index 0000000000..237f3d0981
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-block-dashed-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p style="text-decoration: underline; text-decoration-style: dashed;">This paragraph has underline</p>
diff --git a/layout/reftests/text-decoration/underline-style-block-dotted-quirks.html b/layout/reftests/text-decoration/underline-style-block-dotted-quirks.html
new file mode 100644
index 0000000000..909e1761db
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-block-dotted-quirks.html
@@ -0,0 +1 @@
+<p style="text-decoration: underline; text-decoration-style: dotted;">This paragraph has underline</p>
diff --git a/layout/reftests/text-decoration/underline-style-block-dotted-standards.html b/layout/reftests/text-decoration/underline-style-block-dotted-standards.html
new file mode 100644
index 0000000000..994681c12f
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-block-dotted-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p style="text-decoration: underline; text-decoration-style: dotted;">This paragraph has underline</p>
diff --git a/layout/reftests/text-decoration/underline-style-block-double-quirks.html b/layout/reftests/text-decoration/underline-style-block-double-quirks.html
new file mode 100644
index 0000000000..8047c47f1f
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-block-double-quirks.html
@@ -0,0 +1 @@
+<p style="text-decoration: underline; text-decoration-style: double;">This paragraph has underline</p>
diff --git a/layout/reftests/text-decoration/underline-style-block-double-standards.html b/layout/reftests/text-decoration/underline-style-block-double-standards.html
new file mode 100644
index 0000000000..69dbb4a56d
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-block-double-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p style="text-decoration: underline; text-decoration-style: double;">This paragraph has underline</p>
diff --git a/layout/reftests/text-decoration/underline-style-block-quirks-ref.html b/layout/reftests/text-decoration/underline-style-block-quirks-ref.html
new file mode 100644
index 0000000000..65d66622f1
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-block-quirks-ref.html
@@ -0,0 +1 @@
+<p style="text-decoration: underline;">This paragraph has underline</p>
diff --git a/layout/reftests/text-decoration/underline-style-block-solid-quirks.html b/layout/reftests/text-decoration/underline-style-block-solid-quirks.html
new file mode 100644
index 0000000000..d0637957d6
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-block-solid-quirks.html
@@ -0,0 +1 @@
+<p style="text-decoration: underline; text-decoration-style: solid;">This paragraph has underline</p>
diff --git a/layout/reftests/text-decoration/underline-style-block-solid-standards.html b/layout/reftests/text-decoration/underline-style-block-solid-standards.html
new file mode 100644
index 0000000000..fdf75e6a1e
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-block-solid-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p style="text-decoration: underline; text-decoration-style: solid;">This paragraph has underline</p>
diff --git a/layout/reftests/text-decoration/underline-style-block-standards-ref.html b/layout/reftests/text-decoration/underline-style-block-standards-ref.html
new file mode 100644
index 0000000000..4e03e4f07b
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-block-standards-ref.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p style="text-decoration: underline;">This paragraph has underline</p>
diff --git a/layout/reftests/text-decoration/underline-style-block-wavy-quirks.html b/layout/reftests/text-decoration/underline-style-block-wavy-quirks.html
new file mode 100644
index 0000000000..abf208a844
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-block-wavy-quirks.html
@@ -0,0 +1 @@
+<p style="text-decoration: underline; text-decoration-style: wavy;">This paragraph has underline</p>
diff --git a/layout/reftests/text-decoration/underline-style-block-wavy-standards.html b/layout/reftests/text-decoration/underline-style-block-wavy-standards.html
new file mode 100644
index 0000000000..ae1a6ed72c
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-block-wavy-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p style="text-decoration: underline; text-decoration-style: wavy;">This paragraph has underline</p>
diff --git a/layout/reftests/text-decoration/underline-style-inline-dashed-quirks.html b/layout/reftests/text-decoration/underline-style-inline-dashed-quirks.html
new file mode 100644
index 0000000000..7a2a15ccd0
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-inline-dashed-quirks.html
@@ -0,0 +1 @@
+<p>This paragraph has no decoration lines, but <span style="text-decoration: underline; text-decoration-style: dashed;">here has underline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/underline-style-inline-dashed-standards.html b/layout/reftests/text-decoration/underline-style-inline-dashed-standards.html
new file mode 100644
index 0000000000..8afb04e396
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-inline-dashed-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p>This paragraph has no decoration lines, but <span style="text-decoration: underline; text-decoration-style: dashed;">here has underline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/underline-style-inline-dotted-quirks.html b/layout/reftests/text-decoration/underline-style-inline-dotted-quirks.html
new file mode 100644
index 0000000000..30da0a460e
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-inline-dotted-quirks.html
@@ -0,0 +1 @@
+<p>This paragraph has no decoration lines, but <span style="text-decoration: underline; text-decoration-style: dotted;">here has underline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/underline-style-inline-dotted-standards.html b/layout/reftests/text-decoration/underline-style-inline-dotted-standards.html
new file mode 100644
index 0000000000..f83d30766b
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-inline-dotted-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p>This paragraph has no decoration lines, but <span style="text-decoration: underline; text-decoration-style: dotted;">here has underline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/underline-style-inline-double-quirks.html b/layout/reftests/text-decoration/underline-style-inline-double-quirks.html
new file mode 100644
index 0000000000..a0f5c9e287
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-inline-double-quirks.html
@@ -0,0 +1 @@
+<p>This paragraph has no decoration lines, but <span style="text-decoration: underline; text-decoration-style: double;">here has underline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/underline-style-inline-double-standards.html b/layout/reftests/text-decoration/underline-style-inline-double-standards.html
new file mode 100644
index 0000000000..239bd9e067
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-inline-double-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p>This paragraph has no decoration lines, but <span style="text-decoration: underline; text-decoration-style: double;">here has underline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/underline-style-inline-quirks-ref.html b/layout/reftests/text-decoration/underline-style-inline-quirks-ref.html
new file mode 100644
index 0000000000..d8a1b40b86
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-inline-quirks-ref.html
@@ -0,0 +1 @@
+<p>This paragraph has no decoration lines, but <span style="text-decoration: underline;">here has underline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/underline-style-inline-solid-quirks.html b/layout/reftests/text-decoration/underline-style-inline-solid-quirks.html
new file mode 100644
index 0000000000..6f415d16f7
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-inline-solid-quirks.html
@@ -0,0 +1 @@
+<p>This paragraph has no decoration lines, but <span style="text-decoration: underline; text-decoration-style: solid;">here has underline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/underline-style-inline-solid-standards.html b/layout/reftests/text-decoration/underline-style-inline-solid-standards.html
new file mode 100644
index 0000000000..88268b2662
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-inline-solid-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p>This paragraph has no decoration lines, but <span style="text-decoration: underline; text-decoration-style: solid;">here has underline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/underline-style-inline-standards-ref.html b/layout/reftests/text-decoration/underline-style-inline-standards-ref.html
new file mode 100644
index 0000000000..7cc4eec7e2
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-inline-standards-ref.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p>This paragraph has no decoration lines, but <span style="text-decoration: underline;">here has underline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/underline-style-inline-wavy-quirks.html b/layout/reftests/text-decoration/underline-style-inline-wavy-quirks.html
new file mode 100644
index 0000000000..57b8c5e06f
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-inline-wavy-quirks.html
@@ -0,0 +1 @@
+<p>This paragraph has no decoration lines, but <span style="text-decoration: underline; text-decoration-style: wavy;">here has underline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/underline-style-inline-wavy-standards.html b/layout/reftests/text-decoration/underline-style-inline-wavy-standards.html
new file mode 100644
index 0000000000..d078e70683
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-style-inline-wavy-standards.html
@@ -0,0 +1,2 @@
+<!DOCTYPE html>
+<p>This paragraph has no decoration lines, but <span style="text-decoration: underline; text-decoration-style: wavy;">here has underline</span>, and here has no decoration lines.</p>
diff --git a/layout/reftests/text-decoration/underline-table-caption-quirks-notref.html b/layout/reftests/text-decoration/underline-table-caption-quirks-notref.html
new file mode 100644
index 0000000000..26c6189387
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-table-caption-quirks-notref.html
@@ -0,0 +1,12 @@
+<title>text-decoration: underline test</title>
+<table border>
+ <caption>This is the table caption</caption>
+ <tr>
+ <td>Row 1, Cell 1</td>
+ <td>Row 1, Cell 2</td>
+ </tr>
+ <tr>
+ <td>Row 2, Cell 1</td>
+ <td>Row 2, Cell 2</td>
+ </tr>
+</table>
diff --git a/layout/reftests/text-decoration/underline-table-caption-quirks-ref.html b/layout/reftests/text-decoration/underline-table-caption-quirks-ref.html
new file mode 100644
index 0000000000..926acf820a
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-table-caption-quirks-ref.html
@@ -0,0 +1,12 @@
+<title>text-decoration: underline test</title>
+<table border>
+ <caption><span style="text-decoration: underline">This is the table caption</span></caption>
+ <tr>
+ <td>Row 1, Cell 1</td>
+ <td>Row 1, Cell 2</td>
+ </tr>
+ <tr>
+ <td>Row 2, Cell 1</td>
+ <td>Row 2, Cell 2</td>
+ </tr>
+</table>
diff --git a/layout/reftests/text-decoration/underline-table-caption-quirks.html b/layout/reftests/text-decoration/underline-table-caption-quirks.html
new file mode 100644
index 0000000000..0fbeba1066
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-table-caption-quirks.html
@@ -0,0 +1,12 @@
+<title>text-decoration: underline test</title>
+<table border>
+ <caption style="text-decoration: underline">This is the table caption</caption>
+ <tr>
+ <td>Row 1, Cell 1</td>
+ <td>Row 1, Cell 2</td>
+ </tr>
+ <tr>
+ <td>Row 2, Cell 1</td>
+ <td>Row 2, Cell 2</td>
+ </tr>
+</table>
diff --git a/layout/reftests/text-decoration/underline-table-caption-standards-notref.html b/layout/reftests/text-decoration/underline-table-caption-standards-notref.html
new file mode 100644
index 0000000000..00cd35b6c6
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-table-caption-standards-notref.html
@@ -0,0 +1,13 @@
+<!DOCTYPE HTML>
+<title>text-decoration: underline test</title>
+<table border>
+ <caption>This is the table caption</caption>
+ <tr>
+ <td>Row 1, Cell 1</td>
+ <td>Row 1, Cell 2</td>
+ </tr>
+ <tr>
+ <td>Row 2, Cell 1</td>
+ <td>Row 2, Cell 2</td>
+ </tr>
+</table>
diff --git a/layout/reftests/text-decoration/underline-table-caption-standards-ref.html b/layout/reftests/text-decoration/underline-table-caption-standards-ref.html
new file mode 100644
index 0000000000..c99bff74b5
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-table-caption-standards-ref.html
@@ -0,0 +1,13 @@
+<!DOCTYPE HTML>
+<title>text-decoration: underline test</title>
+<table border>
+ <caption><span style="text-decoration: underline">This is the table caption</span></caption>
+ <tr>
+ <td>Row 1, Cell 1</td>
+ <td>Row 1, Cell 2</td>
+ </tr>
+ <tr>
+ <td>Row 2, Cell 1</td>
+ <td>Row 2, Cell 2</td>
+ </tr>
+</table>
diff --git a/layout/reftests/text-decoration/underline-table-caption-standards.html b/layout/reftests/text-decoration/underline-table-caption-standards.html
new file mode 100644
index 0000000000..f9af71bdef
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-table-caption-standards.html
@@ -0,0 +1,13 @@
+<!DOCTYPE HTML>
+<title>text-decoration: underline test</title>
+<table border>
+ <caption style="text-decoration: underline">This is the table caption</caption>
+ <tr>
+ <td>Row 1, Cell 1</td>
+ <td>Row 1, Cell 2</td>
+ </tr>
+ <tr>
+ <td>Row 2, Cell 1</td>
+ <td>Row 2, Cell 2</td>
+ </tr>
+</table>
diff --git a/layout/reftests/text-decoration/underline-table-cell-quirks-notref.html b/layout/reftests/text-decoration/underline-table-cell-quirks-notref.html
new file mode 100644
index 0000000000..0d77eb061d
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-table-cell-quirks-notref.html
@@ -0,0 +1,11 @@
+<title>text-decoration: underline test</title>
+<table border>
+ <tr>
+ <td>Row 1, Cell 1</td>
+ <td>Row 1, Cell 2</td>
+ </tr>
+ <tr>
+ <td>Row 2, Cell 1</td>
+ <td>Row 2, Cell 2</td>
+ </tr>
+</table>
diff --git a/layout/reftests/text-decoration/underline-table-cell-quirks-ref.html b/layout/reftests/text-decoration/underline-table-cell-quirks-ref.html
new file mode 100644
index 0000000000..d44cc08cc3
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-table-cell-quirks-ref.html
@@ -0,0 +1,11 @@
+<title>text-decoration: underline test</title>
+<table border>
+ <tr>
+ <td><span style="text-decoration: underline">Row 1, Cell 1</span></td>
+ <td>Row 1, Cell 2</td>
+ </tr>
+ <tr>
+ <td>Row 2, Cell 1</td>
+ <td>Row 2, Cell 2</td>
+ </tr>
+</table>
diff --git a/layout/reftests/text-decoration/underline-table-cell-quirks.html b/layout/reftests/text-decoration/underline-table-cell-quirks.html
new file mode 100644
index 0000000000..5c11e7e5dc
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-table-cell-quirks.html
@@ -0,0 +1,11 @@
+<title>text-decoration: underline test</title>
+<table border>
+ <tr>
+ <td style="text-decoration: underline">Row 1, Cell 1</td>
+ <td>Row 1, Cell 2</td>
+ </tr>
+ <tr>
+ <td>Row 2, Cell 1</td>
+ <td>Row 2, Cell 2</td>
+ </tr>
+</table>
diff --git a/layout/reftests/text-decoration/underline-table-cell-standards-notref.html b/layout/reftests/text-decoration/underline-table-cell-standards-notref.html
new file mode 100644
index 0000000000..712d5a16d2
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-table-cell-standards-notref.html
@@ -0,0 +1,12 @@
+<!DOCTYPE HTML>
+<title>text-decoration: underline test</title>
+<table border>
+ <tr>
+ <td>Row 1, Cell 1</td>
+ <td>Row 1, Cell 2</td>
+ </tr>
+ <tr>
+ <td>Row 2, Cell 1</td>
+ <td>Row 2, Cell 2</td>
+ </tr>
+</table>
diff --git a/layout/reftests/text-decoration/underline-table-cell-standards-ref.html b/layout/reftests/text-decoration/underline-table-cell-standards-ref.html
new file mode 100644
index 0000000000..45de37dbba
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-table-cell-standards-ref.html
@@ -0,0 +1,12 @@
+<!DOCTYPE HTML>
+<title>text-decoration: underline test</title>
+<table border>
+ <tr>
+ <td><span style="text-decoration: underline">Row 1, Cell 1</span></td>
+ <td>Row 1, Cell 2</td>
+ </tr>
+ <tr>
+ <td>Row 2, Cell 1</td>
+ <td>Row 2, Cell 2</td>
+ </tr>
+</table>
diff --git a/layout/reftests/text-decoration/underline-table-cell-standards.html b/layout/reftests/text-decoration/underline-table-cell-standards.html
new file mode 100644
index 0000000000..cfaf01e25a
--- /dev/null
+++ b/layout/reftests/text-decoration/underline-table-cell-standards.html
@@ -0,0 +1,12 @@
+<!DOCTYPE HTML>
+<title>text-decoration: underline test</title>
+<table border>
+ <tr>
+ <td style="text-decoration: underline">Row 1, Cell 1</td>
+ <td>Row 1, Cell 2</td>
+ </tr>
+ <tr>
+ <td>Row 2, Cell 1</td>
+ <td>Row 2, Cell 2</td>
+ </tr>
+</table>
diff --git a/layout/reftests/text-decoration/vertical-mode-decorations-1-ref.html b/layout/reftests/text-decoration/vertical-mode-decorations-1-ref.html
new file mode 100644
index 0000000000..e2078fdc39
--- /dev/null
+++ b/layout/reftests/text-decoration/vertical-mode-decorations-1-ref.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<head>
+<meta charset=utf-8>
+<style>
+body { font: 32px Arial, sans-serif; margin: 20px; color: transparent; }
+div { block-size: 10em; inline-size: 10em; margin: 0; padding: 10px;
+ text-align: center; background: #eee; }
+.a { text-decoration: blue solid underline line-through overline; }
+.c { text-decoration: green double underline line-through overline; }
+</style>
+</head>
+<body>
+<div style="transform: rotate(90deg);">
+ hello <span class=a>hello</span> <span class=c>hello</span>
+</div>
diff --git a/layout/reftests/text-decoration/vertical-mode-decorations-1.html b/layout/reftests/text-decoration/vertical-mode-decorations-1.html
new file mode 100644
index 0000000000..2c14b80b13
--- /dev/null
+++ b/layout/reftests/text-decoration/vertical-mode-decorations-1.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<head>
+<meta charset=utf-8>
+<style>
+body { font: 32px Arial, sans-serif; margin: 20px; color: transparent; }
+div { block-size: 10em; inline-size: 10em; margin: 0; padding: 10px;
+ text-align: center; background: #eee; }
+.a { text-decoration: blue solid underline line-through overline; }
+.c { text-decoration: green double underline line-through overline; }
+</style>
+</head>
+<body>
+<div style="writing-mode:sideways-rl;">
+ hello <span class=a>hello</span> <span class=c>hello</span>
+</div>
diff --git a/layout/reftests/text-decoration/vertical-mode-decorations-2-ref.html b/layout/reftests/text-decoration/vertical-mode-decorations-2-ref.html
new file mode 100644
index 0000000000..a410fa3bc6
--- /dev/null
+++ b/layout/reftests/text-decoration/vertical-mode-decorations-2-ref.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<head>
+<meta charset=utf-8>
+<style>
+body { font: 32px Arial, sans-serif; margin: 20px; color: transparent; }
+div { block-size: 10em; inline-size: 10em; margin: 0; padding: 10px;
+ text-align: center; background: #eee; }
+.a { text-decoration: blue solid underline line-through overline; }
+.c { text-decoration: green double underline line-through overline; }
+</style>
+</head>
+<body>
+<div style="transform: rotate(-90deg);">
+ hello <span class=a>hello</span> <span class=c>hello</span>
+</div>
diff --git a/layout/reftests/text-decoration/vertical-mode-decorations-2.html b/layout/reftests/text-decoration/vertical-mode-decorations-2.html
new file mode 100644
index 0000000000..72bdfca999
--- /dev/null
+++ b/layout/reftests/text-decoration/vertical-mode-decorations-2.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<head>
+<meta charset=utf-8>
+<style>
+body { font: 32px Arial, sans-serif; margin: 20px; color: transparent; }
+div { block-size: 10em; inline-size: 10em; margin: 0; padding: 10px;
+ text-align: center; background: #eee; }
+.a { text-decoration: blue solid underline line-through overline; }
+.c { text-decoration: green double underline line-through overline; }
+</style>
+</head>
+<body>
+<div style="writing-mode:sideways-lr;">
+ hello <span class=a>hello</span> <span class=c>hello</span>
+</div>