Add m-esr52 at 52.6.0

author: Matt A. Tobin <mattatobin@localhost.localdomain> 2018-02-02 04:16:08 -0500
committer: Matt A. Tobin <mattatobin@localhost.localdomain> 2018-02-02 04:16:08 -0500
commit: 5f8de423f190bbb79a62f804151bc24824fa32d8 (patch)
tree: 10027f336435511475e392454359edea8e25895d /layout/reftests/svg/text
parent: 49ee0794b5d912db1f95dce6eb52d781dc210db5 (diff)
download: UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.gz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.lz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.xz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.zip
319 files changed, 4443 insertions, 0 deletions
diff --git a/layout/reftests/svg/text/clipPath-applied-ref.svg b/layout/reftests/svg/text/clipPath-applied-ref.svg
new file mode 100644
index 000000000..e628a865c
--- /dev/null
+++ b/layout/reftests/svg/text/clipPath-applied-ref.svg
@@ -0,0 +1,23 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <g style="font: 32px Ahem; fill: blue; white-space: pre">
+    <text x="20" y="100">one</text>
+    <text x="20" y="200">three</text>
+    <text x="20" y="150" text-decoration="line-through">   </text>
+    <text x="20" y="250" text-decoration="line-through">   </text>
+  </g>
+  <rect x="100" width="300" height="400" fill="white"/>
+  <g fill="none" stroke="black" stroke-width="4" shape-rendering="crispEdges">
+    <rect x="20" y="73" width="96" height="32"/>
+    <rect x="20" y="173" width="96" height="32"/>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/clipPath-applied.svg b/layout/reftests/svg/text/clipPath-applied.svg
new file mode 100644
index 000000000..ba213f8bc
--- /dev/null
+++ b/layout/reftests/svg/text/clipPath-applied.svg
@@ -0,0 +1,29 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <defs>
+    <clipPath id="c" x="0" y="0" width="600" height="400">
+      <rect width="100" height="400"/>
+    </clipPath>
+  </defs>
+  <g style="font: 32px Ahem; fill: blue; white-space: pre">
+    <text x="20" y="100" clip-path="url(#c)">one</text>
+    <text x="20" y="150" clip-path="url(#c)" style="text-decoration: line-through">   </text>
+    <g clip-path="url(#c)">
+      <text x="20" y="200">three</text>
+      <text x="20" y="250" style="text-decoration: line-through">   </text>
+    </g>
+  </g>
+  <g fill="none" stroke="black" stroke-width="4" shape-rendering="crispEdges">
+    <rect x="20" y="73" width="96" height="32"/>
+    <rect x="20" y="173" width="96" height="32"/>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/clipPath-content-2-ref.svg b/layout/reftests/svg/text/clipPath-content-2-ref.svg
new file mode 100644
index 000000000..9404d5a49
--- /dev/null
+++ b/layout/reftests/svg/text/clipPath-content-2-ref.svg
@@ -0,0 +1,25 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <!-- We stick this in a pattern instead of rendering the <text> elements
+       directly so that it gets the same mFontSizeScaleFactor, and thus
+       will get the same thickness text decoration line. -->
+  <pattern id="p" x="0" y="0" width="600" height="400" patternUnits="userSpaceOnUse">
+    <g style="font: 32px Ahem; white-space: pre; fill: blue">
+      <text x="20" y="100">one</text>
+      <text x="20" y="150" style="text-decoration: line-through">   </text>
+    </g>
+  </pattern>
+  <rect width="600" height="400" fill="url(#p)"/>
+  <g fill="none" stroke="black" stroke-width="4" shape-rendering="crispEdges">
+    <rect x="20" y="73" width="96" height="32"/>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/clipPath-content-2.svg b/layout/reftests/svg/text/clipPath-content-2.svg
new file mode 100644
index 000000000..fb3483641
--- /dev/null
+++ b/layout/reftests/svg/text/clipPath-content-2.svg
@@ -0,0 +1,42 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" class="reftest-wait">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <defs>
+    <clipPath id="c" x="0" y="0" width="600" height="400">
+      <text x="20" y="100" style="font: 32px Ahem; white-space: pre">one</text>
+      <text x="20" y="150" style="font: 32px Ahem; white-space: pre; text-decoration: line-through">   </text>
+    </clipPath>
+  </defs>
+  <rect x="0" y="0" width="600" height="400" fill="blue" clip-path="url(#c)"/>
+  <g fill="none" stroke="black" stroke-width="4" shape-rendering="crispEdges">
+    <rect x="20" y="73" width="96" height="32"/>
+  </g>
+  <script>
+    function waitUntilFontLoaded() {
+      var canvas = document.createElementNS("http://www.w3.org/1999/xhtml", "canvas");
+      canvas.width = 100;
+      canvas.height = 100;
+      var ctx = canvas.getContext("2d");
+      ctx.font = "100px Ahem";
+      ctx.fillText("_", 0, 100);
+      var img = ctx.getImageData(50, 50, 1, 1);
+      if (img.data[3] == 255) {
+        setTimeout(function() {
+          document.documentElement.removeAttribute("class");
+        }, 1);
+      } else {
+        setTimeout(waitUntilFontLoaded, 200);
+      }
+    }
+
+    setTimeout(waitUntilFontLoaded, 200);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/clipPath-content-ref.svg b/layout/reftests/svg/text/clipPath-content-ref.svg
new file mode 100644
index 000000000..4a37d4475
--- /dev/null
+++ b/layout/reftests/svg/text/clipPath-content-ref.svg
@@ -0,0 +1,18 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <g style="font: 32px Ahem; white-space: pre; fill: blue">
+    <text x="20" y="100">one</text>
+  </g>
+  <g fill="none" stroke="black" stroke-width="4" shape-rendering="crispEdges">
+    <rect x="20" y="73" width="96" height="32"/>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/clipPath-content.svg b/layout/reftests/svg/text/clipPath-content.svg
new file mode 100644
index 000000000..a365b002a
--- /dev/null
+++ b/layout/reftests/svg/text/clipPath-content.svg
@@ -0,0 +1,41 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" class="reftest-wait">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <defs>
+    <clipPath id="c" x="0" y="0" width="600" height="400">
+      <text x="20" y="100" style="font: 32px Ahem; white-space: pre">one</text>
+    </clipPath>
+  </defs>
+  <rect x="0" y="0" width="600" height="400" fill="blue" clip-path="url(#c)"/>
+  <g fill="none" stroke="black" stroke-width="4" shape-rendering="crispEdges">
+    <rect x="20" y="73" width="96" height="32"/>
+  </g>
+  <script>
+    function waitUntilFontLoaded() {
+      var canvas = document.createElementNS("http://www.w3.org/1999/xhtml", "canvas");
+      canvas.width = 100;
+      canvas.height = 100;
+      var ctx = canvas.getContext("2d");
+      ctx.font = "100px Ahem";
+      ctx.fillText("_", 0, 100);
+      var img = ctx.getImageData(50, 50, 1, 1);
+      if (img.data[3] == 255) {
+        setTimeout(function() {
+          document.documentElement.removeAttribute("class");
+        }, 1);
+      } else {
+        setTimeout(waitUntilFontLoaded, 200);
+      }
+    }
+
+    setTimeout(waitUntilFontLoaded, 200);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/deselectAll-ref.svg b/layout/reftests/svg/text/deselectAll-ref.svg
new file mode 100644
index 000000000..228b0755d
--- /dev/null
+++ b/layout/reftests/svg/text/deselectAll-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/deselectAll.svg b/layout/reftests/svg/text/deselectAll.svg
new file mode 100644
index 000000000..6c0c18d2b
--- /dev/null
+++ b/layout/reftests/svg/text/deselectAll.svg
@@ -0,0 +1,14 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>hello</text>
+  </g>
+  <script>
+    var text = document.getElementsByTagName("text")[0];
+    text.selectSubString(1, 3);
+    document.documentElement.deselectAll();
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/display-none-1.svg b/layout/reftests/svg/text/display-none-1.svg
new file mode 100644
index 000000000..f24835479
--- /dev/null
+++ b/layout/reftests/svg/text/display-none-1.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text><tspan display="none">xx</tspan>hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/display-none-2.svg b/layout/reftests/svg/text/display-none-2.svg
new file mode 100644
index 000000000..cec10efd2
--- /dev/null
+++ b/layout/reftests/svg/text/display-none-2.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>he<tspan display="none">xx</tspan>llo</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/display-none-3.svg b/layout/reftests/svg/text/display-none-3.svg
new file mode 100644
index 000000000..9d616067b
--- /dev/null
+++ b/layout/reftests/svg/text/display-none-3.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>hello<tspan display="none">xx</tspan></text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/display-none-4.svg b/layout/reftests/svg/text/display-none-4.svg
new file mode 100644
index 000000000..84fa85744
--- /dev/null
+++ b/layout/reftests/svg/text/display-none-4.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200"
+     style="font: 16px sans-serif">
+  <text x="100" y="100">hello</text>
+  <text x="100" y="200"><textPath display="none">f</textPath></text>
+</svg>
diff --git a/layout/reftests/svg/text/dynamic-dominant-baseline-ref.svg b/layout/reftests/svg/text/dynamic-dominant-baseline-ref.svg
new file mode 100644
index 000000000..f8b095620
--- /dev/null
+++ b/layout/reftests/svg/text/dynamic-dominant-baseline-ref.svg
@@ -0,0 +1,7 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <text x="100" y="100" font-family="sans-serif" dominant-baseline="central">hello <tspan font-size="48px">there</tspan></text>
+</svg>
diff --git a/layout/reftests/svg/text/dynamic-dominant-baseline.svg b/layout/reftests/svg/text/dynamic-dominant-baseline.svg
new file mode 100644
index 000000000..5a05b801c
--- /dev/null
+++ b/layout/reftests/svg/text/dynamic-dominant-baseline.svg
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" class="reftest-wait">
+  <text x="100" y="100" font-family="sans-serif">hello <tspan font-size="48px">there</tspan></text>
+  <script>
+    function f() {
+      document.getElementsByTagName("text")[0].style.dominantBaseline = "central";
+      document.documentElement.removeAttribute("class");
+    }
+
+    window.addEventListener("MozReftestInvalidate", f, false);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/dynamic-font-size-2-ref.svg b/layout/reftests/svg/text/dynamic-font-size-2-ref.svg
new file mode 100644
index 000000000..d4f0a7a96
--- /dev/null
+++ b/layout/reftests/svg/text/dynamic-font-size-2-ref.svg
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    svg { font: 32px sans-serif; }
+  </style>
+  <defs>
+    <mask id="m" x="0" y="0" width="600" height="400">
+      <text x="100" y="100" fill="white"><tspan>abc</tspan><tspan>def</tspan></text>
+    </mask>
+  </defs>
+  <rect width="600" height="400" fill="blue" mask="url(#m)"/>
+</svg>
diff --git a/layout/reftests/svg/text/dynamic-font-size-2.svg b/layout/reftests/svg/text/dynamic-font-size-2.svg
new file mode 100644
index 000000000..3e9a0ced3
--- /dev/null
+++ b/layout/reftests/svg/text/dynamic-font-size-2.svg
@@ -0,0 +1,28 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" class="reftest-wait">
+  <!--
+    This tests that a style change on a <text> element within a resource
+    element like <mask> will cause a reflow of the <text>.
+  -->
+  <style>
+    svg { font: 16px sans-serif; }
+    svg.a { font-size: 32px; }
+  </style>
+  <defs>
+    <mask id="m" x="0" y="0" width="600" height="400">
+      <text x="100" y="100" fill="white"><tspan>abc</tspan><tspan>def</tspan></text>
+    </mask>
+  </defs>
+  <rect width="600" height="400" fill="blue" mask="url(#m)"/>
+  <script>
+    function doTest() {
+      document.documentElement.setAttribute("class", "a");
+    }
+
+    window.addEventListener("MozReftestInvalidate", doTest, false);
+    window.setTimeout(doTest, 4000); // fallback for running outside reftest
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/dynamic-font-size-3-ref.svg b/layout/reftests/svg/text/dynamic-font-size-3-ref.svg
new file mode 100644
index 000000000..a2f5e5f8e
--- /dev/null
+++ b/layout/reftests/svg/text/dynamic-font-size-3-ref.svg
@@ -0,0 +1,17 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    g { font: 32px sans-serif; }
+  </style>
+  <defs>
+    <g>
+      <mask id="m" x="0" y="0" width="600" height="400">
+        <text x="100" y="100" fill="white"><tspan>abc</tspan><tspan>def</tspan></text>
+      </mask>
+    </g>
+  </defs>
+  <rect width="600" height="400" fill="blue" mask="url(#m)"/>
+</svg>
diff --git a/layout/reftests/svg/text/dynamic-font-size-3.svg b/layout/reftests/svg/text/dynamic-font-size-3.svg
new file mode 100644
index 000000000..c7f1dcb1d
--- /dev/null
+++ b/layout/reftests/svg/text/dynamic-font-size-3.svg
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" class="reftest-wait">
+  <!--
+    This tests that a style change on a <text> element within a resource
+    element like <mask> will cause a reflow of the <text>.
+  -->
+  <style>
+    g { font: 16px sans-serif; }
+    g.a { font-size: 32px; }
+  </style>
+  <defs>
+    <g>
+      <mask id="m" x="0" y="0" width="600" height="400">
+        <text x="100" y="100" fill="white"><tspan>abc</tspan><tspan>def</tspan></text>
+      </mask>
+    </g>
+  </defs>
+  <rect width="600" height="400" fill="blue" mask="url(#m)"/>
+  <script>
+    function doTest() {
+      document.querySelector("g").setAttribute("class", "a");
+      document.documentElement.removeAttribute("class");
+    }
+
+    window.addEventListener("MozReftestInvalidate", doTest, false);
+    window.setTimeout(doTest, 4000); // fallback for running outside reftest
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/dynamic-font-size-4-ref.svg b/layout/reftests/svg/text/dynamic-font-size-4-ref.svg
new file mode 100644
index 000000000..62d280caf
--- /dev/null
+++ b/layout/reftests/svg/text/dynamic-font-size-4-ref.svg
@@ -0,0 +1,17 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    g text { font: 32px sans-serif; }
+  </style>
+  <defs>
+    <g>
+      <mask id="m" x="0" y="0" width="600" height="400">
+        <text x="100" y="100" fill="white"><tspan>abc</tspan><tspan>def</tspan></text>
+      </mask>
+    </g>
+  </defs>
+  <rect width="600" height="400" fill="blue" mask="url(#m)"/>
+</svg>
diff --git a/layout/reftests/svg/text/dynamic-font-size-4.svg b/layout/reftests/svg/text/dynamic-font-size-4.svg
new file mode 100644
index 000000000..4131e08e1
--- /dev/null
+++ b/layout/reftests/svg/text/dynamic-font-size-4.svg
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" class="reftest-wait">
+  <!--
+    This tests that a style change on a <text> element within a resource
+    element like <mask> will cause a reflow of the <text>.
+  -->
+  <style>
+    g text { font: 16px sans-serif; }
+    g.a text { font-size: 32px; }
+  </style>
+  <defs>
+    <g>
+      <mask id="m" x="0" y="0" width="600" height="400">
+        <text x="100" y="100" fill="white"><tspan>abc</tspan><tspan>def</tspan></text>
+      </mask>
+    </g>
+  </defs>
+  <rect width="600" height="400" fill="blue" mask="url(#m)"/>
+  <script>
+    function doTest() {
+      document.querySelector("g").setAttribute("class", "a");
+      document.documentElement.removeAttribute("class");
+    }
+
+    window.addEventListener("MozReftestInvalidate", doTest, false);
+    window.setTimeout(doTest, 4000); // fallback for running outside reftest
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/dynamic-font-size-ref.svg b/layout/reftests/svg/text/dynamic-font-size-ref.svg
new file mode 100644
index 000000000..64879d3ee
--- /dev/null
+++ b/layout/reftests/svg/text/dynamic-font-size-ref.svg
@@ -0,0 +1,7 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <text x="100" y="100" style="font: 16px sans-serif">hello there</text>
+</svg>
diff --git a/layout/reftests/svg/text/dynamic-font-size.svg b/layout/reftests/svg/text/dynamic-font-size.svg
new file mode 100644
index 000000000..f7a55bd89
--- /dev/null
+++ b/layout/reftests/svg/text/dynamic-font-size.svg
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" class="reftest-wait">
+  <text x="100" y="100" style="font: 32px sans-serif"><tspan>hello</tspan> there</text>
+  <script>
+    function f() {
+      document.getElementsByTagName("text")[0].style.fontSize = "16px";
+      document.documentElement.removeAttribute("class");
+    }
+
+    window.addEventListener("MozReftestInvalidate", f, false);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/dynamic-multiple-x-ref.svg b/layout/reftests/svg/text/dynamic-multiple-x-ref.svg
new file mode 100644
index 000000000..b0ecda41d
--- /dev/null
+++ b/layout/reftests/svg/text/dynamic-multiple-x-ref.svg
@@ -0,0 +1,13 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" style="font: 16px sans-serif">
+  <text x="100 150 200 250" y="50">34</text>
+  <text x="100 150 200 250" y="100">34</text>
+  <text x="100 150 200 250" y="150">1234</text>
+  <text x="200 250" y="200">34</text>
+  <text x="100 150 200 250 300 350" y="250">123456</text>
+  <text x="100 150 300 350" y="300">1256</text>
+  <text x="200 250" y="350">34</text>
+</svg>
diff --git a/layout/reftests/svg/text/dynamic-multiple-x.svg b/layout/reftests/svg/text/dynamic-multiple-x.svg
new file mode 100644
index 000000000..23f2b20f6
--- /dev/null
+++ b/layout/reftests/svg/text/dynamic-multiple-x.svg
@@ -0,0 +1,55 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" class="reftest-wait" style="font: 16px sans-serif">
+  <text x="100 150 200 250" y="50"><tspan>12</tspan>34</text>
+  <text x="100 150 200 250" y="100"><tspan display="none">12</tspan>34</text>
+  <text x="100 150 200 250" y="150">34</text>
+  <text x="100 150 200 250" y="200">34</text>
+  <text x="100 150 200 250 300 350" y="250"><tspan>12</tspan>56</text>
+  <text x="100 150 200 250 300 350" y="300"><tspan>12</tspan>56</text>
+  <text x="100 150 200 250" y="350"><tspan display="none"/>34</text>
+
+  <script>
+    function newTSpan(s) {
+      var e = document.createElementNS("http://www.w3.org/2000/svg", "tspan");
+      e.textContent = s;
+      return e;
+    }
+
+    function f() {
+      window.removeEventListener("MozAfterPaint", f);
+
+      var t = document.getElementsByTagName("text");
+      var e;
+
+      t[0].removeChild(t[0].firstChild);
+
+      t[1].removeChild(t[1].firstChild);
+
+      e = newTSpan("12");
+      t[2].insertBefore(e, t[2].firstChild);
+
+      e = newTSpan("12");
+      e.setAttribute("display", "none");
+      t[3].insertBefore(e, t[3].firstChild);
+
+      e = newTSpan("34");
+      t[4].firstChild.appendChild(e);
+
+      e = newTSpan("34");
+      e.setAttribute("display", "none");
+      t[5].firstChild.appendChild(e);
+
+      e = newTSpan("12");
+      t[6].firstChild.appendChild(e);
+
+      setTimeout(function() {
+        document.documentElement.removeAttribute("class");
+      }, 0);
+    }
+
+    window.addEventListener("MozAfterPaint", f, false);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/dynamic-non-scaling-stroke-ref.svg b/layout/reftests/svg/text/dynamic-non-scaling-stroke-ref.svg
new file mode 100644
index 000000000..8fb57ed2c
--- /dev/null
+++ b/layout/reftests/svg/text/dynamic-non-scaling-stroke-ref.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" style="font: 32px sans-serif; text-rendering: geometricPrecision">
+  <text x="100" y="100" stroke="blue" stroke-width="5"><tspan>hello</tspan> there</text>
+
+  <text x="100" y="160" stroke="blue" stroke-width="5"><tspan>hello</tspan> there</text>
+
+  <text x="100" y="220" stroke="blue" stroke-width="5"><tspan>hello</tspan> there</text>
+</svg>
diff --git a/layout/reftests/svg/text/dynamic-non-scaling-stroke.svg b/layout/reftests/svg/text/dynamic-non-scaling-stroke.svg
new file mode 100644
index 000000000..ea3ba1990
--- /dev/null
+++ b/layout/reftests/svg/text/dynamic-non-scaling-stroke.svg
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" class="reftest-wait">
+  <title>Test non-scaling-stroke repainting when ancestor transforms change</title>
+  <!-- From https://bugzilla.mozilla.org/show_bug.cgi?id=875069 -->
+<style>
+  .noscale {
+    vector-effect: non-scaling-stroke;
+  }
+</style>
+  <script>
+
+function doTest() {
+  document.getElementById("g").setAttribute("transform", "scale(2)");
+  document.documentElement.removeAttribute('class');
+}
+
+document.addEventListener("MozReftestInvalidate", doTest, false);
+setTimeout(doTest, 4000); // fallback for running outside reftest
+
+  </script>
+  <g id="g" style="font: 16px sans-serif; text-rendering: geometricPrecision">
+    <text x="50" y="50" stroke="blue" stroke-width="5" class="noscale"><tspan class="noscale">hello</tspan> there</text>
+
+    <text x="50" y="80" stroke="blue" stroke-width="2.5"><tspan class="noscale" stroke-width="5">hello</tspan> there</text>
+
+    <text x="50" y="110" stroke="blue" stroke-width="5" class="noscale"><tspan stroke-width="2.5">hello</tspan> there</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/dynamic-text-shadow.svg b/layout/reftests/svg/text/dynamic-text-shadow.svg
new file mode 100644
index 000000000..469eaa602
--- /dev/null
+++ b/layout/reftests/svg/text/dynamic-text-shadow.svg
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" class="reftest-wait">
+  <text x="30" y="30" fill="green" style="text-shadow: #cc9900 20px 12px 2px">Hello</text>
+  <script>
+    function f() {
+      document.getElementsByTagName("text")[0].style.textShadow = "grey 3px 3px";
+      document.documentElement.removeAttribute("class");
+    }
+
+    window.addEventListener("MozReftestInvalidate", f, false);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/filter-applied-ref.svg b/layout/reftests/svg/text/filter-applied-ref.svg
new file mode 100644
index 000000000..cd55e7e3f
--- /dev/null
+++ b/layout/reftests/svg/text/filter-applied-ref.svg
@@ -0,0 +1,33 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <defs>
+    <filter id="f" x="0" y="0" width="150%" height="100%" filterUnits="objectBoundingBox">
+      <feFlood flood-color="yellow" result="flood"/>
+      <feMerge>
+        <feMergeNode in="flood"/>
+        <feMergeNode in="SourceGraphic"/>
+      </feMerge>
+    </filter>
+  </defs>
+  <g style="font: 32px Ahem; fill: blue">
+    <rect x="20" y="74" width="96" height="32" filter="url(#f)"/>
+    <g filter="url(#f)">
+      <rect x="20" y="174" width="160" height="32"/>
+    </g>
+  </g>
+  <g fill="none" stroke="black" stroke-width="4" shape-rendering="crispEdges">
+    <rect x="20" y="73" width="96" height="32"/>
+    <rect x="20" y="73" width="144" height="32"/>
+    <rect x="20" y="173" width="160" height="32"/>
+    <rect x="20" y="173" width="240" height="32"/>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/filter-applied.svg b/layout/reftests/svg/text/filter-applied.svg
new file mode 100644
index 000000000..a60b6571c
--- /dev/null
+++ b/layout/reftests/svg/text/filter-applied.svg
@@ -0,0 +1,40 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <defs>
+    <filter id="f1" x="20" y="73" width="144" height="32" filterUnits="userSpaceOnUse">
+      <feFlood flood-color="yellow" result="flood"/>
+      <feMerge>
+        <feMergeNode in="flood"/>
+        <feMergeNode in="SourceGraphic"/>
+      </feMerge>
+    </filter>
+    <filter id="f2" x="20" y="173" width="240" height="32" filterUnits="userSpaceOnUse">
+      <feFlood flood-color="yellow" result="flood"/>
+      <feMerge>
+        <feMergeNode in="flood"/>
+        <feMergeNode in="SourceGraphic"/>
+      </feMerge>
+    </filter>
+  </defs>
+  <g style="font: 32px Ahem; fill: blue">
+    <text x="20" y="100" filter="url(#f1)">one</text>
+    <g filter="url(#f2)">
+      <text x="20" y="200">three</text>
+    </g>
+  </g>
+  <g fill="none" stroke="black" stroke-width="4" shape-rendering="crispEdges">
+    <rect x="20" y="73" width="96" height="32"/>
+    <rect x="20" y="73" width="144" height="32"/>
+    <rect x="20" y="173" width="160" height="32"/>
+    <rect x="20" y="173" width="240" height="32"/>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-before-after.svg b/layout/reftests/svg/text/ignore-before-after.svg
new file mode 100644
index 000000000..8db670fa3
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-before-after.svg
@@ -0,0 +1,13 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <style>
+    text::before { content: "I said '" }
+    text::after { content: "'." }
+    tspan::before { content: "out " }
+    tspan::after { content: " to" }
+  </style>
+  <text x="100" y="100" style="font: 16px sans-serif">hello <tspan>there</tspan> everyone</text>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-border.svg b/layout/reftests/svg/text/ignore-border.svg
new file mode 100644
index 000000000..cb16461f7
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-border.svg
@@ -0,0 +1,7 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <text x="100" y="100" style="font: 16px sans-serif">hello <tspan style="border: 8px solid black">there</tspan> everyone</text>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-display-ref.svg b/layout/reftests/svg/text/ignore-display-ref.svg
new file mode 100644
index 000000000..689bdc5b1
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-display-ref.svg
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="400">
+  <g style="font: 16px sans-serif">
+    <text x="100" y="40">hello there everyone</text>
+    <text x="100" y="60">hello there everyone</text>
+    <text x="100" y="80">hello there everyone</text>
+    <text x="100" y="100">hello there everyone</text>
+    <text x="100" y="120">hello there everyone</text>
+    <text x="100" y="140">hello there everyone</text>
+    <text x="100" y="160">hello there everyone</text>
+    <text x="100" y="180">hello there everyone</text>
+    <text x="100" y="200">hello there everyone</text>
+    <text x="100" y="220">hello there everyone</text>
+    <text x="100" y="240">hello there everyone</text>
+    <text x="100" y="260">hello there everyone</text>
+    <text x="100" y="280">hello there everyone</text>
+
+    <text x="400" y="40">hello there everyone</text>
+    <text x="400" y="60">hello there everyone</text>
+    <text x="400" y="80">hello there everyone</text>
+    <text x="400" y="100">hello there everyone</text>
+    <text x="400" y="120">hello there everyone</text>
+    <text x="400" y="140">hello there everyone</text>
+    <text x="400" y="160">hello there everyone</text>
+    <text x="400" y="180">hello there everyone</text>
+    <text x="400" y="200">hello there everyone</text>
+    <text x="400" y="220">hello there everyone</text>
+    <text x="400" y="240">hello there everyone</text>
+    <text x="400" y="260">hello there everyone</text>
+    <text x="400" y="280">hello there everyone</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-display.svg b/layout/reftests/svg/text/ignore-display.svg
new file mode 100644
index 000000000..17856ad71
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-display.svg
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="400">
+  <g style="font: 16px sans-serif">
+    <text x="100" y="40">hello <tspan style="display: block">there</tspan> everyone</text>
+    <text x="100" y="60">hello <tspan style="display: list-item">there</tspan> everyone</text>
+    <text x="100" y="80">hello <tspan style="display: inline-block">there</tspan> everyone</text>
+    <text x="100" y="100">hello <tspan style="display: table">there</tspan> everyone</text>
+    <text x="100" y="120">hello <tspan style="display: inline-table">there</tspan> everyone</text>
+    <text x="100" y="140">hello <tspan style="display: table-row-group">there</tspan> everyone</text>
+    <text x="100" y="160">hello <tspan style="display: table-header-group">there</tspan> everyone</text>
+    <text x="100" y="180">hello <tspan style="display: table-footer-group">there</tspan> everyone</text>
+    <text x="100" y="200">hello <tspan style="display: table-row">there</tspan> everyone</text>
+    <text x="100" y="220">hello <tspan style="display: table-column-group">there</tspan> everyone</text>
+    <text x="100" y="240">hello <tspan style="display: table-column">there</tspan> everyone</text>
+    <text x="100" y="260">hello <tspan style="display: table-cell">there</tspan> everyone</text>
+    <text x="100" y="280">hello <tspan style="display: table-caption">there</tspan> everyone</text>
+
+    <text x="400" y="40" style="display: block">hello there everyone</text>
+    <text x="400" y="60" style="display: list-item">hello there everyone</text>
+    <text x="400" y="80" style="display: inline-block">hello there everyone</text>
+    <text x="400" y="100" style="display: table">hello there everyone</text>
+    <text x="400" y="120" style="display: inline-table">hello there everyone</text>
+    <text x="400" y="140" style="display: table-row-group">hello there everyone</text>
+    <text x="400" y="160" style="display: table-header-group">hello there everyone</text>
+    <text x="400" y="180" style="display: table-footer-group">hello there everyone</text>
+    <text x="400" y="200" style="display: table-row">hello there everyone</text>
+    <text x="400" y="220" style="display: table-column-group">hello there everyone</text>
+    <text x="400" y="240" style="display: table-column">hello there everyone</text>
+    <text x="400" y="260" style="display: table-cell">hello there everyone</text>
+    <text x="400" y="280" style="display: table-caption">hello there everyone</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-float-first-letter.svg b/layout/reftests/svg/text/ignore-float-first-letter.svg
new file mode 100644
index 000000000..94ca633d6
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-float-first-letter.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <style>
+    text:first-letter { float: right }
+  </style>
+  <text x="100" y="100" style="font: 16px sans-serif">hello there everyone</text>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-float.svg b/layout/reftests/svg/text/ignore-float.svg
new file mode 100644
index 000000000..cb4b72898
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-float.svg
@@ -0,0 +1,7 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <text x="100" y="100" style="font: 16px sans-serif">hello <tspan style="float: right">there</tspan> everyone</text>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-invalid-child-2-ref.svg b/layout/reftests/svg/text/ignore-invalid-child-2-ref.svg
new file mode 100644
index 000000000..ece0929dd
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-invalid-child-2-ref.svg
@@ -0,0 +1,12 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <text x="100" y="100" style="font: 16px sans-serif">
+    <tspan>
+      ab
+      ef
+    </tspan>
+  </text>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-invalid-child-2.svg b/layout/reftests/svg/text/ignore-invalid-child-2.svg
new file mode 100644
index 000000000..0617c4694
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-invalid-child-2.svg
@@ -0,0 +1,13 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <text x="100" y="100" style="font: 16px sans-serif">
+    <tspan>
+      ab
+      <progress xmlns="http://www.w3.org/1999/xhtml">cd</progress>
+      ef
+    </tspan>
+  </text>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-invalid-child-ref.svg b/layout/reftests/svg/text/ignore-invalid-child-ref.svg
new file mode 100644
index 000000000..374010679
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-invalid-child-ref.svg
@@ -0,0 +1,7 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <text x="100" y="100" style="font: 16px sans-serif">abef</text>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-invalid-child.svg b/layout/reftests/svg/text/ignore-invalid-child.svg
new file mode 100644
index 000000000..37f6fa494
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-invalid-child.svg
@@ -0,0 +1,7 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <text x="100" y="100" style="font: 16px sans-serif">ab<a xmlns="data:,">cd</a>ef</text>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-margin.svg b/layout/reftests/svg/text/ignore-margin.svg
new file mode 100644
index 000000000..37d263e7b
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-margin.svg
@@ -0,0 +1,7 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <text x="100" y="100" style="font: 16px sans-serif">hello <tspan style="margin: 20px">there</tspan> everyone</text>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-overflow-scroll.svg b/layout/reftests/svg/text/ignore-overflow-scroll.svg
new file mode 100644
index 000000000..eecc3b32a
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-overflow-scroll.svg
@@ -0,0 +1,7 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <text x="100" y="100" style="font: 16px sans-serif; overflow: scroll">hello <tspan style="display: block; overflow: scroll">there</tspan> everyone</text>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-padding.svg b/layout/reftests/svg/text/ignore-padding.svg
new file mode 100644
index 000000000..3fb410cdb
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-padding.svg
@@ -0,0 +1,7 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <text x="100" y="100" style="font: 16px sans-serif">hello <tspan style="padding: 20px">there</tspan> everyone</text>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-position-ref.svg b/layout/reftests/svg/text/ignore-position-ref.svg
new file mode 100644
index 000000000..3d265f2ab
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-position-ref.svg
@@ -0,0 +1,12 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g style="font: 16px sans-serif">
+    <text x="100" y="40">hello there everyone</text>
+    <text x="100" y="60">hello there everyone</text>
+    <text x="100" y="80">hello there everyone</text>
+    <text x="100" y="100">hello there everyone</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-position.svg b/layout/reftests/svg/text/ignore-position.svg
new file mode 100644
index 000000000..ec0878264
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-position.svg
@@ -0,0 +1,12 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g style="font: 16px sans-serif">
+    <text x="100" y="40">hello <tspan style="position: relative; left: 20px">there</tspan> everyone</text>
+    <text x="100" y="60">hello <tspan style="position: absolute; top: 0; left: 0">there</tspan> everyone</text>
+    <text x="100" y="80">hello <tspan style="position: fixed; top: 0; left: 0">there</tspan> everyone</text>
+    <text x="100" y="100">hello <tspan style="position: sticky; left: 500px">there</tspan> everyone</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-prop-ref.svg b/layout/reftests/svg/text/ignore-prop-ref.svg
new file mode 100644
index 000000000..d0f7035fc
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-prop-ref.svg
@@ -0,0 +1,7 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <text x="100" y="100" style="font: 16px sans-serif">hello there everyone</text>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-text-align-2-ref.svg b/layout/reftests/svg/text/ignore-text-align-2-ref.svg
new file mode 100644
index 000000000..58a786fa6
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-text-align-2-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>Hello.</text>
+    <text y="20">Goodbye.</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-text-align-2.svg b/layout/reftests/svg/text/ignore-text-align-2.svg
new file mode 100644
index 000000000..0210124e8
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-text-align-2.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text style="white-space: pre-line; line-height: 20px; text-align: center">Hello.
+Goodbye.</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-text-align.svg b/layout/reftests/svg/text/ignore-text-align.svg
new file mode 100644
index 000000000..5f072818e
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-text-align.svg
@@ -0,0 +1,7 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <text x="100" y="100" style="font: 16px sans-serif; text-align: center">hello there everyone</text>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-vertical-align-ref.svg b/layout/reftests/svg/text/ignore-vertical-align-ref.svg
new file mode 100644
index 000000000..c4c7995f9
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-vertical-align-ref.svg
@@ -0,0 +1,7 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <text x="100" y="100" style="font: 16px sans-serif">hello <tspan style="font-size: 24px">there</tspan> everyone</text>
+</svg>
diff --git a/layout/reftests/svg/text/ignore-vertical-align.svg b/layout/reftests/svg/text/ignore-vertical-align.svg
new file mode 100644
index 000000000..03612bc77
--- /dev/null
+++ b/layout/reftests/svg/text/ignore-vertical-align.svg
@@ -0,0 +1,7 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <text x="100" y="100" style="font: 16px sans-serif">hello <tspan style="vertical-align: top; font-size: 24px">there</tspan> everyone</text>
+</svg>
diff --git a/layout/reftests/svg/text/link-surrounding.svg b/layout/reftests/svg/text/link-surrounding.svg
new file mode 100644
index 000000000..19e7c562c
--- /dev/null
+++ b/layout/reftests/svg/text/link-surrounding.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="700" height="200">
+  <a xlink:href="data:," transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>hello</text>
+  </a>
+</svg>
diff --git a/layout/reftests/svg/text/mask-applied-ref.svg b/layout/reftests/svg/text/mask-applied-ref.svg
new file mode 100644
index 000000000..e628a865c
--- /dev/null
+++ b/layout/reftests/svg/text/mask-applied-ref.svg
@@ -0,0 +1,23 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <g style="font: 32px Ahem; fill: blue; white-space: pre">
+    <text x="20" y="100">one</text>
+    <text x="20" y="200">three</text>
+    <text x="20" y="150" text-decoration="line-through">   </text>
+    <text x="20" y="250" text-decoration="line-through">   </text>
+  </g>
+  <rect x="100" width="300" height="400" fill="white"/>
+  <g fill="none" stroke="black" stroke-width="4" shape-rendering="crispEdges">
+    <rect x="20" y="73" width="96" height="32"/>
+    <rect x="20" y="173" width="96" height="32"/>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/mask-applied.svg b/layout/reftests/svg/text/mask-applied.svg
new file mode 100644
index 000000000..36f1ad380
--- /dev/null
+++ b/layout/reftests/svg/text/mask-applied.svg
@@ -0,0 +1,29 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <defs>
+    <mask id="m" x="0" y="0" width="600" height="400">
+      <rect width="100" height="400" fill="white"/>
+    </mask>
+  </defs>
+  <g style="font: 32px Ahem; fill: blue; white-space: pre">
+    <text x="20" y="100" mask="url(#m)">one</text>
+    <text x="20" y="150" mask="url(#m)" style="text-decoration: line-through">   </text>
+    <g mask="url(#m)">
+      <text x="20" y="200">three</text>
+      <text x="20" y="250" style="text-decoration: line-through">   </text>
+    </g>
+  </g>
+  <g fill="none" stroke="black" stroke-width="4" shape-rendering="crispEdges">
+    <rect x="20" y="73" width="96" height="32"/>
+    <rect x="20" y="173" width="96" height="32"/>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/mask-content-2-ref.svg b/layout/reftests/svg/text/mask-content-2-ref.svg
new file mode 100644
index 000000000..9404d5a49
--- /dev/null
+++ b/layout/reftests/svg/text/mask-content-2-ref.svg
@@ -0,0 +1,25 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <!-- We stick this in a pattern instead of rendering the <text> elements
+       directly so that it gets the same mFontSizeScaleFactor, and thus
+       will get the same thickness text decoration line. -->
+  <pattern id="p" x="0" y="0" width="600" height="400" patternUnits="userSpaceOnUse">
+    <g style="font: 32px Ahem; white-space: pre; fill: blue">
+      <text x="20" y="100">one</text>
+      <text x="20" y="150" style="text-decoration: line-through">   </text>
+    </g>
+  </pattern>
+  <rect width="600" height="400" fill="url(#p)"/>
+  <g fill="none" stroke="black" stroke-width="4" shape-rendering="crispEdges">
+    <rect x="20" y="73" width="96" height="32"/>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/mask-content-2.svg b/layout/reftests/svg/text/mask-content-2.svg
new file mode 100644
index 000000000..06d487d2a
--- /dev/null
+++ b/layout/reftests/svg/text/mask-content-2.svg
@@ -0,0 +1,44 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" class="reftest-wait">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <defs>
+    <mask id="m" x="0" y="0" width="600" height="400">
+      <g style="font: 32px Ahem; white-space: pre; fill: white">
+        <text x="20" y="100">one</text>
+        <text x="20" y="150" style="text-decoration: line-through">   </text>
+      </g>
+    </mask>
+  </defs>
+  <rect x="0" y="0" width="600" height="400" fill="blue" mask="url(#m)"/>
+  <g fill="none" stroke="black" stroke-width="4" shape-rendering="crispEdges">
+    <rect x="20" y="73" width="96" height="32"/>
+  </g>
+  <script>
+    function waitUntilFontLoaded() {
+      var canvas = document.createElementNS("http://www.w3.org/1999/xhtml", "canvas");
+      canvas.width = 100;
+      canvas.height = 100;
+      var ctx = canvas.getContext("2d");
+      ctx.font = "100px Ahem";
+      ctx.fillText("_", 0, 100);
+      var img = ctx.getImageData(50, 50, 1, 1);
+      if (img.data[3] == 255) {
+        setTimeout(function() {
+          document.documentElement.removeAttribute("class");
+        }, 1);
+      } else {
+        setTimeout(waitUntilFontLoaded, 200);
+      }
+    }
+
+    setTimeout(waitUntilFontLoaded, 200);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/mask-content-ref.svg b/layout/reftests/svg/text/mask-content-ref.svg
new file mode 100644
index 000000000..4a37d4475
--- /dev/null
+++ b/layout/reftests/svg/text/mask-content-ref.svg
@@ -0,0 +1,18 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <g style="font: 32px Ahem; white-space: pre; fill: blue">
+    <text x="20" y="100">one</text>
+  </g>
+  <g fill="none" stroke="black" stroke-width="4" shape-rendering="crispEdges">
+    <rect x="20" y="73" width="96" height="32"/>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/mask-content.svg b/layout/reftests/svg/text/mask-content.svg
new file mode 100644
index 000000000..35dfd81c3
--- /dev/null
+++ b/layout/reftests/svg/text/mask-content.svg
@@ -0,0 +1,43 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" class="reftest-wait">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <defs>
+    <mask id="m" x="0" y="0" width="600" height="400">
+      <g style="font: 32px Ahem; white-space: pre; fill: white">
+        <text x="20" y="100">one</text>
+      </g>
+    </mask>
+  </defs>
+  <rect x="0" y="0" width="600" height="400" fill="blue" mask="url(#m)"/>
+  <g fill="none" stroke="black" stroke-width="4" shape-rendering="crispEdges">
+    <rect x="20" y="73" width="96" height="32"/>
+  </g>
+  <script>
+    function waitUntilFontLoaded() {
+      var canvas = document.createElementNS("http://www.w3.org/1999/xhtml", "canvas");
+      canvas.width = 100;
+      canvas.height = 100;
+      var ctx = canvas.getContext("2d");
+      ctx.font = "100px Ahem";
+      ctx.fillText("_", 0, 100);
+      var img = ctx.getImageData(50, 50, 1, 1);
+      if (img.data[3] == 255) {
+        setTimeout(function() {
+          document.documentElement.removeAttribute("class");
+        }, 1);
+      } else {
+        setTimeout(waitUntilFontLoaded, 200);
+      }
+    }
+
+    setTimeout(waitUntilFontLoaded, 200);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-bidi-ref.svg b/layout/reftests/svg/text/multiple-chunks-bidi-ref.svg
new file mode 100644
index 000000000..bb8321d7a
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-bidi-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor="end">אב</text>
+    <text x="300" text-anchor="end"><tspan visibility="hidden">אב</tspan>לגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-bidi.svg b/layout/reftests/svg/text/multiple-chunks-bidi.svg
new file mode 100644
index 000000000..5392ecd38
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor='end'>אב<tspan x='300'>ל</tspan>גabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-different-anchor-bidi-ref.svg b/layout/reftests/svg/text/multiple-chunks-different-anchor-bidi-ref.svg
new file mode 100644
index 000000000..23ed5e1cd
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-different-anchor-bidi-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor="end">אב</text>
+    <text x="300" text-anchor="middle"><tspan visibility="hidden">אב</tspan>לגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-different-anchor-bidi.svg b/layout/reftests/svg/text/multiple-chunks-different-anchor-bidi.svg
new file mode 100644
index 000000000..daef0c2ad
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-different-anchor-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor='end'>אב<tspan x='300' text-anchor='middle'>ל</tspan>גabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-different-anchor-ref.svg b/layout/reftests/svg/text/multiple-chunks-different-anchor-ref.svg
new file mode 100644
index 000000000..5ea33edcc
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-different-anchor-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor="end">he</text>
+    <text x="300" text-anchor="middle">llo</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-different-anchor-rtl-ref.svg b/layout/reftests/svg/text/multiple-chunks-different-anchor-rtl-ref.svg
new file mode 100644
index 000000000..0c0156fe5
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-different-anchor-rtl-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100">אב</text>
+    <text x="300" text-anchor="middle">גדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-different-anchor-rtl.svg b/layout/reftests/svg/text/multiple-chunks-different-anchor-rtl.svg
new file mode 100644
index 000000000..11ad06260
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-different-anchor-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' text-anchor='end' direction='rtl'>אב<tspan x='300' text-anchor='middle'>ג</tspan>דה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-different-anchor.svg b/layout/reftests/svg/text/multiple-chunks-different-anchor.svg
new file mode 100644
index 000000000..551741279
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-different-anchor.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' text-anchor='end'>he<tspan x='300' text-anchor='middle'>l</tspan>lo</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-direction-and-anchor-ref.svg b/layout/reftests/svg/text/multiple-chunks-direction-and-anchor-ref.svg
new file mode 100644
index 000000000..77a7b805e
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-direction-and-anchor-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor="end">ab</text>
+    <text x="300" text-anchor="end">cde</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-directions-and-anchor-dx-ref.svg b/layout/reftests/svg/text/multiple-chunks-directions-and-anchor-dx-ref.svg
new file mode 100644
index 000000000..55d9a75ad
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-directions-and-anchor-dx-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' text-anchor='end'>ab<tspan x='300' direction='rtl' text-anchor='start'>c</tspan>de</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-directions-and-anchor-dx.svg b/layout/reftests/svg/text/multiple-chunks-directions-and-anchor-dx.svg
new file mode 100644
index 000000000..97f9b36d8
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-directions-and-anchor-dx.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='90' dx='10' text-anchor='end'>ab<tspan x='280' dx='20' direction='rtl' text-anchor='start'>c</tspan>de</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-directions-and-anchor-multiple-dx-ref.svg b/layout/reftests/svg/text/multiple-chunks-directions-and-anchor-multiple-dx-ref.svg
new file mode 100644
index 000000000..cd128b8d0
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-directions-and-anchor-multiple-dx-ref.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="110" text-anchor="end">ab</text>
+    <text x="290" text-anchor="end">c<tspan visibility="hidden">de</tspan></text>
+    <text x="320" text-anchor="end">de</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-directions-and-anchor-multiple-dx.svg b/layout/reftests/svg/text/multiple-chunks-directions-and-anchor-multiple-dx.svg
new file mode 100644
index 000000000..7703a6986
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-directions-and-anchor-multiple-dx.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' dx='10' text-anchor='end'>ab<tspan x='300' dx='20 30' direction='rtl' text-anchor='start'>cd</tspan>e</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-directions-and-anchor-ref.svg b/layout/reftests/svg/text/multiple-chunks-directions-and-anchor-ref.svg
new file mode 100644
index 000000000..77a7b805e
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-directions-and-anchor-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor="end">ab</text>
+    <text x="300" text-anchor="end">cde</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-directions-and-anchor.svg b/layout/reftests/svg/text/multiple-chunks-directions-and-anchor.svg
new file mode 100644
index 000000000..55d9a75ad
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-directions-and-anchor.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' text-anchor='end'>ab<tspan x='300' direction='rtl' text-anchor='start'>c</tspan>de</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-dx-bidi-ref.svg b/layout/reftests/svg/text/multiple-chunks-dx-bidi-ref.svg
new file mode 100644
index 000000000..5392ecd38
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-dx-bidi-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor='end'>אב<tspan x='300'>ל</tspan>גabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-dx-bidi.svg b/layout/reftests/svg/text/multiple-chunks-dx-bidi.svg
new file mode 100644
index 000000000..e682281a0
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-dx-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="90" dx="10" text-anchor='end'>אב<tspan x='280' dx='20'>ל</tspan>גabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-dx-different-anchor-bidi-ref.svg b/layout/reftests/svg/text/multiple-chunks-dx-different-anchor-bidi-ref.svg
new file mode 100644
index 000000000..daef0c2ad
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-dx-different-anchor-bidi-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor='end'>אב<tspan x='300' text-anchor='middle'>ל</tspan>גabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-dx-different-anchor-bidi.svg b/layout/reftests/svg/text/multiple-chunks-dx-different-anchor-bidi.svg
new file mode 100644
index 000000000..1f7a628ed
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-dx-different-anchor-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="90" dx='10' text-anchor='end'>אב<tspan x='280' dx='20' text-anchor='middle'>ל</tspan>גabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-dx-different-anchor-ref.svg b/layout/reftests/svg/text/multiple-chunks-dx-different-anchor-ref.svg
new file mode 100644
index 000000000..551741279
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-dx-different-anchor-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' text-anchor='end'>he<tspan x='300' text-anchor='middle'>l</tspan>lo</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-dx-different-anchor-rtl-ref.svg b/layout/reftests/svg/text/multiple-chunks-dx-different-anchor-rtl-ref.svg
new file mode 100644
index 000000000..11ad06260
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-dx-different-anchor-rtl-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' text-anchor='end' direction='rtl'>אב<tspan x='300' text-anchor='middle'>ג</tspan>דה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-dx-different-anchor-rtl.svg b/layout/reftests/svg/text/multiple-chunks-dx-different-anchor-rtl.svg
new file mode 100644
index 000000000..b8213875a
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-dx-different-anchor-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='90' dx='10' text-anchor='end' direction='rtl'>אב<tspan x='280' dx='20' text-anchor='middle'>ג</tspan>דה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-dx-different-anchor.svg b/layout/reftests/svg/text/multiple-chunks-dx-different-anchor.svg
new file mode 100644
index 000000000..5c896d887
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-dx-different-anchor.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='90' dx='10' text-anchor='end'>he<tspan x='280' dx='20' text-anchor='middle'>l</tspan>lo</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-dx-ref.svg b/layout/reftests/svg/text/multiple-chunks-dx-ref.svg
new file mode 100644
index 000000000..e0962bbe1
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-dx-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' text-anchor='end'>he<tspan x='300'>l</tspan>lo</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-dx-rtl-ref.svg b/layout/reftests/svg/text/multiple-chunks-dx-rtl-ref.svg
new file mode 100644
index 000000000..dc53101f6
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-dx-rtl-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' text-anchor='end' direction='rtl'>אב<tspan x='300'>ג</tspan>דה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-dx-rtl.svg b/layout/reftests/svg/text/multiple-chunks-dx-rtl.svg
new file mode 100644
index 000000000..0becadf0c
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-dx-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='90' dx='10' text-anchor='end' direction='rtl'>אב<tspan x='280' dx='20'>ג</tspan>דה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-dx.svg b/layout/reftests/svg/text/multiple-chunks-dx.svg
new file mode 100644
index 000000000..d76445310
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-dx.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='90' dx='10' text-anchor='end'>he<tspan x='280' dx='20'>l</tspan>lo</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-fill-color-ref.svg b/layout/reftests/svg/text/multiple-chunks-fill-color-ref.svg
new file mode 100644
index 000000000..ac4703b77
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-fill-color-ref.svg
@@ -0,0 +1,12 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <g fill="blue">
+      <text x="100" text-anchor="end">he</text>
+      <text x="300" text-anchor="end"><tspan fill="green">l</tspan>lo</text>
+    </g>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-fill-color.svg b/layout/reftests/svg/text/multiple-chunks-fill-color.svg
new file mode 100644
index 000000000..13a557a3c
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-fill-color.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' text-anchor='end' fill='blue'>he<tspan x='300' fill='green'>l</tspan>lo</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-multiple-dx-bidi-ref.svg b/layout/reftests/svg/text/multiple-chunks-multiple-dx-bidi-ref.svg
new file mode 100644
index 000000000..eb9ed17d5
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-multiple-dx-bidi-ref.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="110" text-anchor="end">אב</text>
+    <text x="320" text-anchor="end"><tspan visibility="hidden">אבל</tspan>גשabc</text>
+    <text x="270" text-anchor="end"><tspan visibility="hidden">אב</tspan>ל<tspan visibility="hidden">גשabc</tspan></text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-multiple-dx-bidi.svg b/layout/reftests/svg/text/multiple-chunks-multiple-dx-bidi.svg
new file mode 100644
index 000000000..82cb1cbc3
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-multiple-dx-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" dx="10" text-anchor='end'>אב<tspan x='300' dx='20 50'>לג</tspan>שabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-multiple-dx-different-anchor-bidi-ref.svg b/layout/reftests/svg/text/multiple-chunks-multiple-dx-different-anchor-bidi-ref.svg
new file mode 100644
index 000000000..8d590eb66
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-multiple-dx-different-anchor-bidi-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" dx='10' text-anchor='end'>אב</text>
+    <text x='320' dx='0 0 0 30' text-anchor='middle'><tspan visibility="hidden">אב</tspan>לגשabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-multiple-dx-different-anchor-bidi.svg b/layout/reftests/svg/text/multiple-chunks-multiple-dx-different-anchor-bidi.svg
new file mode 100644
index 000000000..391638507
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-multiple-dx-different-anchor-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" dx='10' text-anchor='end'>אב<tspan x='300' dx='20 30' text-anchor='middle'>לג</tspan>שabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-multiple-dx-different-anchor-ref.svg b/layout/reftests/svg/text/multiple-chunks-multiple-dx-different-anchor-ref.svg
new file mode 100644
index 000000000..fe04a27f7
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-multiple-dx-different-anchor-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" dx='10' text-anchor="end">he</text>
+    <text x='300' dx='20 30' text-anchor='middle'>llo</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-multiple-dx-different-anchor-rtl-ref.svg b/layout/reftests/svg/text/multiple-chunks-multiple-dx-different-anchor-rtl-ref.svg
new file mode 100644
index 000000000..af08cca90
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-multiple-dx-different-anchor-rtl-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" dx='10'>אב</text>
+    <text x='320' dx='0 0 0 30' text-anchor='middle'><tspan visibility="hidden">אב</tspan>גדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-multiple-dx-different-anchor-rtl.svg b/layout/reftests/svg/text/multiple-chunks-multiple-dx-different-anchor-rtl.svg
new file mode 100644
index 000000000..5e9c3bdfe
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-multiple-dx-different-anchor-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' dx='10' text-anchor='end' direction='rtl'>אב<tspan x='300' dx='20 30' text-anchor='middle'>גד</tspan>ה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-multiple-dx-different-anchor.svg b/layout/reftests/svg/text/multiple-chunks-multiple-dx-different-anchor.svg
new file mode 100644
index 000000000..739434257
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-multiple-dx-different-anchor.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' dx='10' text-anchor='end'>he<tspan x='300' dx='20 30' text-anchor='middle'>ll</tspan>o</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-multiple-dx-ref.svg b/layout/reftests/svg/text/multiple-chunks-multiple-dx-ref.svg
new file mode 100644
index 000000000..0e1929938
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-multiple-dx-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' dx='10' text-anchor='end'>he</text>
+    <text x='300' dx='20 30' text-anchor="end">llo</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-multiple-dx-rtl-ref.svg b/layout/reftests/svg/text/multiple-chunks-multiple-dx-rtl-ref.svg
new file mode 100644
index 000000000..a708bad73
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-multiple-dx-rtl-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="110">אב</text>
+    <text x="320" dx="0 0 0 30"><tspan visibility="hidden">אב</tspan>גדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-multiple-dx-rtl.svg b/layout/reftests/svg/text/multiple-chunks-multiple-dx-rtl.svg
new file mode 100644
index 000000000..ed9fd85f7
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-multiple-dx-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' dx='10' text-anchor='end' direction='rtl'>אב<tspan x='300' dx='20 30'>גד</tspan>ה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-multiple-dx.svg b/layout/reftests/svg/text/multiple-chunks-multiple-dx.svg
new file mode 100644
index 000000000..60874a6d9
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-multiple-dx.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' dx='10' text-anchor='end'>he<tspan x='300' dx='20 30'>ll</tspan>o</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-ref.svg b/layout/reftests/svg/text/multiple-chunks-ref.svg
new file mode 100644
index 000000000..5e23dac0d
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' text-anchor='end'>he</text>
+    <text x='300' text-anchor='end'>llo</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-rtl-ref.svg b/layout/reftests/svg/text/multiple-chunks-rtl-ref.svg
new file mode 100644
index 000000000..3f104064c
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-rtl-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor="end" direction="rtl">אב</text>
+    <text x="300" text-anchor="end" direction="rtl"><tspan visibility="hidden">אב</tspan>גדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-rtl.svg b/layout/reftests/svg/text/multiple-chunks-rtl.svg
new file mode 100644
index 000000000..dc53101f6
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' text-anchor='end' direction='rtl'>אב<tspan x='300'>ג</tspan>דה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-selection-ref.svg b/layout/reftests/svg/text/multiple-chunks-selection-ref.svg
new file mode 100644
index 000000000..e0f417e31
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-selection-ref.svg
@@ -0,0 +1,17 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' text-anchor='end'>he</text>
+    <text x='300' text-anchor='end'>llo</text>
+  </g>
+  <script>
+    var text = document.getElementsByTagName("text");
+    var range = document.createRange();
+    range.setStart(text[0].firstChild, 1);
+    range.setEnd(text[1].firstChild, 2);
+    window.getSelection().addRange(range);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks-selection.svg b/layout/reftests/svg/text/multiple-chunks-selection.svg
new file mode 100644
index 000000000..12816b189
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks-selection.svg
@@ -0,0 +1,16 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' text-anchor='end'>he<tspan x='300'>l</tspan>lo</text>
+  </g>
+  <script>
+    var text = document.getElementsByTagName("text")[0];
+    var range = document.createRange();
+    range.setStart(text.firstChild, 1);
+    range.setEnd(text.lastChild, 1);
+    window.getSelection().addRange(range);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-chunks.svg b/layout/reftests/svg/text/multiple-chunks.svg
new file mode 100644
index 000000000..e0962bbe1
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-chunks.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' text-anchor='end'>he<tspan x='300'>l</tspan>lo</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-text-selection-ref.html b/layout/reftests/svg/text/multiple-text-selection-ref.html
new file mode 100644
index 000000000..63b15c53d
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-text-selection-ref.html
@@ -0,0 +1,23 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<style>
+html, body { margin: 0 }
+svg, div { display: inline-block; width: 700px; height: 200px }
+div { font: 16px sans-serif }
+#a { margin-left: -700px; vertical-align: 100px }
+#b { margin-left: -700px; vertical-align: 50px }
+span { margin-left: 100px }
+</style>
+<body>
+  <svg></svg><div id=a><span>hello</span></div><div id=b><span>there</span></div>
+  <script>
+    var span = document.getElementsByTagName("span");
+    var range = document.createRange();
+    range.setStart(span[0].firstChild, 1);
+    range.setEnd(span[1].firstChild, 4);
+    window.getSelection().addRange(range);
+  </script>
+</body>
diff --git a/layout/reftests/svg/text/multiple-text-selection.svg b/layout/reftests/svg/text/multiple-text-selection.svg
new file mode 100644
index 000000000..98188b134
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-text-selection.svg
@@ -0,0 +1,17 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>hello</text>
+    <text y="50">there</text>
+  </g>
+  <script>
+    var text = document.getElementsByTagName("text");
+    var range = document.createRange();
+    range.setStart(text[0].firstChild, 1);
+    range.setEnd(text[1].firstChild, 4);
+    window.getSelection().addRange(range);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-anchor-end-bidi-ref.svg b/layout/reftests/svg/text/multiple-x-anchor-end-bidi-ref.svg
new file mode 100644
index 000000000..8ecea9ddc
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-anchor-end-bidi-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor="end">א</text>
+    <text x="200" text-anchor="end"><tspan visibility="hidden" direction="ltr" unicode-bidi="override">א</tspan>בגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-anchor-end-bidi.svg b/layout/reftests/svg/text/multiple-x-anchor-end-bidi.svg
new file mode 100644
index 000000000..6d49872aa
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-anchor-end-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100 200" text-anchor='end'>אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-anchor-end-ref.svg b/layout/reftests/svg/text/multiple-x-anchor-end-ref.svg
new file mode 100644
index 000000000..04aa3c9e9
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-anchor-end-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' text-anchor='end'>h</text>
+    <text x='200' text-anchor='end'>ello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-anchor-end-rtl-ref.svg b/layout/reftests/svg/text/multiple-x-anchor-end-rtl-ref.svg
new file mode 100644
index 000000000..024b35e43
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-anchor-end-rtl-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='300'>א</text>
+    <text x='200'>בגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-anchor-end-rtl.svg b/layout/reftests/svg/text/multiple-x-anchor-end-rtl.svg
new file mode 100644
index 000000000..2c9531e07
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-anchor-end-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='300 200' direction='rtl' text-anchor='end'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-anchor-end.svg b/layout/reftests/svg/text/multiple-x-anchor-end.svg
new file mode 100644
index 000000000..5add7ca56
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-anchor-end.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100 200' text-anchor='end'>hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-bidi-ref.svg b/layout/reftests/svg/text/multiple-x-bidi-ref.svg
new file mode 100644
index 000000000..2be20970e
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-bidi-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100">א</text>
+    <text x="200"><tspan visibility="hidden" direction="ltr" unicode-bidi="override">א</tspan>בגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-bidi.svg b/layout/reftests/svg/text/multiple-x-bidi.svg
new file mode 100644
index 000000000..55f265b9c
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100 200'>אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-dx-anchor-end-bidi.svg b/layout/reftests/svg/text/multiple-x-dx-anchor-end-bidi.svg
new file mode 100644
index 000000000..ca5ae35de
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-dx-anchor-end-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100 200" dx='10' text-anchor='end'>אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-dx-anchor-end-rtl.svg b/layout/reftests/svg/text/multiple-x-dx-anchor-end-rtl.svg
new file mode 100644
index 000000000..c7bb9e1ab
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-dx-anchor-end-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='300 200' dx='10' direction='rtl' text-anchor='end'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-dx-anchor-end.svg b/layout/reftests/svg/text/multiple-x-dx-anchor-end.svg
new file mode 100644
index 000000000..ebf6691fc
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-dx-anchor-end.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100 200' dx='10' text-anchor='end'>hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-dx-bidi-ref.svg b/layout/reftests/svg/text/multiple-x-dx-bidi-ref.svg
new file mode 100644
index 000000000..55f265b9c
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-dx-bidi-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100 200'>אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-dx-bidi.svg b/layout/reftests/svg/text/multiple-x-dx-bidi.svg
new file mode 100644
index 000000000..52b67d925
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-dx-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='90 200' dx='10'>אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-dx-ref.svg b/layout/reftests/svg/text/multiple-x-dx-ref.svg
new file mode 100644
index 000000000..a1e8c7127
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-dx-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100 200'>hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-dx-rtl-ref.svg b/layout/reftests/svg/text/multiple-x-dx-rtl-ref.svg
new file mode 100644
index 000000000..9955e22e9
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-dx-rtl-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text direction='rtl' x='300 200'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-dx-rtl.svg b/layout/reftests/svg/text/multiple-x-dx-rtl.svg
new file mode 100644
index 000000000..f5bc8647d
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-dx-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text direction='rtl' x='290 200' dx='10'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-dx.svg b/layout/reftests/svg/text/multiple-x-dx.svg
new file mode 100644
index 000000000..589d7ef95
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-dx.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='90 200' dx='10'>hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-holes-bidi-ref.svg b/layout/reftests/svg/text/multiple-x-holes-bidi-ref.svg
new file mode 100644
index 000000000..34cf120e2
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-holes-bidi-ref.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100'>א</text>
+    <text x='200'>בל</text>
+    <text x='300'><tspan visibility="hidden">אבל</tspan>גabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-holes-bidi.svg b/layout/reftests/svg/text/multiple-x-holes-bidi.svg
new file mode 100644
index 000000000..429e286fb
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-holes-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100 200'>אבל<tspan x='300'>גa</tspan>bc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-holes-dx-bidi-ref.svg b/layout/reftests/svg/text/multiple-x-holes-dx-bidi-ref.svg
new file mode 100644
index 000000000..429e286fb
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-holes-dx-bidi-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100 200'>אבל<tspan x='300'>גa</tspan>bc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-holes-dx-bidi.svg b/layout/reftests/svg/text/multiple-x-holes-dx-bidi.svg
new file mode 100644
index 000000000..482c1892d
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-holes-dx-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='90 200' dx='10'>אבל<tspan x='280' dx='20'>גa</tspan>bc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-holes-dx-ref.svg b/layout/reftests/svg/text/multiple-x-holes-dx-ref.svg
new file mode 100644
index 000000000..2fb60e161
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-holes-dx-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100 200'>hel<tspan x='300'>l</tspan>o</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-holes-dx-rtl.svg b/layout/reftests/svg/text/multiple-x-holes-dx-rtl.svg
new file mode 100644
index 000000000..8c4b01ecb
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-holes-dx-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100 200' dx='10' direction='rtl'>אבג<tspan x='300' dx='20'>ד</tspan>ה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-holes-dx.svg b/layout/reftests/svg/text/multiple-x-holes-dx.svg
new file mode 100644
index 000000000..e6d0f5d07
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-holes-dx.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='90 200' dx='10'>hel<tspan x='280' dx='20'>l</tspan>o</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-holes-multiple-dx-bidi-ref.svg b/layout/reftests/svg/text/multiple-x-holes-multiple-dx-bidi-ref.svg
new file mode 100644
index 000000000..429e286fb
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-holes-multiple-dx-bidi-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100 200'>אבל<tspan x='300'>גa</tspan>bc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-holes-multiple-dx-bidi.svg b/layout/reftests/svg/text/multiple-x-holes-multiple-dx-bidi.svg
new file mode 100644
index 000000000..203e3f92a
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-holes-multiple-dx-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='90 180' dx='10 20'>אבל<tspan x='270' dx='30'>גa</tspan>bc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-holes-multiple-dx-ref.svg b/layout/reftests/svg/text/multiple-x-holes-multiple-dx-ref.svg
new file mode 100644
index 000000000..2fb60e161
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-holes-multiple-dx-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100 200'>hel<tspan x='300'>l</tspan>o</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-holes-multiple-dx-rtl-ref.svg b/layout/reftests/svg/text/multiple-x-holes-multiple-dx-rtl-ref.svg
new file mode 100644
index 000000000..5ea60be2b
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-holes-multiple-dx-rtl-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100 200' direction='rtl'>אבג<tspan x='300'>ד</tspan>ה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-holes-multiple-dx-rtl.svg b/layout/reftests/svg/text/multiple-x-holes-multiple-dx-rtl.svg
new file mode 100644
index 000000000..93c116801
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-holes-multiple-dx-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='90 180' dx='10 20' direction='rtl'>אבג<tspan x='270' dx='30'>ד</tspan>ה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-holes-multiple-dx.svg b/layout/reftests/svg/text/multiple-x-holes-multiple-dx.svg
new file mode 100644
index 000000000..492c6bca7
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-holes-multiple-dx.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='90 180' dx='10 20'>hel<tspan x='270' dx='30'>l</tspan>o</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-holes-ref.svg b/layout/reftests/svg/text/multiple-x-holes-ref.svg
new file mode 100644
index 000000000..33a4e6e69
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-holes-ref.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100'>h</text>
+    <text x='200'>el</text>
+    <text x='300'>lo</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-holes-rtl-ref.svg b/layout/reftests/svg/text/multiple-x-holes-rtl-ref.svg
new file mode 100644
index 000000000..234917911
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-holes-rtl-ref.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' direction='rtl'>א</text>
+    <text x='200' direction='rtl'>בג</text>
+    <text x='300' direction='rtl'>דה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-holes-rtl.svg b/layout/reftests/svg/text/multiple-x-holes-rtl.svg
new file mode 100644
index 000000000..5ea60be2b
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-holes-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100 200' direction='rtl'>אבג<tspan x='300'>ד</tspan>ה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-holes.svg b/layout/reftests/svg/text/multiple-x-holes.svg
new file mode 100644
index 000000000..2fb60e161
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-holes.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100 200'>hel<tspan x='300'>l</tspan>o</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-multiple-dx-anchor-end-bidi-ref.svg b/layout/reftests/svg/text/multiple-x-multiple-dx-anchor-end-bidi-ref.svg
new file mode 100644
index 000000000..bdb3cd58b
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-multiple-dx-anchor-end-bidi-ref.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="110" text-anchor="end">א</text>
+    <text x="220" text-anchor="end"><tspan visibility="hidden">אב</tspan>גabc</text>
+    <text x="190" text-anchor="end"><tspan visibility="hidden">א</tspan>ב<tspan visibility="hidden">abc</tspan></text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-multiple-dx-anchor-end-bidi.svg b/layout/reftests/svg/text/multiple-x-multiple-dx-anchor-end-bidi.svg
new file mode 100644
index 000000000..0be270e55
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-multiple-dx-anchor-end-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100 200" dx='10 20 30' text-anchor='end'>אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-multiple-dx-anchor-end-ref.svg b/layout/reftests/svg/text/multiple-x-multiple-dx-anchor-end-ref.svg
new file mode 100644
index 000000000..e466df84c
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-multiple-dx-anchor-end-ref.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='110' text-anchor='end'>h</text>
+    <text x='190' text-anchor='end'>e<tspan visibility="hidden">llo</tspan></text>
+    <text x='220' text-anchor='end'>llo</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-multiple-dx-anchor-end-rtl-ref.svg b/layout/reftests/svg/text/multiple-x-multiple-dx-anchor-end-rtl-ref.svg
new file mode 100644
index 000000000..09b0238aa
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-multiple-dx-anchor-end-rtl-ref.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="310">א</text>
+    <text x='250'>ב<tspan visibility="hidden">גדה</tspan></text>
+    <text x='220'><tspan visibility="hidden">ב</tspan>גדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-multiple-dx-anchor-end-rtl.svg b/layout/reftests/svg/text/multiple-x-multiple-dx-anchor-end-rtl.svg
new file mode 100644
index 000000000..80af12be2
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-multiple-dx-anchor-end-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='300 200' dx='10 20 -30' direction='rtl' text-anchor='end'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-multiple-dx-anchor-end.svg b/layout/reftests/svg/text/multiple-x-multiple-dx-anchor-end.svg
new file mode 100644
index 000000000..dae9225b0
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-multiple-dx-anchor-end.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100 200' dx='10 20 30' text-anchor='end'>hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-multiple-dx-bidi-ref.svg b/layout/reftests/svg/text/multiple-x-multiple-dx-bidi-ref.svg
new file mode 100644
index 000000000..ae5f778e2
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-multiple-dx-bidi-ref.svg
@@ -0,0 +1,12 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="110">א</text>
+    <text x="220">ב</text>
+    <text x="250" text-anchor="end">ג</text>
+    <text x="250"><tspan visibility="hidden">אב</tspan>abc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-multiple-dx-bidi.svg b/layout/reftests/svg/text/multiple-x-multiple-dx-bidi.svg
new file mode 100644
index 000000000..d951b6d66
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-multiple-dx-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100 200' dx='10 20 30'>אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-multiple-dx-ref.svg b/layout/reftests/svg/text/multiple-x-multiple-dx-ref.svg
new file mode 100644
index 000000000..b0879a43f
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-multiple-dx-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100 200' dx='10 20 30'>hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-multiple-dx-rtl-ref.svg b/layout/reftests/svg/text/multiple-x-multiple-dx-rtl-ref.svg
new file mode 100644
index 000000000..d1eb6c884
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-multiple-dx-rtl-ref.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="310" text-anchor="end">א</text>
+    <text x="220" text-anchor="end">ב</text>
+    <text x="190" text-anchor="end"><tspan visibility="hidden">ב</tspan>גדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-multiple-dx-rtl.svg b/layout/reftests/svg/text/multiple-x-multiple-dx-rtl.svg
new file mode 100644
index 000000000..ca1c8c64a
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-multiple-dx-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text direction='rtl' x='300 200' dx='10 20 -30'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-multiple-dx.svg b/layout/reftests/svg/text/multiple-x-multiple-dx.svg
new file mode 100644
index 000000000..b0879a43f
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-multiple-dx.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100 200' dx='10 20 30'>hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-percentages-2-iframe-ref.svg b/layout/reftests/svg/text/multiple-x-percentages-2-iframe-ref.svg
new file mode 100644
index 000000000..bf2ff14e3
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-percentages-2-iframe-ref.svg
@@ -0,0 +1,8 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <text x="50 100" y="100" style="font: 16px sans-serif">hello</text>
+  <text x="150" y="100 150" style="font: 16px sans-serif">there</text>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-percentages-2-iframe.svg b/layout/reftests/svg/text/multiple-x-percentages-2-iframe.svg
new file mode 100644
index 000000000..03a336d74
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-percentages-2-iframe.svg
@@ -0,0 +1,8 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <text x="50 50%" y="100" style="font: 16px sans-serif">hello</text>
+  <text x="150" y="100 75%" style="font: 16px sans-serif">there</text>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-percentages-2-ref.html b/layout/reftests/svg/text/multiple-x-percentages-2-ref.html
new file mode 100644
index 000000000..559755532
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-percentages-2-ref.html
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<iframe style="width: 200px; height: 200px; border: 0" src="multiple-x-percentages-2-iframe-ref.svg"></iframe>
diff --git a/layout/reftests/svg/text/multiple-x-percentages-2.html b/layout/reftests/svg/text/multiple-x-percentages-2.html
new file mode 100644
index 000000000..707d12378
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-percentages-2.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html class="reftest-wait">
+<iframe style="width: 400px; height: 400px; border: 0" src="multiple-x-percentages-2-iframe.svg"></iframe>
+<script>
+function doTest() {
+  var iframe = document.querySelector("iframe");
+  iframe.style.width = "200px";
+  iframe.style.height = "200px";
+  document.documentElement.removeAttribute("class");
+}
+
+window.addEventListener("MozReftestInvalidate", doTest, false);
+setTimeout(doTest, 4000); // fallback for running outside reftest
+</script>
diff --git a/layout/reftests/svg/text/multiple-x-percentages-3-iframe-ref.svg b/layout/reftests/svg/text/multiple-x-percentages-3-iframe-ref.svg
new file mode 100644
index 000000000..0e148f425
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-percentages-3-iframe-ref.svg
@@ -0,0 +1,8 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <text x="50 60 70 80 90 100" y="100" style="font: 16px sans-serif">hello!</text>
+  <text x="150" y="100 110 120 130 140 150" style="font: 16px sans-serif">there!</text>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-percentages-3-iframe.svg b/layout/reftests/svg/text/multiple-x-percentages-3-iframe.svg
new file mode 100644
index 000000000..a8d7e937c
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-percentages-3-iframe.svg
@@ -0,0 +1,8 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <text x="50 60 70 80 90 50%" y="100" style="font: 16px sans-serif">hello</text>
+  <text x="150" y="100 110 120 130 140 75%" style="font: 16px sans-serif">there</text>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-percentages-3-ref.html b/layout/reftests/svg/text/multiple-x-percentages-3-ref.html
new file mode 100644
index 000000000..fdf7ad890
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-percentages-3-ref.html
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<iframe style="width: 200px; height: 200px; border: 0" src="multiple-x-percentages-3-iframe-ref.svg"></iframe>
diff --git a/layout/reftests/svg/text/multiple-x-percentages-3.html b/layout/reftests/svg/text/multiple-x-percentages-3.html
new file mode 100644
index 000000000..d9c1ecb1e
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-percentages-3.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<html class="reftest-wait">
+<iframe style="width: 400px; height: 400px; border: 0" src="multiple-x-percentages-3-iframe.svg"></iframe>
+<script>
+var iframe = document.querySelector("iframe");
+
+function doTest() {
+  window.removeEventListener("MozReftestInvalidate", doTest);
+
+  iframe.style.width = "200px";
+  iframe.style.height = "200px";
+
+  var text = iframe.contentDocument.querySelectorAll("text");
+  text[0].firstChild.nodeValue += "!";
+  text[1].firstChild.nodeValue += "!";
+
+  document.documentElement.removeAttribute("class");
+}
+
+window.addEventListener("MozReftestInvalidate", doTest, false);
+</script>
diff --git a/layout/reftests/svg/text/multiple-x-percentages-ref.svg b/layout/reftests/svg/text/multiple-x-percentages-ref.svg
new file mode 100644
index 000000000..78f6ab922
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-percentages-ref.svg
@@ -0,0 +1,8 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200">
+  <text x="50 100" y="100" style="font: 16px sans-serif">hello</text>
+  <text x="150" y="100 150" style="font: 16px sans-serif">there</text>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-percentages.svg b/layout/reftests/svg/text/multiple-x-percentages.svg
new file mode 100644
index 000000000..faf7a64ce
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-percentages.svg
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" class="reftest-wait">
+  <text x="50 50%" y="100" style="font: 16px sans-serif">hello</text>
+  <text x="150" y="100 75%" style="font: 16px sans-serif">there</text>
+  <script>
+    window.addEventListener("MozReftestInvalidate", function() {
+      document.documentElement.setAttribute("width", "200");
+      document.documentElement.setAttribute("height", "200");
+      document.documentElement.removeAttribute("class");
+    }, false);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-ref.svg b/layout/reftests/svg/text/multiple-x-ref.svg
new file mode 100644
index 000000000..97ae33e5b
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100'>h</text>
+    <text x='200'>ello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-rtl-ref.svg b/layout/reftests/svg/text/multiple-x-rtl-ref.svg
new file mode 100644
index 000000000..90b62d842
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-rtl-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='300' direction='rtl'>א</text>
+    <text x='200' direction='rtl'>בגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-rtl.svg b/layout/reftests/svg/text/multiple-x-rtl.svg
new file mode 100644
index 000000000..9955e22e9
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text direction='rtl' x='300 200'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-white-space-ref.svg b/layout/reftests/svg/text/multiple-x-white-space-ref.svg
new file mode 100644
index 000000000..c8ac8f67d
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-white-space-ref.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" style="font-family: sans-serif; font-size: 16px; line-height: 20px">
+  <text x="50 150" y="100">ab</text>
+  <text x="50 350" y="200 220">ab</text>
+  <text x="50 150" y="300 320">ab</text>
+  <text x="50 150" y="400 420">ab</text>
+  <text x="50 100" y="500">a b</text>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x-white-space.svg b/layout/reftests/svg/text/multiple-x-white-space.svg
new file mode 100644
index 000000000..f62b2747f
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x-white-space.svg
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" style="font-family: sans-serif; font-size: 16px; line-height: 20px">
+  <text x="50 100 150 200 250 300 350" y="100">a  
+  b</text>
+  <text x="50 100 150 200 250 300 350" y="200" style="white-space: pre">a  
+  b</text>
+  <text x="50 100 150 200 250 300 350" y="300" style="white-space: pre-line">a  
+  b</text>
+  <text x="50 100 150" y="400" style="white-space: pre">a
+b</text>
+  <text y="500"><tspan x="50 100 150 200">a  </tspan>b</text>
+</svg>
diff --git a/layout/reftests/svg/text/multiple-x.svg b/layout/reftests/svg/text/multiple-x.svg
new file mode 100644
index 000000000..a1e8c7127
--- /dev/null
+++ b/layout/reftests/svg/text/multiple-x.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100 200'>hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/pattern-content-ref.svg b/layout/reftests/svg/text/pattern-content-ref.svg
new file mode 100644
index 000000000..6f2d74b0e
--- /dev/null
+++ b/layout/reftests/svg/text/pattern-content-ref.svg
@@ -0,0 +1,16 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <pattern id="p2" width="8" height="8" patternUnits="userSpaceOnUse">
+      <rect x="-1" y="-1" width="10" height="10" fill="yellow"/>
+      <rect width="4" height="4"/>
+      <rect x="4" y="4" width="4" height="4"/>
+    </pattern>
+  </defs>
+  <g transform="scale(2)translate(50,120)scale(4)">
+    <text style="font: bold 48px sans-serif; fill: url(#p2); stroke: black; stroke-width: 1px">a</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/pattern-content.svg b/layout/reftests/svg/text/pattern-content.svg
new file mode 100644
index 000000000..fcee528d4
--- /dev/null
+++ b/layout/reftests/svg/text/pattern-content.svg
@@ -0,0 +1,22 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <pattern id="p2" width="8" height="8" patternUnits="userSpaceOnUse">
+      <rect x="-1" y="-1" width="10" height="10" fill="yellow"/>
+      <rect width="4" height="4"/>
+      <rect x="4" y="4" width="4" height="4"/>
+    </pattern>
+    <pattern id="p" width="200" height="200" patternUnits="userSpaceOnUse">
+      <g transform="translate(50,120)scale(4)">
+        <text style="font: bold 48px sans-serif; fill: url(#p2)">a</text>
+      </g>
+    </pattern>
+  </defs>
+  <rect width="200" height="200" fill="url(#p)" transform="scale(2)"/>
+  <g transform="scale(2)translate(50,120)scale(4)">
+    <text style="font: bold 48px sans-serif; fill: none; stroke: black; stroke-width: 1px">a</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/pseudo-first-letter-2-ref.svg b/layout/reftests/svg/text/pseudo-first-letter-2-ref.svg
new file mode 100644
index 000000000..b0954b3d5
--- /dev/null
+++ b/layout/reftests/svg/text/pseudo-first-letter-2-ref.svg
@@ -0,0 +1,7 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <text x="100" y="100" style="font: 16px sans-serif">&#x0301;t</text>
+</svg>
diff --git a/layout/reftests/svg/text/pseudo-first-letter-2.svg b/layout/reftests/svg/text/pseudo-first-letter-2.svg
new file mode 100644
index 000000000..a88d8d805
--- /dev/null
+++ b/layout/reftests/svg/text/pseudo-first-letter-2.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <style>
+    text::first-letter { font-size: 32px }
+  </style>
+  <text x="100" y="100" style="font: 16px sans-serif">&#x0301;t</text>
+</svg>
diff --git a/layout/reftests/svg/text/pseudo-first-letter-ref.svg b/layout/reftests/svg/text/pseudo-first-letter-ref.svg
new file mode 100644
index 000000000..b76cd93c2
--- /dev/null
+++ b/layout/reftests/svg/text/pseudo-first-letter-ref.svg
@@ -0,0 +1,8 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <text x="100" y="100" style="font: 16px sans-serif"><tspan font-size="32px">h</tspan>ello there everyone
+    <tspan x="100" y="120">and good night</tspan></text>
+</svg>
diff --git a/layout/reftests/svg/text/pseudo-first-letter.svg b/layout/reftests/svg/text/pseudo-first-letter.svg
new file mode 100644
index 000000000..3d59e6b00
--- /dev/null
+++ b/layout/reftests/svg/text/pseudo-first-letter.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <style>
+    text::first-letter { font-size: 32px }
+  </style>
+  <text x="100" y="100" style="font: 16px sans-serif">hello there everyone
+    <tspan x="100" y="120">and good night</tspan></text>
+</svg>
diff --git a/layout/reftests/svg/text/pseudo-first-line-2-ref.svg b/layout/reftests/svg/text/pseudo-first-line-2-ref.svg
new file mode 100644
index 000000000..acc60898c
--- /dev/null
+++ b/layout/reftests/svg/text/pseudo-first-line-2-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g style="font: 16px sans-serif">
+    <text x="100" y="100" text-decoration="underline">hello there everyone</text>
+    <text x="100" y="120">and good night</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/pseudo-first-line-2.svg b/layout/reftests/svg/text/pseudo-first-line-2.svg
new file mode 100644
index 000000000..6e69d8d3e
--- /dev/null
+++ b/layout/reftests/svg/text/pseudo-first-line-2.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <style>
+    text::first-line { text-decoration: underline }
+  </style>
+  <text x="100" y="100" style="font: 16px sans-serif; white-space: pre-line; line-height: 20px">hello there everyone
+    and good night</text>
+</svg>
diff --git a/layout/reftests/svg/text/pseudo-first-line-ref.svg b/layout/reftests/svg/text/pseudo-first-line-ref.svg
new file mode 100644
index 000000000..9573b0a62
--- /dev/null
+++ b/layout/reftests/svg/text/pseudo-first-line-ref.svg
@@ -0,0 +1,8 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <text x="100" y="100" style="font: 16px sans-serif; text-decoration: underline">hello there everyone
+    <tspan x="100" y="120">and good night</tspan></text>
+</svg>
diff --git a/layout/reftests/svg/text/pseudo-first-line.svg b/layout/reftests/svg/text/pseudo-first-line.svg
new file mode 100644
index 000000000..1347e302a
--- /dev/null
+++ b/layout/reftests/svg/text/pseudo-first-line.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <style>
+    text::first-line { text-decoration: underline }
+  </style>
+  <text x="100" y="100" style="font: 16px sans-serif">hello there everyone
+    <tspan x="100" y="120">and good night</tspan></text>
+</svg>
diff --git a/layout/reftests/svg/text/reftest-stylo.list b/layout/reftests/svg/text/reftest-stylo.list
new file mode 100644
index 000000000..68f6a9819
--- /dev/null
+++ b/layout/reftests/svg/text/reftest-stylo.list
@@ -0,0 +1,204 @@
+# DO NOT EDIT! This is a auto-generated temporary list for Stylo testing
+== simple.svg simple.svg
+== simple-2.svg simple-2.svg
+== simple-underline.svg simple-underline.svg
+skip == simple-underline-scaled.svg simple-underline-scaled.svg
+== simple-anchor-end-bidi.svg simple-anchor-end-bidi.svg
+== simple-anchor-end-rtl.svg simple-anchor-end-rtl.svg
+== simple-anchor-end.svg simple-anchor-end.svg
+== simple-anchor-middle-bidi.svg simple-anchor-middle-bidi.svg
+== simple-anchor-middle-rtl.svg simple-anchor-middle-rtl.svg
+fuzzy-if(skiaContent,111,81) == simple-anchor-middle.svg simple-anchor-middle.svg
+== simple-bidi.svg simple-bidi.svg
+== simple-bidi-2.svg simple-bidi-2.svg
+
+== simple-dx.svg simple-dx.svg
+== simple-dx-2.svg simple-dx-2.svg
+== simple-dx-anchor-end-bidi.svg simple-dx-anchor-end-bidi.svg
+== simple-dx-anchor-end-rtl.svg simple-dx-anchor-end-rtl.svg
+== simple-dx-anchor-end.svg simple-dx-anchor-end.svg
+== simple-dx-anchor-middle-bidi.svg simple-dx-anchor-middle-bidi.svg
+== simple-dx-anchor-middle-rtl.svg simple-dx-anchor-middle-rtl.svg
+== simple-dx-anchor-middle.svg simple-dx-anchor-middle.svg
+== simple-dx-bidi.svg simple-dx-bidi.svg
+== simple-dx-bidi-2.svg simple-dx-bidi-2.svg
+== simple-dx-rtl.svg simple-dx-rtl.svg
+== simple-dx-rtl-2.svg simple-dx-rtl-2.svg
+
+== simple-fill-color-dynamic.svg simple-fill-color-dynamic.svg
+== simple-fill-color.svg simple-fill-color.svg
+HTTP(../..) == simple-fill-gradient.svg simple-fill-gradient.svg
+== simple-fill-none.svg simple-fill-none.svg
+== simple-pointer-events.svg simple-pointer-events.svg
+
+== simple-multiple-dx.svg simple-multiple-dx.svg
+== simple-multiple-dx-2.svg simple-multiple-dx-2.svg
+== simple-multiple-dx-anchor-end-bidi.svg simple-multiple-dx-anchor-end-bidi.svg
+HTTP(../..) == simple-multiple-dx-anchor-middle-bidi.svg simple-multiple-dx-anchor-middle-bidi.svg
+== simple-multiple-dx-anchor-end-rtl.svg simple-multiple-dx-anchor-end-rtl.svg
+== simple-multiple-dx-anchor-end.svg simple-multiple-dx-anchor-end.svg
+fuzzy-if(skiaContent,1,2) HTTP(../..) == simple-multiple-dx-anchor-middle-rtl.svg simple-multiple-dx-anchor-middle-rtl.svg
+HTTP(../..) == simple-multiple-dx-anchor-middle.svg simple-multiple-dx-anchor-middle.svg
+== simple-multiple-dx-bidi.svg simple-multiple-dx-bidi.svg
+== simple-multiple-dx-bidi-2.svg simple-multiple-dx-bidi-2.svg
+== simple-multiple-dx-rtl.svg simple-multiple-dx-rtl.svg
+== simple-multiple-dx-rtl-2.svg simple-multiple-dx-rtl-2.svg
+
+== simple-rtl.svg simple-rtl.svg
+== simple-rtl-2.svg simple-rtl-2.svg
+HTTP(../..) == simple-transform-rotate.svg simple-transform-rotate.svg
+
+== multiple-x.svg multiple-x.svg
+== multiple-x-bidi.svg multiple-x-bidi.svg
+== multiple-x-rtl.svg multiple-x-rtl.svg
+== multiple-x-anchor-end-bidi.svg multiple-x-anchor-end-bidi.svg
+== multiple-x-anchor-end-rtl.svg multiple-x-anchor-end-rtl.svg
+== multiple-x-anchor-end.svg multiple-x-anchor-end.svg
+== multiple-x-dx-bidi.svg multiple-x-dx-bidi.svg
+== multiple-x-dx-rtl.svg multiple-x-dx-rtl.svg
+== multiple-x-dx.svg multiple-x-dx.svg
+== multiple-x-holes-bidi.svg multiple-x-holes-bidi.svg
+== multiple-x-holes-dx-bidi.svg multiple-x-holes-dx-bidi.svg
+== multiple-x-holes.svg multiple-x-holes.svg
+== multiple-x-holes-dx.svg multiple-x-holes-dx.svg
+== multiple-x-holes-multiple-dx-bidi.svg multiple-x-holes-multiple-dx-bidi.svg
+== multiple-x-holes-multiple-dx-rtl.svg multiple-x-holes-multiple-dx-rtl.svg
+== multiple-x-holes-multiple-dx.svg multiple-x-holes-multiple-dx.svg
+== multiple-x-holes-rtl.svg multiple-x-holes-rtl.svg
+== multiple-x-multiple-dx-bidi.svg multiple-x-multiple-dx-bidi.svg
+== multiple-x-multiple-dx-rtl.svg multiple-x-multiple-dx-rtl.svg
+== multiple-x-multiple-dx.svg multiple-x-multiple-dx.svg
+== multiple-x-multiple-dx-anchor-end-bidi.svg multiple-x-multiple-dx-anchor-end-bidi.svg
+== multiple-x-multiple-dx-anchor-end-rtl.svg multiple-x-multiple-dx-anchor-end-rtl.svg
+== multiple-x-multiple-dx-anchor-end.svg multiple-x-multiple-dx-anchor-end.svg
+
+== multiple-x-percentages.svg multiple-x-percentages.svg
+== multiple-x-percentages-2.html multiple-x-percentages-2.html
+== multiple-x-percentages-3.html multiple-x-percentages-3.html
+
+== multiple-x-white-space.svg multiple-x-white-space.svg
+
+== multiple-chunks-bidi.svg multiple-chunks-bidi.svg
+== multiple-chunks-different-anchor-bidi.svg multiple-chunks-different-anchor-bidi.svg
+== multiple-chunks-different-anchor-rtl.svg multiple-chunks-different-anchor-rtl.svg
+== multiple-chunks-different-anchor.svg multiple-chunks-different-anchor.svg
+== multiple-chunks-directions-and-anchor.svg multiple-chunks-directions-and-anchor.svg
+== multiple-chunks-directions-and-anchor-dx.svg multiple-chunks-directions-and-anchor-dx.svg
+== multiple-chunks-directions-and-anchor-multiple-dx.svg multiple-chunks-directions-and-anchor-multiple-dx.svg
+== multiple-chunks-dx-bidi.svg multiple-chunks-dx-bidi.svg
+== multiple-chunks-dx-different-anchor-bidi.svg multiple-chunks-dx-different-anchor-bidi.svg
+== multiple-chunks-dx-different-anchor-rtl.svg multiple-chunks-dx-different-anchor-rtl.svg
+== multiple-chunks-dx-different-anchor.svg multiple-chunks-dx-different-anchor.svg
+== multiple-chunks-dx-rtl.svg multiple-chunks-dx-rtl.svg
+== multiple-chunks-dx.svg multiple-chunks-dx.svg
+== multiple-chunks-fill-color.svg multiple-chunks-fill-color.svg
+== multiple-chunks-multiple-dx-bidi.svg multiple-chunks-multiple-dx-bidi.svg
+== multiple-chunks-multiple-dx-different-anchor-bidi.svg multiple-chunks-multiple-dx-different-anchor-bidi.svg
+== multiple-chunks-multiple-dx-different-anchor-rtl.svg multiple-chunks-multiple-dx-different-anchor-rtl.svg
+== multiple-chunks-multiple-dx-different-anchor.svg multiple-chunks-multiple-dx-different-anchor.svg
+== multiple-chunks-multiple-dx-rtl.svg multiple-chunks-multiple-dx-rtl.svg
+== multiple-chunks-multiple-dx.svg multiple-chunks-multiple-dx.svg
+== multiple-chunks-rtl.svg multiple-chunks-rtl.svg
+== multiple-chunks.svg multiple-chunks.svg
+
+== display-none-1.svg display-none-1.svg
+== display-none-2.svg display-none-2.svg
+== display-none-3.svg display-none-3.svg
+== display-none-4.svg display-none-4.svg
+
+== simple-multiline.svg simple-multiline.svg
+== simple-multiline-number.svg simple-multiline-number.svg
+== simple-multiline-pc.svg simple-multiline-pc.svg
+== simple-multiline-anchor-end.svg simple-multiline-anchor-end.svg
+
+fuzzy-if(skiaContent,1,15) == textpath.svg textpath.svg
+== textpath-a.svg textpath-a.svg
+== textpath-anchor-middle.svg textpath-anchor-middle.svg
+== textpath-anchor-end.svg textpath-anchor-end.svg
+== textpath-invalid-parent.svg textpath-invalid-parent.svg
+== textpath-multiline.svg textpath-multiline.svg
+== textpath-multiline-2.svg textpath-multiline-2.svg
+== textpath-after.svg textpath-after.svg
+== textpath-after-anchor-end.svg textpath-after-anchor-end.svg
+
+== textLength.svg textLength.svg
+fuzzy-if(skiaContent,1,200) == textLength-2.svg textLength-2.svg
+fuzzy-if(/^Windows\x20NT\x2010\.0/.test(http.oscpu)||/^Windows\x20NT\x206\.[12]/.test(http.oscpu),4,17) fuzzy-if(skiaContent,1,100) == textLength-3.svg textLength-3.svg
+== textLength-4.svg textLength-4.svg
+== textLength-5.svg textLength-5.svg
+== textLength-6.svg textLength-6.svg
+
+# text-shadow
+== text-shadow.svg text-shadow.svg
+
+# vertical text
+== vertical-01.svg vertical-01.svg
+
+# tests for ignoring various properties
+== ignore-border.svg ignore-border.svg
+== ignore-display.svg ignore-display.svg
+== ignore-float.svg ignore-float.svg
+== ignore-float-first-letter.svg ignore-float-first-letter.svg
+== ignore-position.svg ignore-position.svg
+== ignore-margin.svg ignore-margin.svg
+== ignore-padding.svg ignore-padding.svg
+== ignore-vertical-align.svg ignore-vertical-align.svg
+== ignore-overflow-scroll.svg ignore-overflow-scroll.svg
+== ignore-text-align.svg ignore-text-align.svg
+== ignore-text-align-2.svg ignore-text-align-2.svg
+
+# pseudo-elements
+== pseudo-first-line.svg pseudo-first-line.svg
+== pseudo-first-line-2.svg pseudo-first-line-2.svg
+== pseudo-first-letter.svg pseudo-first-letter.svg
+== pseudo-first-letter-2.svg pseudo-first-letter-2.svg
+== ignore-before-after.svg ignore-before-after.svg
+
+# invalid child nodes
+== ignore-invalid-child.svg ignore-invalid-child.svg
+== ignore-invalid-child-2.svg ignore-invalid-child-2.svg
+
+# text inside a link
+# == link-surrounding.svg link-surrounding.svg
+
+# dynamic document changes
+== dynamic-font-size.svg dynamic-font-size.svg
+== dynamic-font-size-2.svg dynamic-font-size-2.svg
+== dynamic-font-size-3.svg dynamic-font-size-3.svg
+== dynamic-font-size-4.svg dynamic-font-size-4.svg
+== dynamic-dominant-baseline.svg dynamic-dominant-baseline.svg
+== dynamic-multiple-x.svg dynamic-multiple-x.svg
+fuzzy-if(!d2d,14,2) fuzzy-if(azureQuartz,1,6) fuzzy-if(skiaContent,1,200) == dynamic-non-scaling-stroke.svg dynamic-non-scaling-stroke-ref.svg #Bug #Bug
+== dynamic-text-shadow.svg dynamic-text-shadow.svg
+
+# text and masks
+skip fuzzy-if(skiaContent&&winWidget,39,224) HTTP(../..) == mask-applied.svg mask-applied.svg
+fuzzy-if(skiaContent&&winWidget,77,56) HTTP(../..) == mask-content.svg mask-content.svg
+fuzzy-if(skiaContent&&winWidget,39,112) HTTP(../..) == mask-content-2.svg mask-content-2.svg
+
+# text and clipPaths
+skip HTTP(../..) == clipPath-applied.svg clipPath-applied.svg
+fuzzy-if(skiaContent&&winWidget,77,56) HTTP(../..) == clipPath-content.svg clipPath-content.svg
+fuzzy-if(skiaContent&&winWidget,39,112) HTTP(../..) == clipPath-content-2.svg clipPath-content-2.svg
+
+# text and patterns
+fuzzy-if(cocoaWidget,1,6) == pattern-content.svg pattern-content.svg
+
+# text and filters
+skip fuzzy-if(skiaContent&&winWidget,109,336) HTTP(../..) == filter-applied.svg filter-applied.svg
+
+# vertical text
+fuzzy-if(skiaContent,1,80) == textpath-vertical-dx.svg textpath-vertical-dx.svg
+
+# selection
+needs-focus == deselectAll.svg deselectAll.svg
+fuzzy-if(skiaContent,1,250) needs-focus == selectSubString.svg selectSubString.svg
+fuzzy-if(skiaContent,1,600) needs-focus == selectSubString-2.svg selectSubString-2.svg
+fuzzy-if(skiaContent,1,250) needs-focus == selectSubString-3.svg selectSubString-3.svg
+needs-focus == simple-selection.svg simple-selection.svg
+fuzzy-if(skiaContent,1,100) needs-focus == simple-bidi-selection.svg simple-bidi-selection.svg
+fuzzy-if(skiaContent,1,50) needs-focus == simple-fill-color-selection.svg simple-fill-color-selection.svg
+fuzzy-if(skiaContent,1,150) needs-focus == simple-underline-selection.svg simple-underline-selection.svg
+fuzzy-if(skiaContent,1,300) needs-focus == multiple-text-selection.svg multiple-text-selection.svg
+needs-focus == multiple-chunks-selection.svg multiple-chunks-selection.svg
+fuzzy-if(skiaContent,1,200) needs-focus == textpath-selection.svg textpath-selection.svg
diff --git a/layout/reftests/svg/text/reftest.list b/layout/reftests/svg/text/reftest.list
new file mode 100644
index 000000000..71a07cd71
--- /dev/null
+++ b/layout/reftests/svg/text/reftest.list
@@ -0,0 +1,203 @@
+== simple.svg simple-ref.html
+== simple-2.svg simple.svg
+== simple-underline.svg simple-underline-ref.html
+== simple-underline-scaled.svg simple-underline-scaled-ref.svg
+== simple-anchor-end-bidi.svg simple-anchor-end-bidi-ref.html
+== simple-anchor-end-rtl.svg simple-anchor-end-rtl-ref.html
+== simple-anchor-end.svg simple-anchor-end-ref.html
+fuzzy-if(skiaContent&&dwrite,104,131) == simple-anchor-middle-bidi.svg simple-anchor-middle-bidi-ref.html
+== simple-anchor-middle-rtl.svg simple-anchor-middle-rtl-ref.html
+fuzzy-if(skiaContent,111,81) == simple-anchor-middle.svg simple-anchor-middle-ref.html
+== simple-bidi.svg simple-bidi-ref.html
+== simple-bidi-2.svg simple-bidi.svg
+
+== simple-dx.svg simple.svg
+== simple-dx-2.svg simple-dx-2-ref.svg
+== simple-dx-anchor-end-bidi.svg simple-dx-anchor-end-bidi-ref.svg
+== simple-dx-anchor-end-rtl.svg simple-dx-anchor-end-rtl-ref.svg
+== simple-dx-anchor-end.svg simple-dx-anchor-end-ref.svg
+== simple-dx-anchor-middle-bidi.svg simple-dx-anchor-middle-bidi-ref.svg
+== simple-dx-anchor-middle-rtl.svg simple-dx-anchor-middle-rtl-ref.svg
+== simple-dx-anchor-middle.svg simple-dx-anchor-middle-ref.svg
+== simple-dx-bidi.svg simple-dx-bidi-ref.svg
+== simple-dx-bidi-2.svg simple-dx-bidi-2-ref.svg
+== simple-dx-rtl.svg simple-dx-rtl-ref.svg
+== simple-dx-rtl-2.svg simple-dx-rtl-2-ref.svg
+
+== simple-fill-color-dynamic.svg simple-fill-color-dynamic-ref.svg
+== simple-fill-color.svg simple-fill-color-ref.html
+HTTP(../..) == simple-fill-gradient.svg simple-fill-gradient-ref.svg
+== simple-fill-none.svg simple.svg
+== simple-pointer-events.svg simple.svg
+
+== simple-multiple-dx.svg simple-multiple-dx-ref.html
+== simple-multiple-dx-2.svg simple-multiple-dx.svg
+== simple-multiple-dx-anchor-end-bidi.svg simple-multiple-dx-anchor-end-bidi-ref.svg
+HTTP(../..) == simple-multiple-dx-anchor-middle-bidi.svg simple-multiple-dx-anchor-middle-bidi-ref.svg
+== simple-multiple-dx-anchor-end-rtl.svg simple-multiple-dx-anchor-end-rtl-ref.svg
+== simple-multiple-dx-anchor-end.svg simple-multiple-dx-anchor-end-ref.svg
+fuzzy-if(skiaContent,1,2) HTTP(../..) == simple-multiple-dx-anchor-middle-rtl.svg simple-multiple-dx-anchor-middle-rtl-ref.svg
+HTTP(../..) == simple-multiple-dx-anchor-middle.svg simple-multiple-dx-anchor-middle-ref.svg
+== simple-multiple-dx-bidi.svg simple-multiple-dx-bidi-ref.svg
+== simple-multiple-dx-bidi-2.svg simple-multiple-dx-bidi.svg
+== simple-multiple-dx-rtl.svg simple-multiple-dx-rtl-ref.svg
+== simple-multiple-dx-rtl-2.svg simple-multiple-dx-rtl.svg
+
+== simple-rtl.svg simple-rtl-ref.html
+== simple-rtl-2.svg simple-rtl.svg
+HTTP(../..) == simple-transform-rotate.svg simple-transform-rotate-ref.svg
+
+== multiple-x.svg multiple-x-ref.svg
+== multiple-x-bidi.svg multiple-x-bidi-ref.svg
+== multiple-x-rtl.svg multiple-x-rtl-ref.svg
+== multiple-x-anchor-end-bidi.svg multiple-x-anchor-end-bidi-ref.svg
+== multiple-x-anchor-end-rtl.svg multiple-x-anchor-end-rtl-ref.svg
+== multiple-x-anchor-end.svg multiple-x-anchor-end-ref.svg
+== multiple-x-dx-bidi.svg multiple-x-dx-bidi-ref.svg
+== multiple-x-dx-rtl.svg multiple-x-dx-rtl-ref.svg
+== multiple-x-dx.svg multiple-x-dx-ref.svg
+== multiple-x-holes-bidi.svg multiple-x-holes-bidi-ref.svg
+== multiple-x-holes-dx-bidi.svg multiple-x-holes-dx-bidi-ref.svg
+== multiple-x-holes.svg multiple-x-holes-ref.svg
+== multiple-x-holes-dx.svg multiple-x-holes-dx-ref.svg
+== multiple-x-holes-multiple-dx-bidi.svg multiple-x-holes-multiple-dx-bidi-ref.svg
+== multiple-x-holes-multiple-dx-rtl.svg multiple-x-holes-multiple-dx-rtl-ref.svg
+== multiple-x-holes-multiple-dx.svg multiple-x-holes-multiple-dx-ref.svg
+== multiple-x-holes-rtl.svg multiple-x-holes-rtl-ref.svg
+== multiple-x-multiple-dx-bidi.svg multiple-x-multiple-dx-bidi-ref.svg
+== multiple-x-multiple-dx-rtl.svg multiple-x-multiple-dx-rtl-ref.svg
+== multiple-x-multiple-dx.svg multiple-x-multiple-dx-ref.svg
+== multiple-x-multiple-dx-anchor-end-bidi.svg multiple-x-multiple-dx-anchor-end-bidi-ref.svg
+== multiple-x-multiple-dx-anchor-end-rtl.svg multiple-x-multiple-dx-anchor-end-rtl-ref.svg
+== multiple-x-multiple-dx-anchor-end.svg multiple-x-multiple-dx-anchor-end-ref.svg
+
+== multiple-x-percentages.svg multiple-x-percentages-ref.svg
+== multiple-x-percentages-2.html multiple-x-percentages-2-ref.html
+== multiple-x-percentages-3.html multiple-x-percentages-3-ref.html
+
+== multiple-x-white-space.svg multiple-x-white-space-ref.svg
+
+== multiple-chunks-bidi.svg multiple-chunks-bidi-ref.svg
+== multiple-chunks-different-anchor-bidi.svg multiple-chunks-different-anchor-bidi-ref.svg
+== multiple-chunks-different-anchor-rtl.svg multiple-chunks-different-anchor-rtl-ref.svg
+== multiple-chunks-different-anchor.svg multiple-chunks-different-anchor-ref.svg
+== multiple-chunks-directions-and-anchor.svg multiple-chunks-directions-and-anchor-ref.svg
+== multiple-chunks-directions-and-anchor-dx.svg multiple-chunks-directions-and-anchor-dx-ref.svg
+== multiple-chunks-directions-and-anchor-multiple-dx.svg multiple-chunks-directions-and-anchor-multiple-dx-ref.svg
+== multiple-chunks-dx-bidi.svg multiple-chunks-dx-bidi-ref.svg
+== multiple-chunks-dx-different-anchor-bidi.svg multiple-chunks-dx-different-anchor-bidi-ref.svg
+== multiple-chunks-dx-different-anchor-rtl.svg multiple-chunks-dx-different-anchor-rtl-ref.svg
+== multiple-chunks-dx-different-anchor.svg multiple-chunks-dx-different-anchor-ref.svg
+== multiple-chunks-dx-rtl.svg multiple-chunks-dx-rtl-ref.svg
+== multiple-chunks-dx.svg multiple-chunks-dx-ref.svg
+== multiple-chunks-fill-color.svg multiple-chunks-fill-color-ref.svg
+== multiple-chunks-multiple-dx-bidi.svg multiple-chunks-multiple-dx-bidi-ref.svg
+== multiple-chunks-multiple-dx-different-anchor-bidi.svg multiple-chunks-multiple-dx-different-anchor-bidi-ref.svg
+== multiple-chunks-multiple-dx-different-anchor-rtl.svg multiple-chunks-multiple-dx-different-anchor-rtl-ref.svg
+== multiple-chunks-multiple-dx-different-anchor.svg multiple-chunks-multiple-dx-different-anchor-ref.svg
+== multiple-chunks-multiple-dx-rtl.svg multiple-chunks-multiple-dx-rtl-ref.svg
+== multiple-chunks-multiple-dx.svg multiple-chunks-multiple-dx-ref.svg
+== multiple-chunks-rtl.svg multiple-chunks-rtl-ref.svg
+== multiple-chunks.svg multiple-chunks-ref.svg
+
+== display-none-1.svg simple.svg
+== display-none-2.svg simple.svg
+== display-none-3.svg simple.svg
+== display-none-4.svg simple.svg
+
+== simple-multiline.svg simple-multiline-ref.svg
+== simple-multiline-number.svg simple-multiline-number-ref.svg
+== simple-multiline-pc.svg simple-multiline-pc-ref.svg
+== simple-multiline-anchor-end.svg simple-multiline-anchor-end-ref.svg
+
+fuzzy-if(skiaContent,1,15) == textpath.svg textpath-ref.svg
+== textpath-a.svg textpath-a-ref.svg
+== textpath-anchor-middle.svg textpath-anchor-middle-ref.svg
+== textpath-anchor-end.svg textpath-anchor-end-ref.svg
+== textpath-invalid-parent.svg textpath-invalid-parent-ref.svg
+== textpath-multiline.svg textpath-multiline-ref.svg
+== textpath-multiline-2.svg textpath-multiline-2-ref.svg
+== textpath-after.svg textpath-after-ref.svg
+== textpath-after-anchor-end.svg textpath-after-anchor-end-ref.svg
+
+== textLength.svg textLength-ref.svg
+fuzzy-if(skiaContent,1,200) == textLength-2.svg textLength-2-ref.svg
+fuzzy-if(/^Windows\x20NT\x2010\.0/.test(http.oscpu)||/^Windows\x20NT\x206\.[12]/.test(http.oscpu),4,17) fuzzy-if(skiaContent,4,100) == textLength-3.svg textLength-3-ref.svg
+== textLength-4.svg textLength-4-ref.svg
+== textLength-5.svg textLength-5-ref.svg
+== textLength-6.svg textLength-6-ref.svg
+
+# text-shadow
+== text-shadow.svg text-shadow-ref.svg
+
+# vertical text
+== vertical-01.svg vertical-01-ref.svg
+
+# tests for ignoring various properties
+== ignore-border.svg ignore-prop-ref.svg
+== ignore-display.svg ignore-display-ref.svg
+== ignore-float.svg ignore-prop-ref.svg
+== ignore-float-first-letter.svg ignore-prop-ref.svg
+== ignore-position.svg ignore-position-ref.svg
+== ignore-margin.svg ignore-prop-ref.svg
+== ignore-padding.svg ignore-prop-ref.svg
+== ignore-vertical-align.svg ignore-vertical-align-ref.svg
+== ignore-overflow-scroll.svg ignore-prop-ref.svg
+== ignore-text-align.svg ignore-prop-ref.svg
+== ignore-text-align-2.svg ignore-text-align-2-ref.svg
+
+# pseudo-elements
+== pseudo-first-line.svg pseudo-first-line-ref.svg
+== pseudo-first-line-2.svg pseudo-first-line-2-ref.svg
+== pseudo-first-letter.svg pseudo-first-letter-ref.svg
+== pseudo-first-letter-2.svg pseudo-first-letter-2-ref.svg
+== ignore-before-after.svg ignore-prop-ref.svg
+
+# invalid child nodes
+== ignore-invalid-child.svg ignore-invalid-child-ref.svg
+== ignore-invalid-child-2.svg ignore-invalid-child-2-ref.svg
+
+# text inside a link
+== link-surrounding.svg simple.svg
+
+# dynamic document changes
+== dynamic-font-size.svg dynamic-font-size-ref.svg
+== dynamic-font-size-2.svg dynamic-font-size-2-ref.svg
+== dynamic-font-size-3.svg dynamic-font-size-3-ref.svg
+== dynamic-font-size-4.svg dynamic-font-size-4-ref.svg
+== dynamic-dominant-baseline.svg dynamic-dominant-baseline-ref.svg
+== dynamic-multiple-x.svg dynamic-multiple-x-ref.svg
+fuzzy-if(!d2d,14,2) fuzzy-if(azureQuartz,1,6) fuzzy-if(skiaContent,1,200) == dynamic-non-scaling-stroke.svg dynamic-non-scaling-stroke-ref.svg #Bug 885316
+== dynamic-text-shadow.svg text-shadow-ref.svg
+
+# text and masks
+fuzzy-if(skiaContent&&winWidget,50,224) HTTP(../..)  == mask-applied.svg mask-applied-ref.svg
+fuzzy-if(skiaContent&&winWidget,105,56) HTTP(../..) == mask-content.svg mask-content-ref.svg
+fuzzy-if(skiaContent&&winWidget,53,112) HTTP(../..) == mask-content-2.svg mask-content-2-ref.svg
+
+# text and clipPaths
+HTTP(../..) == clipPath-applied.svg clipPath-applied-ref.svg
+fuzzy-if(skiaContent&&winWidget,105,56) HTTP(../..) == clipPath-content.svg clipPath-content-ref.svg
+fuzzy-if(skiaContent&&winWidget,53,112) HTTP(../..) == clipPath-content-2.svg clipPath-content-2-ref.svg
+
+# text and patterns
+fuzzy-if(cocoaWidget,1,6) == pattern-content.svg pattern-content-ref.svg
+
+# text and filters
+fuzzy-if(skiaContent&&winWidget,126,336) HTTP(../..) == filter-applied.svg filter-applied-ref.svg
+
+# vertical text
+fuzzy-if(skiaContent,1,80) == textpath-vertical-dx.svg textpath-vertical-dx-ref.svg
+
+# selection
+needs-focus == deselectAll.svg deselectAll-ref.svg
+fuzzy-if(skiaContent,1,250) needs-focus == selectSubString.svg selectSubString-ref.svg
+fuzzy-if(skiaContent,1,600) needs-focus == selectSubString-2.svg selectSubString-2-ref.svg
+fuzzy-if(skiaContent,1,250) needs-focus == selectSubString-3.svg selectSubString-3-ref.svg
+needs-focus == simple-selection.svg simple-selection-ref.html
+fuzzy-if(skiaContent,1,100) needs-focus == simple-bidi-selection.svg simple-bidi-selection-ref.html
+fuzzy-if(skiaContent,1,50) needs-focus == simple-fill-color-selection.svg simple-fill-color-selection-ref.html
+fuzzy-if(skiaContent,1,150) needs-focus == simple-underline-selection.svg simple-underline-selection-ref.html
+fuzzy-if(skiaContent,1,300) needs-focus == multiple-text-selection.svg multiple-text-selection-ref.html
+needs-focus == multiple-chunks-selection.svg multiple-chunks-selection-ref.svg
+fuzzy-if(skiaContent,1,200) needs-focus == textpath-selection.svg textpath-selection-ref.svg
diff --git a/layout/reftests/svg/text/selectSubString-2-ref.svg b/layout/reftests/svg/text/selectSubString-2-ref.svg
new file mode 100644
index 000000000..2f9cce89c
--- /dev/null
+++ b/layout/reftests/svg/text/selectSubString-2-ref.svg
@@ -0,0 +1,16 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>hello</text>
+  </g>
+  <script>
+    var text = document.getElementsByTagName("text")[0];
+    var range = document.createRange();
+    range.setStart(text.firstChild, 0);
+    range.setEnd(text.firstChild, 5);
+    window.getSelection().addRange(range);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/selectSubString-2.svg b/layout/reftests/svg/text/selectSubString-2.svg
new file mode 100644
index 000000000..e623bb76c
--- /dev/null
+++ b/layout/reftests/svg/text/selectSubString-2.svg
@@ -0,0 +1,13 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>hello</text>
+  </g>
+  <script>
+    var text = document.getElementsByTagName("text")[0];
+    text.selectSubString(0, 5);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/selectSubString-3-ref.svg b/layout/reftests/svg/text/selectSubString-3-ref.svg
new file mode 100644
index 000000000..00dccc73f
--- /dev/null
+++ b/layout/reftests/svg/text/selectSubString-3-ref.svg
@@ -0,0 +1,16 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>abc אבג 123 דהו def</text>
+  </g>
+  <script>
+    var text = document.getElementsByTagName("text")[0];
+    var range = document.createRange();
+    range.setStart(text.firstChild, 0);
+    range.setEnd(text.firstChild, 9);
+    window.getSelection().addRange(range);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/selectSubString-3.svg b/layout/reftests/svg/text/selectSubString-3.svg
new file mode 100644
index 000000000..bd355de5c
--- /dev/null
+++ b/layout/reftests/svg/text/selectSubString-3.svg
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>
+        abc אבג 123 דהו def
+    </text>
+  </g>
+  <script>
+    var text = document.getElementsByTagName("text")[0];
+    text.selectSubString(0, 9);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/selectSubString-ref.svg b/layout/reftests/svg/text/selectSubString-ref.svg
new file mode 100644
index 000000000..227f587a7
--- /dev/null
+++ b/layout/reftests/svg/text/selectSubString-ref.svg
@@ -0,0 +1,16 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>hello</text>
+  </g>
+  <script>
+    var text = document.getElementsByTagName("text")[0];
+    var range = document.createRange();
+    range.setStart(text.firstChild, 1);
+    range.setEnd(text.firstChild, 4);
+    window.getSelection().addRange(range);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/selectSubString.svg b/layout/reftests/svg/text/selectSubString.svg
new file mode 100644
index 000000000..acc659cbe
--- /dev/null
+++ b/layout/reftests/svg/text/selectSubString.svg
@@ -0,0 +1,13 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>hello</text>
+  </g>
+  <script>
+    var text = document.getElementsByTagName("text")[0];
+    text.selectSubString(1, 3);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/simple-2.svg b/layout/reftests/svg/text/simple-2.svg
new file mode 100644
index 000000000..871e5418d
--- /dev/null
+++ b/layout/reftests/svg/text/simple-2.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(0,100)" style="font: 16px sans-serif">
+    <text x="100">hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-anchor-end-bidi-ref.html b/layout/reftests/svg/text/simple-anchor-end-bidi-ref.html
new file mode 100644
index 000000000..ad561778c
--- /dev/null
+++ b/layout/reftests/svg/text/simple-anchor-end-bidi-ref.html
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<meta charset=UTF-8>
+<style>
+html, body { margin: 0 }
+svg, div { display: inline-block; width: 700px; height: 200px }
+div { font: 16px sans-serif; position: relative; margin-left: -700px; vertical-align: 100px }
+div { text-align: right }
+span { position: relative; left: -500px }
+</style>
+<body>
+<svg></svg><div><span>אבגabc</span></div>
diff --git a/layout/reftests/svg/text/simple-anchor-end-bidi.svg b/layout/reftests/svg/text/simple-anchor-end-bidi.svg
new file mode 100644
index 000000000..430fb8f11
--- /dev/null
+++ b/layout/reftests/svg/text/simple-anchor-end-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor="end">אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-anchor-end-ref.html b/layout/reftests/svg/text/simple-anchor-end-ref.html
new file mode 100644
index 000000000..ae31b1221
--- /dev/null
+++ b/layout/reftests/svg/text/simple-anchor-end-ref.html
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<meta charset=UTF-8>
+<style>
+html, body { margin: 0 }
+svg, div { display: inline-block; width: 700px; height: 200px }
+div { font: 16px sans-serif; position: relative; margin-left: -700px; vertical-align: 100px }
+div { text-align: right }
+span { position: relative; left: -500px }
+</style>
+<body>
+<svg></svg><div><span>hello</span></div>
diff --git a/layout/reftests/svg/text/simple-anchor-end-rtl-ref.html b/layout/reftests/svg/text/simple-anchor-end-rtl-ref.html
new file mode 100644
index 000000000..0d0e1435f
--- /dev/null
+++ b/layout/reftests/svg/text/simple-anchor-end-rtl-ref.html
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<meta charset=UTF-8>
+<style>
+html, body { margin: 0 }
+svg, div { display: inline-block; width: 700px; height: 200px }
+div { font: 16px sans-serif; position: relative; margin-left: -700px; vertical-align: 100px }
+div { text-align: left }
+span { position: relative; left: 300px }
+</style>
+<body>
+<svg></svg><div><span>אבגדה</span></div>
diff --git a/layout/reftests/svg/text/simple-anchor-end-rtl.svg b/layout/reftests/svg/text/simple-anchor-end-rtl.svg
new file mode 100644
index 000000000..66b0f9c2a
--- /dev/null
+++ b/layout/reftests/svg/text/simple-anchor-end-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='200' direction='rtl' text-anchor='end'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-anchor-end.svg b/layout/reftests/svg/text/simple-anchor-end.svg
new file mode 100644
index 000000000..bd97d05b3
--- /dev/null
+++ b/layout/reftests/svg/text/simple-anchor-end.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor="end">hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-anchor-middle-bidi-ref.html b/layout/reftests/svg/text/simple-anchor-middle-bidi-ref.html
new file mode 100644
index 000000000..6fe675123
--- /dev/null
+++ b/layout/reftests/svg/text/simple-anchor-middle-bidi-ref.html
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<meta charset=UTF-8>
+<style>
+html, body { margin: 0 }
+svg, div { display: inline-block; width: 700px; height: 200px }
+div { font: 16px sans-serif; position: relative; margin-left: -700px; vertical-align: 100px }
+div { text-align: center }
+span { position: relative; left: -150px }
+</style>
+<body>
+<svg></svg><div><span>אבגabc</span></div>
diff --git a/layout/reftests/svg/text/simple-anchor-middle-bidi.svg b/layout/reftests/svg/text/simple-anchor-middle-bidi.svg
new file mode 100644
index 000000000..cf1db5d6c
--- /dev/null
+++ b/layout/reftests/svg/text/simple-anchor-middle-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor="middle">אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-anchor-middle-ref.html b/layout/reftests/svg/text/simple-anchor-middle-ref.html
new file mode 100644
index 000000000..3c6a21d62
--- /dev/null
+++ b/layout/reftests/svg/text/simple-anchor-middle-ref.html
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<meta charset=UTF-8>
+<style>
+html, body { margin: 0 }
+svg, div { display: inline-block; width: 700px; height: 200px }
+div { font: 16px sans-serif; position: relative; margin-left: -700px; vertical-align: 100px }
+div { text-align: center }
+span { position: relative; left: -150px }
+</style>
+<body>
+<svg></svg><div><span>hello</span></div>
diff --git a/layout/reftests/svg/text/simple-anchor-middle-rtl-ref.html b/layout/reftests/svg/text/simple-anchor-middle-rtl-ref.html
new file mode 100644
index 000000000..31b35a768
--- /dev/null
+++ b/layout/reftests/svg/text/simple-anchor-middle-rtl-ref.html
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<meta charset=UTF-8>
+<style>
+html, body { margin: 0 }
+svg, div { display: inline-block; width: 700px; height: 200px }
+div { font: 16px sans-serif; position: relative; margin-left: -700px; vertical-align: 100px }
+div { text-align: center }
+span { position: relative; left: -50px }
+</style>
+<body>
+<svg></svg><div><span>אבגדה</span></div>
diff --git a/layout/reftests/svg/text/simple-anchor-middle-rtl.svg b/layout/reftests/svg/text/simple-anchor-middle-rtl.svg
new file mode 100644
index 000000000..ce1adc985
--- /dev/null
+++ b/layout/reftests/svg/text/simple-anchor-middle-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='200' direction='rtl' text-anchor='middle'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-anchor-middle.svg b/layout/reftests/svg/text/simple-anchor-middle.svg
new file mode 100644
index 000000000..93f3ed553
--- /dev/null
+++ b/layout/reftests/svg/text/simple-anchor-middle.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor="middle">hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-bidi-2.svg b/layout/reftests/svg/text/simple-bidi-2.svg
new file mode 100644
index 000000000..2097b40d0
--- /dev/null
+++ b/layout/reftests/svg/text/simple-bidi-2.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(0,100)" style="font: 16px sans-serif">
+    <text x="100">אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-bidi-ref.html b/layout/reftests/svg/text/simple-bidi-ref.html
new file mode 100644
index 000000000..fac683449
--- /dev/null
+++ b/layout/reftests/svg/text/simple-bidi-ref.html
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<meta charset=UTF-8>
+<style>
+html, body { margin: 0 }
+svg, div { display: inline-block; width: 700px; height: 200px }
+div { font: 16px sans-serif; position: relative; margin-left: -700px; vertical-align: 100px }
+div { text-align: left }
+span { position: relative; left: 100px }
+</style>
+<body>
+<svg></svg><div><span>אבגabc</span></div>
diff --git a/layout/reftests/svg/text/simple-bidi-selection-ref.html b/layout/reftests/svg/text/simple-bidi-selection-ref.html
new file mode 100644
index 000000000..8e0f500c1
--- /dev/null
+++ b/layout/reftests/svg/text/simple-bidi-selection-ref.html
@@ -0,0 +1,22 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<meta charset=UTF-8>
+<style>
+html, body { margin: 0 }
+svg, div { display: inline-block; width: 700px; height: 200px }
+div { font: 16px sans-serif; position: relative; margin-left: -700px; vertical-align: 100px }
+div { text-align: left }
+span { position: relative; left: 100px }
+</style>
+<body>
+<svg></svg><div><span>אבגabc</span></div>
+<script>
+  var span = document.getElementsByTagName("span")[0];
+  var range = document.createRange();
+  range.setStart(span.firstChild, 1);
+  range.setEnd(span.firstChild, 5);
+  window.getSelection().addRange(range);
+</script>
diff --git a/layout/reftests/svg/text/simple-bidi-selection.svg b/layout/reftests/svg/text/simple-bidi-selection.svg
new file mode 100644
index 000000000..da336d89c
--- /dev/null
+++ b/layout/reftests/svg/text/simple-bidi-selection.svg
@@ -0,0 +1,16 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>אבגabc</text>
+  </g>
+  <script>
+    var text = document.getElementsByTagName("text")[0];
+    var range = document.createRange();
+    range.setStart(text.firstChild, 1);
+    range.setEnd(text.firstChild, 5);
+    window.getSelection().addRange(range);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/simple-bidi.svg b/layout/reftests/svg/text/simple-bidi.svg
new file mode 100644
index 000000000..a2cedaf92
--- /dev/null
+++ b/layout/reftests/svg/text/simple-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-2-ref.svg b/layout/reftests/svg/text/simple-dx-2-ref.svg
new file mode 100644
index 000000000..871e5418d
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-2-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(0,100)" style="font: 16px sans-serif">
+    <text x="100">hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-2.svg b/layout/reftests/svg/text/simple-dx-2.svg
new file mode 100644
index 000000000..4cdc5d096
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-2.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(0,100)" style="font: 16px sans-serif">
+    <text x="50" dx="50">hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-anchor-end-bidi-ref.svg b/layout/reftests/svg/text/simple-dx-anchor-end-bidi-ref.svg
new file mode 100644
index 000000000..430fb8f11
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-anchor-end-bidi-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor="end">אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-anchor-end-bidi.svg b/layout/reftests/svg/text/simple-dx-anchor-end-bidi.svg
new file mode 100644
index 000000000..24b3b2362
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-anchor-end-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="50" dx="50" text-anchor="end">אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-anchor-end-ref.svg b/layout/reftests/svg/text/simple-dx-anchor-end-ref.svg
new file mode 100644
index 000000000..bd97d05b3
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-anchor-end-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor="end">hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-anchor-end-rtl-ref.svg b/layout/reftests/svg/text/simple-dx-anchor-end-rtl-ref.svg
new file mode 100644
index 000000000..66b0f9c2a
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-anchor-end-rtl-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='200' direction='rtl' text-anchor='end'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-anchor-end-rtl.svg b/layout/reftests/svg/text/simple-dx-anchor-end-rtl.svg
new file mode 100644
index 000000000..7f8a221b8
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-anchor-end-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' dx='100' direction='rtl' text-anchor='end'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-anchor-end.svg b/layout/reftests/svg/text/simple-dx-anchor-end.svg
new file mode 100644
index 000000000..186a69e18
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-anchor-end.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="50" dx="50" text-anchor="end">hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-anchor-middle-bidi-ref.svg b/layout/reftests/svg/text/simple-dx-anchor-middle-bidi-ref.svg
new file mode 100644
index 000000000..cf1db5d6c
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-anchor-middle-bidi-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor="middle">אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-anchor-middle-bidi.svg b/layout/reftests/svg/text/simple-dx-anchor-middle-bidi.svg
new file mode 100644
index 000000000..7d928bbd0
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-anchor-middle-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="50" dx="50" text-anchor="middle">אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-anchor-middle-ref.svg b/layout/reftests/svg/text/simple-dx-anchor-middle-ref.svg
new file mode 100644
index 000000000..93f3ed553
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-anchor-middle-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor="middle">hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-anchor-middle-rtl-ref.svg b/layout/reftests/svg/text/simple-dx-anchor-middle-rtl-ref.svg
new file mode 100644
index 000000000..ce1adc985
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-anchor-middle-rtl-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='200' direction='rtl' text-anchor='middle'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-anchor-middle-rtl.svg b/layout/reftests/svg/text/simple-dx-anchor-middle-rtl.svg
new file mode 100644
index 000000000..4a5e1a012
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-anchor-middle-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' dx='100' direction='rtl' text-anchor='middle'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-anchor-middle.svg b/layout/reftests/svg/text/simple-dx-anchor-middle.svg
new file mode 100644
index 000000000..68d9888e7
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-anchor-middle.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="50" dx="50" text-anchor="middle">hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-bidi-2-ref.svg b/layout/reftests/svg/text/simple-dx-bidi-2-ref.svg
new file mode 100644
index 000000000..2097b40d0
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-bidi-2-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(0,100)" style="font: 16px sans-serif">
+    <text x="100">אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-bidi-2.svg b/layout/reftests/svg/text/simple-dx-bidi-2.svg
new file mode 100644
index 000000000..c21004182
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-bidi-2.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(0,100)" style="font: 16px sans-serif">
+    <text x="50" dx="50">אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-bidi-ref.svg b/layout/reftests/svg/text/simple-dx-bidi-ref.svg
new file mode 100644
index 000000000..a2cedaf92
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-bidi-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-bidi.svg b/layout/reftests/svg/text/simple-dx-bidi.svg
new file mode 100644
index 000000000..0e56b9255
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(0,100)" style="font: 16px sans-serif">
+    <text dx='100'>אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-rtl-2-ref.svg b/layout/reftests/svg/text/simple-dx-rtl-2-ref.svg
new file mode 100644
index 000000000..725a8901f
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-rtl-2-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(0,100)" style="font: 16px sans-serif">
+    <text direction='rtl' x='100'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-rtl-2.svg b/layout/reftests/svg/text/simple-dx-rtl-2.svg
new file mode 100644
index 000000000..55aede4ed
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-rtl-2.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(50,100)" style="font: 16px sans-serif">
+    <text direction='rtl' x='25' dx='25'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-rtl-ref.svg b/layout/reftests/svg/text/simple-dx-rtl-ref.svg
new file mode 100644
index 000000000..cdce9d87a
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-rtl-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text direction='rtl'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx-rtl.svg b/layout/reftests/svg/text/simple-dx-rtl.svg
new file mode 100644
index 000000000..878614a95
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(50,100)" style="font: 16px sans-serif">
+    <text dx="50" direction='rtl'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-dx.svg b/layout/reftests/svg/text/simple-dx.svg
new file mode 100644
index 000000000..8ab0a152d
--- /dev/null
+++ b/layout/reftests/svg/text/simple-dx.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(0,100)" style="font: 16px sans-serif">
+    <text dx="100">hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-fill-color-dynamic-ref.svg b/layout/reftests/svg/text/simple-fill-color-dynamic-ref.svg
new file mode 100644
index 000000000..195e0a22a
--- /dev/null
+++ b/layout/reftests/svg/text/simple-fill-color-dynamic-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif; fill: green">
+    <text>hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-fill-color-dynamic.svg b/layout/reftests/svg/text/simple-fill-color-dynamic.svg
new file mode 100644
index 000000000..2846216da
--- /dev/null
+++ b/layout/reftests/svg/text/simple-fill-color-dynamic.svg
@@ -0,0 +1,25 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200" class="reftest-wait">
+  <g transform="translate(100,100)" style="font: 16px sans-serif; fill: red">
+    <text>hello</text>
+  </g>
+  <script>
+    function when(type, f) {
+      var g = function(evt) {
+        window.removeEventListener(type, g, false);
+        f(evt);
+      };
+      window.addEventListener(type, g, false);
+    }
+
+    when("MozReftestInvalidate", function() {
+      document.getElementsByTagName("g")[0].style.fill = "green";
+      when("MozAfterPaint", function() {
+        document.documentElement.removeAttribute("class");
+      });
+    });
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/simple-fill-color-ref.html b/layout/reftests/svg/text/simple-fill-color-ref.html
new file mode 100644
index 000000000..3f72aabfd
--- /dev/null
+++ b/layout/reftests/svg/text/simple-fill-color-ref.html
@@ -0,0 +1,14 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<style>
+html, body { margin: 0 }
+svg, div { display: inline-block; width: 700px; height: 200px }
+div { font: 16px sans-serif; margin-left: -700px; vertical-align: 100px }
+span { margin-left: 100px; color: green }
+</style>
+<body>
+  <svg></svg><div><span>hello</span></div>
+</body>
diff --git a/layout/reftests/svg/text/simple-fill-color-selection-ref.html b/layout/reftests/svg/text/simple-fill-color-selection-ref.html
new file mode 100644
index 000000000..9e43d703e
--- /dev/null
+++ b/layout/reftests/svg/text/simple-fill-color-selection-ref.html
@@ -0,0 +1,21 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<style>
+html, body { margin: 0 }
+svg, div { display: inline-block; width: 700px; height: 200px }
+div { font: 16px sans-serif; margin-left: -700px; vertical-align: 100px }
+span { margin-left: 100px; color: green }
+</style>
+<body>
+  <svg></svg><div><span>hello</span></div>
+  <script>
+    var span = document.getElementsByTagName("span")[0];
+    var range = document.createRange();
+    range.setStart(span.firstChild, 1);
+    range.setEnd(span.firstChild, 4);
+    window.getSelection().addRange(range);
+  </script>
+</body>
diff --git a/layout/reftests/svg/text/simple-fill-color-selection.svg b/layout/reftests/svg/text/simple-fill-color-selection.svg
new file mode 100644
index 000000000..810343af6
--- /dev/null
+++ b/layout/reftests/svg/text/simple-fill-color-selection.svg
@@ -0,0 +1,16 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif; fill: green">
+    <text>hello</text>
+  </g>
+  <script>
+    var text = document.getElementsByTagName("text")[0];
+    var range = document.createRange();
+    range.setStart(text.firstChild, 1);
+    range.setEnd(text.firstChild, 4);
+    window.getSelection().addRange(range);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/simple-fill-color.svg b/layout/reftests/svg/text/simple-fill-color.svg
new file mode 100644
index 000000000..195e0a22a
--- /dev/null
+++ b/layout/reftests/svg/text/simple-fill-color.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif; fill: green">
+    <text>hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-fill-gradient-ref.svg b/layout/reftests/svg/text/simple-fill-gradient-ref.svg
new file mode 100644
index 000000000..b0d625f70
--- /dev/null
+++ b/layout/reftests/svg/text/simple-fill-gradient-ref.svg
@@ -0,0 +1,14 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <linearGradient id="g" gradientUnits="userSpaceOnUse" x1="0" y1="-13" x2="0" y2="3">
+    <stop offset="0" stop-color="red"/>
+    <stop offset="1" stop-color="yellow"/>
+  </linearGradient>
+  <g transform="translate(100,100)">
+    <rect x="0" y="-13" width="16" height="16" fill="url(#g)"/>
+    <rect x="0" y="-13" width="16" height="16" stroke="black" stroke-width="2" fill="none"/>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-fill-gradient.svg b/layout/reftests/svg/text/simple-fill-gradient.svg
new file mode 100644
index 000000000..74ec4507a
--- /dev/null
+++ b/layout/reftests/svg/text/simple-fill-gradient.svg
@@ -0,0 +1,20 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <linearGradient id="g" gradientUnits="userSpaceOnUse" x1="0" y1="-13" x2="0" y2="3">
+    <stop offset="0" stop-color="red"/>
+    <stop offset="1" stop-color="yellow"/>
+  </linearGradient>
+  <g transform="translate(100,100)" style="font: 16px Ahem">
+    <text fill="url(#g)">a</text>
+    <rect x="0" y="-13" width="16" height="16" stroke="black" stroke-width="2" fill="none"/>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-fill-none.svg b/layout/reftests/svg/text/simple-fill-none.svg
new file mode 100644
index 000000000..20b1987d3
--- /dev/null
+++ b/layout/reftests/svg/text/simple-fill-none.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>hello<tspan fill="none">ooo</tspan></text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiline-anchor-end-ref.svg b/layout/reftests/svg/text/simple-multiline-anchor-end-ref.svg
new file mode 100644
index 000000000..ac6bea46f
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiline-anchor-end-ref.svg
@@ -0,0 +1,12 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <g text-anchor="end">
+      <text x="100">Hello.</text>
+      <text x="100" y="20">Goodbye.</text>
+    </g>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiline-anchor-end.svg b/layout/reftests/svg/text/simple-multiline-anchor-end.svg
new file mode 100644
index 000000000..667e5411d
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiline-anchor-end.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor="end" style="white-space: pre-line; line-height: 20px">Hello.
+Goodbye.</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiline-number-ref.svg b/layout/reftests/svg/text/simple-multiline-number-ref.svg
new file mode 100644
index 000000000..58a786fa6
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiline-number-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>Hello.</text>
+    <text y="20">Goodbye.</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiline-number.svg b/layout/reftests/svg/text/simple-multiline-number.svg
new file mode 100644
index 000000000..407316941
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiline-number.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text style="white-space: pre-line; line-height: 1.25">Hello.
+Goodbye.</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiline-pc-ref.svg b/layout/reftests/svg/text/simple-multiline-pc-ref.svg
new file mode 100644
index 000000000..58a786fa6
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiline-pc-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>Hello.</text>
+    <text y="20">Goodbye.</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiline-pc.svg b/layout/reftests/svg/text/simple-multiline-pc.svg
new file mode 100644
index 000000000..12f96c3d3
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiline-pc.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text style="white-space: pre-line; line-height: 125%">Hello.
+Goodbye.</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiline-ref.svg b/layout/reftests/svg/text/simple-multiline-ref.svg
new file mode 100644
index 000000000..58a786fa6
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiline-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>Hello.</text>
+    <text y="20">Goodbye.</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiline.svg b/layout/reftests/svg/text/simple-multiline.svg
new file mode 100644
index 000000000..12beaff51
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiline.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text style="white-space: pre-line; line-height: 20px">Hello.
+Goodbye.</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-2.svg b/layout/reftests/svg/text/simple-multiple-dx-2.svg
new file mode 100644
index 000000000..12802190c
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-2.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(0,100)" style="font: 16px sans-serif">
+    <text x="50" dx="60 20 30">hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-anchor-end-bidi-ref.svg b/layout/reftests/svg/text/simple-multiple-dx-anchor-end-bidi-ref.svg
new file mode 100644
index 000000000..9ba587826
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-anchor-end-bidi-ref.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" text-anchor="end"><tspan visibility="hidden">אב</tspan>גabc</text>
+    <text x="50" text-anchor="end"><tspan visibility="hidden">א</tspan>ב<tspan visibility="hidden">גabc</tspan></text>
+    <text x="20" text-anchor="end">א<tspan visibility="hidden">בגabc</tspan></text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-anchor-end-bidi.svg b/layout/reftests/svg/text/simple-multiple-dx-anchor-end-bidi.svg
new file mode 100644
index 000000000..10758b48a
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-anchor-end-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="90" dx="10 30 50" text-anchor="end">אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-anchor-end-ref.svg b/layout/reftests/svg/text/simple-multiple-dx-anchor-end-ref.svg
new file mode 100644
index 000000000..8725cd4ad
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-anchor-end-ref.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="110" text-anchor="end">llo</text>
+    <text x="80" text-anchor="end"><tspan visibility="hidden">h</tspan>e<tspan visibility="hidden">llo</tspan></text>
+    <text x="60" text-anchor="end">h<tspan visibility="hidden">ello</tspan></text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-anchor-end-rtl-ref.svg b/layout/reftests/svg/text/simple-multiple-dx-anchor-end-rtl-ref.svg
new file mode 100644
index 000000000..24fe83db6
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-anchor-end-rtl-ref.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="110" text-anchor="end" direction="rtl">גדה</text>
+    <text x="140" text-anchor="end" direction="rtl">ב<tspan visibility="hidden">גדה</tspan></text>
+    <text x="160" text-anchor="end" direction="rtl">א<tspan visibility="hidden">בגדה</tspan></text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-anchor-end-rtl.svg b/layout/reftests/svg/text/simple-multiple-dx-anchor-end-rtl.svg
new file mode 100644
index 000000000..d11ab10e0
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-anchor-end-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='100' dx='10 -20 -30' direction='rtl' text-anchor='end'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-anchor-end.svg b/layout/reftests/svg/text/simple-multiple-dx-anchor-end.svg
new file mode 100644
index 000000000..34e0bdf53
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-anchor-end.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="100" dx="10 20 30" text-anchor="end">hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-anchor-middle-bidi-ref.svg b/layout/reftests/svg/text/simple-multiple-dx-anchor-middle-bidi-ref.svg
new file mode 100644
index 000000000..9ed3955c5
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-anchor-middle-bidi-ref.svg
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <g transform="translate(100,100)" style="font: 16px Ahem">
+    <text x="214" fill="blue"><tspan direction="rtl" unicode-bidi="bidi-override" fill="red">x y z</tspan><tspan visibility="hidden">ww</tspan>a b<tspan visibility="hidden">w</tspan> c</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-anchor-middle-bidi.svg b/layout/reftests/svg/text/simple-multiple-dx-anchor-middle-bidi.svg
new file mode 100644
index 000000000..20eef41cf
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-anchor-middle-bidi.svg
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <g transform="translate(100,100)" style="font: 16px Ahem">
+    <text x="110" dx="0 0 0 0 0 32 0 0 16" text-anchor="middle" fill="blue"><tspan direction="rtl" unicode-bidi="bidi-override" fill="red">x y z</tspan>a b c</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-anchor-middle-ref.svg b/layout/reftests/svg/text/simple-multiple-dx-anchor-middle-ref.svg
new file mode 100644
index 000000000..96443ddc2
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-anchor-middle-ref.svg
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <g transform="translate(100,100)" style="font: 16px Ahem">
+    <text x="12"><tspan visibility="hidden">w</tspan><tspan fill="green">h</tspan><tspan visibility="hidden">w</tspan> e <tspan visibility="hidden">w</tspan>l l o</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-anchor-middle-rtl-ref.svg b/layout/reftests/svg/text/simple-multiple-dx-anchor-middle-rtl-ref.svg
new file mode 100644
index 000000000..740e21fa3
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-anchor-middle-rtl-ref.svg
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <g transform="translate(100,100)" style="font: 16px Ahem">
+    <text x="280"><tspan direction="rtl" unicode-bidi="bidi-override"><tspan fill="green">a</tspan><tspan visibility="hidden">ww</tspan>b c d e</tspan></text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-anchor-middle-rtl.svg b/layout/reftests/svg/text/simple-multiple-dx-anchor-middle-rtl.svg
new file mode 100644
index 000000000..414bf0fa1
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-anchor-middle-rtl.svg
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <g transform="translate(100,100)" style="font: 16px Ahem">
+    <text x='200' dx='0 0 -16' direction='rtl' text-anchor='middle'><tspan direction='rtl' unicode-bidi='bidi-override'><tspan fill="green">a</tspan> b c d e</tspan></text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-anchor-middle.svg b/layout/reftests/svg/text/simple-multiple-dx-anchor-middle.svg
new file mode 100644
index 000000000..392f4e35e
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-anchor-middle.svg
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <g transform="translate(100,100)" style="font: 16px Ahem">
+    <text x="100" dx="16 0 16 0 16" text-anchor="middle"><tspan fill="green">h</tspan> e l l o</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-bidi-2.svg b/layout/reftests/svg/text/simple-multiple-dx-bidi-2.svg
new file mode 100644
index 000000000..7f29cad1e
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-bidi-2.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="110" dx="0 -30 -100">אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-bidi-ref.svg b/layout/reftests/svg/text/simple-multiple-dx-bidi-ref.svg
new file mode 100644
index 000000000..a1748dcb6
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-bidi-ref.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x='110'><tspan visibility="hidden">אב</tspan>גabc</text>
+    <text x='210'><tspan visibility="hidden">א</tspan>ב<tspan visibility="hidden">גabc</tspan></text>
+    <text x='240'>א<tspan visibility="hidden">בגabc</tspan></text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-bidi.svg b/layout/reftests/svg/text/simple-multiple-dx-bidi.svg
new file mode 100644
index 000000000..7dfc20f83
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-bidi.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="110" dx='0 -30 -100'>אבגabc</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-ref.html b/layout/reftests/svg/text/simple-multiple-dx-ref.html
new file mode 100644
index 000000000..53b20148a
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-ref.html
@@ -0,0 +1,14 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<style>
+html, body { margin: 0 }
+svg, div { display: inline-block; width: 700px; height: 200px }
+div { font: 16px sans-serif; margin-left: -700px; vertical-align: 100px }
+div > span { margin-left: 110px }
+</style>
+<body>
+  <svg></svg><div><span>h<span style="padding-left: 20px"></span>e<span style="padding-left: 30px"></span>llo</span></div>
+</body>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-rtl-2.svg b/layout/reftests/svg/text/simple-multiple-dx-rtl-2.svg
new file mode 100644
index 000000000..cca2629c0
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-rtl-2.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text direction='rtl' x='100' dx='10 -20 -30'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-rtl-ref.svg b/layout/reftests/svg/text/simple-multiple-dx-rtl-ref.svg
new file mode 100644
index 000000000..41eb27b8d
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-rtl-ref.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text x="110" direction='rtl'>א</text>
+    <text x="90" direction='rtl'><tspan visibility="hidden">א</tspan>ב</text>
+    <text x="60" direction='rtl'><tspan visibility="hidden">אב</tspan>גדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx-rtl.svg b/layout/reftests/svg/text/simple-multiple-dx-rtl.svg
new file mode 100644
index 000000000..16632b13d
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text dx="110 -20 -30" direction='rtl'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-multiple-dx.svg b/layout/reftests/svg/text/simple-multiple-dx.svg
new file mode 100644
index 000000000..883e08818
--- /dev/null
+++ b/layout/reftests/svg/text/simple-multiple-dx.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text dx="10 20 30">hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-pointer-events.svg b/layout/reftests/svg/text/simple-pointer-events.svg
new file mode 100644
index 000000000..6c572418b
--- /dev/null
+++ b/layout/reftests/svg/text/simple-pointer-events.svg
@@ -0,0 +1,7 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <text x="100" y="100" style="font: 16px sans-serif; pointer-events: none">hello</text>
+</svg>
diff --git a/layout/reftests/svg/text/simple-ref.html b/layout/reftests/svg/text/simple-ref.html
new file mode 100644
index 000000000..410cd19bf
--- /dev/null
+++ b/layout/reftests/svg/text/simple-ref.html
@@ -0,0 +1,14 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<style>
+html, body { margin: 0 }
+svg, div { display: inline-block; width: 700px; height: 200px }
+div { font: 16px sans-serif; margin-left: -700px; vertical-align: 100px }
+span { margin-left: 100px }
+</style>
+<body>
+  <svg></svg><div><span>hello</span></div>
+</body>
diff --git a/layout/reftests/svg/text/simple-rtl-2.svg b/layout/reftests/svg/text/simple-rtl-2.svg
new file mode 100644
index 000000000..725a8901f
--- /dev/null
+++ b/layout/reftests/svg/text/simple-rtl-2.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(0,100)" style="font: 16px sans-serif">
+    <text direction='rtl' x='100'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-rtl-ref.html b/layout/reftests/svg/text/simple-rtl-ref.html
new file mode 100644
index 000000000..a82eb1e7e
--- /dev/null
+++ b/layout/reftests/svg/text/simple-rtl-ref.html
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<meta charset=UTF-8>
+<style>
+html, body { margin: 0 }
+svg, div { display: inline-block; width: 700px; height: 200px }
+div { font: 16px sans-serif; position: relative; margin-left: -700px; vertical-align: 100px }
+div { text-align: right; width: 200px }
+span { position: relative; right: 100px }
+</style>
+<body>
+<svg></svg><div><span>אבגדה</span></div>
diff --git a/layout/reftests/svg/text/simple-rtl.svg b/layout/reftests/svg/text/simple-rtl.svg
new file mode 100644
index 000000000..cdce9d87a
--- /dev/null
+++ b/layout/reftests/svg/text/simple-rtl.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text direction='rtl'>אבגדה</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple-selection-ref.html b/layout/reftests/svg/text/simple-selection-ref.html
new file mode 100644
index 000000000..45ee3cfec
--- /dev/null
+++ b/layout/reftests/svg/text/simple-selection-ref.html
@@ -0,0 +1,21 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<style>
+html, body { margin: 0 }
+svg, div { display: inline-block; width: 700px; height: 200px }
+div { font: 16px sans-serif; margin-left: -700px; vertical-align: 100px }
+span { margin-left: 100px }
+</style>
+<body>
+  <svg></svg><div><span>hello</span></div>
+  <script>
+    var span = document.getElementsByTagName("span")[0];
+    var range = document.createRange();
+    range.setStart(span.firstChild, 1);
+    range.setEnd(span.firstChild, 4);
+    window.getSelection().addRange(range);
+  </script>
+</body>
diff --git a/layout/reftests/svg/text/simple-selection.svg b/layout/reftests/svg/text/simple-selection.svg
new file mode 100644
index 000000000..227f587a7
--- /dev/null
+++ b/layout/reftests/svg/text/simple-selection.svg
@@ -0,0 +1,16 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>hello</text>
+  </g>
+  <script>
+    var text = document.getElementsByTagName("text")[0];
+    var range = document.createRange();
+    range.setStart(text.firstChild, 1);
+    range.setEnd(text.firstChild, 4);
+    window.getSelection().addRange(range);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/simple-transform-rotate-ref.svg b/layout/reftests/svg/text/simple-transform-rotate-ref.svg
new file mode 100644
index 000000000..40439005a
--- /dev/null
+++ b/layout/reftests/svg/text/simple-transform-rotate-ref.svg
@@ -0,0 +1,13 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <text x="100" y="100" rotate="45" style="font: 32px Ahem">a</text>
+</svg>
diff --git a/layout/reftests/svg/text/simple-transform-rotate.svg b/layout/reftests/svg/text/simple-transform-rotate.svg
new file mode 100644
index 000000000..18dd8f547
--- /dev/null
+++ b/layout/reftests/svg/text/simple-transform-rotate.svg
@@ -0,0 +1,13 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <style>
+    @font-face {
+      font-family: Ahem;
+      src: url(../../fonts/Ahem.ttf);
+    }
+  </style>
+  <text transform="translate(100,100)rotate(45)" style="font: 32px Ahem">a</text>
+</svg>
diff --git a/layout/reftests/svg/text/simple-underline-ref.html b/layout/reftests/svg/text/simple-underline-ref.html
new file mode 100644
index 000000000..b7a63e6bb
--- /dev/null
+++ b/layout/reftests/svg/text/simple-underline-ref.html
@@ -0,0 +1,14 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<style>
+html, body { margin: 0 }
+svg, div { display: inline-block; width: 700px; height: 200px }
+div { font: 16px sans-serif; text-decoration: underline; margin-left: -700px; vertical-align: 100px }
+span { margin-left: 100px; }
+</style>
+<body>
+  <svg></svg><div><span>hello</span></div>
+</body>
diff --git a/layout/reftests/svg/text/simple-underline-scaled-ref.svg b/layout/reftests/svg/text/simple-underline-scaled-ref.svg
new file mode 100644
index 000000000..3c7b0688b
--- /dev/null
+++ b/layout/reftests/svg/text/simple-underline-scaled-ref.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+  <text x="20" y="100" style="font: 64px sans-serif; text-decoration: underline">Hello</text>
+</svg>
diff --git a/layout/reftests/svg/text/simple-underline-scaled.svg b/layout/reftests/svg/text/simple-underline-scaled.svg
new file mode 100644
index 000000000..61f808faf
--- /dev/null
+++ b/layout/reftests/svg/text/simple-underline-scaled.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+  <text x="10" y="50" style="font: 32px sans-serif; text-decoration: underline" transform="scale(2)">Hello</text>
+</svg>
diff --git a/layout/reftests/svg/text/simple-underline-selection-ref.html b/layout/reftests/svg/text/simple-underline-selection-ref.html
new file mode 100644
index 000000000..b754ae0e8
--- /dev/null
+++ b/layout/reftests/svg/text/simple-underline-selection-ref.html
@@ -0,0 +1,21 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<style>
+html, body { margin: 0 }
+svg, div { display: inline-block; width: 700px; height: 200px }
+div { font: 16px sans-serif; text-decoration: underline; margin-left: -700px; vertical-align: 100px }
+span { margin-left: 100px; }
+</style>
+<body>
+  <svg></svg><div><span>hello</span></div>
+  <script>
+    var span = document.getElementsByTagName("span")[0];
+    var range = document.createRange();
+    range.setStart(span.firstChild, 1);
+    range.setEnd(span.firstChild, 4);
+    window.getSelection().addRange(range);
+  </script>
+</body>
diff --git a/layout/reftests/svg/text/simple-underline-selection.svg b/layout/reftests/svg/text/simple-underline-selection.svg
new file mode 100644
index 000000000..a4f3e9b48
--- /dev/null
+++ b/layout/reftests/svg/text/simple-underline-selection.svg
@@ -0,0 +1,16 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif; text-decoration: underline">
+    <text>hello</text>
+  </g>
+  <script>
+    var text = document.getElementsByTagName("text")[0];
+    var range = document.createRange();
+    range.setStart(text.firstChild, 1);
+    range.setEnd(text.firstChild, 4);
+    window.getSelection().addRange(range);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/simple-underline.svg b/layout/reftests/svg/text/simple-underline.svg
new file mode 100644
index 000000000..914396353
--- /dev/null
+++ b/layout/reftests/svg/text/simple-underline.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200" viewBox="0 0 700 200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif; text-decoration: underline">
+    <text>hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/simple.svg b/layout/reftests/svg/text/simple.svg
new file mode 100644
index 000000000..228b0755d
--- /dev/null
+++ b/layout/reftests/svg/text/simple.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="700" height="200">
+  <g transform="translate(100,100)" style="font: 16px sans-serif">
+    <text>hello</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/text-shadow-ref.svg b/layout/reftests/svg/text/text-shadow-ref.svg
new file mode 100644
index 000000000..0fff19f14
--- /dev/null
+++ b/layout/reftests/svg/text/text-shadow-ref.svg
@@ -0,0 +1,8 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <text x="33" y="33" fill="grey">Hello</text>
+  <text x="30" y="30" fill="green">Hello</text>
+</svg>
diff --git a/layout/reftests/svg/text/text-shadow.svg b/layout/reftests/svg/text/text-shadow.svg
new file mode 100644
index 000000000..35875f51d
--- /dev/null
+++ b/layout/reftests/svg/text/text-shadow.svg
@@ -0,0 +1,7 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <text x="30" y="30" fill="green" style="text-shadow: grey 3px 3px;">Hello</text>
+</svg>
diff --git a/layout/reftests/svg/text/textLength-2-ref.svg b/layout/reftests/svg/text/textLength-2-ref.svg
new file mode 100644
index 000000000..ac7b10cba
--- /dev/null
+++ b/layout/reftests/svg/text/textLength-2-ref.svg
@@ -0,0 +1,40 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    @font-face { font-family: Linux Libertine; src: url(../../fonts/LinLibertine_Re-4.7.5.woff); }
+    svg { font: 50px Linux Libertine; text-rendering: geometricPrecision; }
+  </style>
+  <!-- the unscaled width of the "123" is 66 -->
+  <g text-anchor="end" transform="translate(200,0)">
+    <g stroke="red">
+      <path d="M 0,40 h-66"/>
+      <path d="M 0,80 h-132"/>
+      <path d="M 0,120 h-132"/>
+      <path d="M 0,160 h-44"/>
+      <path d="M 0,200 h-44"/>
+    </g>
+
+    <g fill="aqua">
+      <text y="40">123</text>
+      <text x="-132" y="80" text-anchor="start">1</text>
+      <text x="-66" y="80" text-anchor="middle">2</text>
+      <text y="80">3</text>
+      <text transform="scale(2,1)" y="120">123</text>
+      <text x="-44" y="160" text-anchor="start">1</text>
+      <text x="-22" y="160" text-anchor="middle">2</text>
+      <text y="160">3</text>
+      <text transform="scale(0.6666666666,1)" y="200">123</text>
+    </g>
+
+    <g fill="none" stroke="black" stroke-width="2px">
+      <text y="40">123</text>
+      <text x="-132" y="80" text-anchor="start">1</text>
+      <text x="-66" y="80" text-anchor="middle">2</text>
+      <text y="80">3</text>
+      <text transform="scale(2,1)" y="120">123</text>
+      <text x="-44" y="160" text-anchor="start">1</text>
+      <text x="-22" y="160" text-anchor="middle">2</text>
+      <text y="160">3</text>
+      <text transform="scale(0.6666666666,1)" y="200">123</text>
+    </g>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/textLength-2.svg b/layout/reftests/svg/text/textLength-2.svg
new file mode 100644
index 000000000..ad66e9fc1
--- /dev/null
+++ b/layout/reftests/svg/text/textLength-2.svg
@@ -0,0 +1,36 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    @font-face { font-family: Linux Libertine; src: url(../../fonts/LinLibertine_Re-4.7.5.woff); }
+    svg { font: 50px Linux Libertine; text-rendering: geometricPrecision; }
+  </style>
+  <!-- the unscaled width of the "123" is 66 -->
+  <g text-anchor="end" transform="translate(200,0)">
+    <g stroke="red">
+      <path d="M 0,40 h-66"/>
+      <path d="M 0,80 h-132"/>
+      <path d="M 0,120 h-132"/>
+      <path d="M 0,160 h-44"/>
+      <path d="M 0,200 h-44"/>
+    </g>
+
+    <g fill="aqua">
+      <text y="40">123</text>
+      <text y="80" textLength="132">123</text>
+      <text y="120" textLength="132" lengthAdjust="spacingAndGlyphs">123</text>
+      <text y="160" textLength="44">123</text>
+      <text y="200" textLength="44" lengthAdjust="spacingAndGlyphs">123</text>
+    </g>
+
+    <g fill="none" stroke="black" stroke-width="2px">
+      <text y="40">123</text>
+      <text x="-132" y="80" text-anchor="start">1</text>
+      <text x="-66" y="80" text-anchor="middle">2</text>
+      <text y="80">3</text>
+      <text transform="scale(2,1)" y="120">123</text>
+      <text x="-44" y="160" text-anchor="start">1</text>
+      <text x="-22" y="160" text-anchor="middle">2</text>
+      <text y="160">3</text>
+      <text transform="scale(0.6666666666,1)" y="200">123</text>
+    </g>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/textLength-3-ref.svg b/layout/reftests/svg/text/textLength-3-ref.svg
new file mode 100644
index 000000000..a36feab1d
--- /dev/null
+++ b/layout/reftests/svg/text/textLength-3-ref.svg
@@ -0,0 +1,43 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    @font-face { font-family: Linux Libertine; src: url(../../fonts/LinLibertine_Re-4.7.5.woff); }
+    svg { font: 50px Linux Libertine; text-rendering: geometricPrecision; }
+  </style>
+  <linearGradient id="aqua">
+    <stop stop-color="aqua"/>
+  </linearGradient>
+  <!-- the unscaled width of the "123" is 66 -->
+  <g transform="translate(50,0)">
+    <g stroke="red">
+      <path id="p1" d="M 0,40 v 66" stroke="red"/>
+      <path id="p2" d="M 40,40 v 132" stroke="red"/>
+      <path id="p3" d="M 80,40 v 132" stroke="red"/>
+      <path id="p4" d="M 120,40 v 44" stroke="red"/>
+      <path id="p5" d="M 160,40 v 44" stroke="red"/>
+    </g>
+
+    <g fill="url(#aqua)">
+      <text transform="translate(40,40)rotate(90)" y="40">123</text>
+      <text transform="translate(80,40)rotate(90)" y="40">1</text>
+      <text transform="translate(80,40)rotate(90)" x="66" y="40" text-anchor="middle">2</text>
+      <text transform="translate(80,40)rotate(90)" x="132" y="40" text-anchor="end">3</text>
+      <text transform="translate(80,40)rotate(90)scale(2,1)">123</text>
+      <text transform="translate(120,40)rotate(90)">1</text>
+      <text transform="translate(120,40)rotate(90)" x="22" text-anchor="middle">2</text>
+      <text transform="translate(120,40)rotate(90)" x="44" text-anchor="end">3</text>
+      <text transform="translate(160,40)rotate(90)scale(0.66666666,1)">123</text>
+    </g>
+
+    <g fill="none" stroke="black" stroke-width="2px">
+      <text transform="translate(40,40)rotate(90)" y="40">123</text>
+      <text transform="translate(80,40)rotate(90)" y="40">1</text>
+      <text transform="translate(80,40)rotate(90)" x="66" y="40" text-anchor="middle">2</text>
+      <text transform="translate(80,40)rotate(90)" x="132" y="40" text-anchor="end">3</text>
+      <text transform="translate(80,40)rotate(90)scale(2,1)">123</text>
+      <text transform="translate(120,40)rotate(90)">1</text>
+      <text transform="translate(120,40)rotate(90)" x="22" text-anchor="middle">2</text>
+      <text transform="translate(120,40)rotate(90)" x="44" text-anchor="end">3</text>
+      <text transform="translate(160,40)rotate(90)scale(0.66666666,1)">123</text>
+    </g>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/textLength-3.svg b/layout/reftests/svg/text/textLength-3.svg
new file mode 100644
index 000000000..b3b8d93da
--- /dev/null
+++ b/layout/reftests/svg/text/textLength-3.svg
@@ -0,0 +1,40 @@
+<svg xmlns="http://www.w3.org/2000/svg"
+     xmlns:xlink="http://www.w3.org/1999/xlink">
+  <style>
+    @font-face { font-family: Linux Libertine; src: url(../../fonts/LinLibertine_Re-4.7.5.woff); }
+    svg { font: 50px Linux Libertine; text-rendering: geometricPrecision; }
+  </style>
+  <linearGradient id="aqua">
+    <stop stop-color="aqua"/>
+  </linearGradient>
+  <!-- the unscaled width of the "123" is 66 -->
+  <g transform="translate(50,0)">
+    <g stroke="red">
+      <path id="p1" d="M 0,40 v 66"/>
+      <path id="p2" d="M 40,40 v 132"/>
+      <path id="p3" d="M 80,40 v 132"/>
+      <path id="p4" d="M 120,40 v 44"/>
+      <path id="p5" d="M 160,40 v 44"/>
+    </g>
+
+    <g fill="url(#aqua)">
+      <text><textPath xlink:href="#p1">123</textPath></text>
+      <text textLength="132"><textPath xlink:href="#p2">123</textPath></text>
+      <text id="t" textLength="132" lengthAdjust="spacingAndGlyphs"><textPath xlink:href="#p3">123</textPath></text>
+      <text textLength="44"><textPath xlink:href="#p4">123</textPath></text>
+      <text textLength="44" lengthAdjust="spacingAndGlyphs"><textPath xlink:href="#p5">123</textPath></text>
+    </g>
+
+    <g fill="none" stroke="black" stroke-width="2px">
+      <text transform="translate(40,40)rotate(90)" y="40">123</text>
+      <text transform="translate(80,40)rotate(90)" y="40">1</text>
+      <text transform="translate(80,40)rotate(90)" x="66" y="40" text-anchor="middle">2</text>
+      <text transform="translate(80,40)rotate(90)" x="132" y="40" text-anchor="end">3</text>
+      <text transform="translate(80,40)rotate(90)scale(2,1)">123</text>
+      <text transform="translate(120,40)rotate(90)">1</text>
+      <text transform="translate(120,40)rotate(90)" x="22" text-anchor="middle">2</text>
+      <text transform="translate(120,40)rotate(90)" x="44" text-anchor="end">3</text>
+      <text transform="translate(160,40)rotate(90)scale(0.66666666,1)">123</text>
+    </g>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/textLength-4-ref.svg b/layout/reftests/svg/text/textLength-4-ref.svg
new file mode 100644
index 000000000..1a7153b32
--- /dev/null
+++ b/layout/reftests/svg/text/textLength-4-ref.svg
@@ -0,0 +1,28 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    @font-face {
+      font-family: Linux Libertine;
+      src: url(../../fonts/LinLibertine_Re-4.7.5.woff);
+    }
+  </style>
+  <!-- the unscaled width of the "123" is 66 -->
+  <linearGradient id="g1" x1="0" y1="0" x2="66" y2="0" gradientUnits="userSpaceOnUse">
+    <stop stop-color="red"/>
+    <stop offset="0.333333" stop-color="red"/>
+    <stop offset="0.333333" stop-color="yellow"/>
+    <stop offset="0.666666" stop-color="yellow"/>
+    <stop offset="0.666666" stop-color="red"/>
+    <stop offset="1" stop-color="red"/>
+  </linearGradient>
+  <linearGradient id="g2" x1="100" y1="0" x2="232" y2="0" gradientUnits="userSpaceOnUse">
+    <stop stop-color="red"/>
+    <stop offset="0.333333" stop-color="red"/>
+    <stop offset="0.333333" stop-color="yellow"/>
+    <stop offset="0.666666" stop-color="yellow"/>
+    <stop offset="0.666666" stop-color="red"/>
+    <stop offset="1" stop-color="red"/>
+  </linearGradient>
+  <text transform="scale(2,1)translate(50,0)" y="100" style="font: 50px Linux Libertine; text-rendering: geometricPrecision; fill: url(#g1)">123</text>
+  <text transform="scale(2,1)translate(50,0)" y="100" style="font: 50px Linux Libertine; text-rendering: geometricPrecision; fill: none; stroke: black; stroke-width: 2px">123</text>
+  <rect x="100" y="110" width="132" height="10" fill="url(#g2)"/>
+</svg>
diff --git a/layout/reftests/svg/text/textLength-4.svg b/layout/reftests/svg/text/textLength-4.svg
new file mode 100644
index 000000000..d34630471
--- /dev/null
+++ b/layout/reftests/svg/text/textLength-4.svg
@@ -0,0 +1,20 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    @font-face {
+      font-family: Linux Libertine;
+      src: url(../../fonts/LinLibertine_Re-4.7.5.woff);
+    }
+  </style>
+  <!-- the unscaled width of the "123" is 66 -->
+  <linearGradient id="g" x1="100" y1="0" x2="232" y2="0" gradientUnits="userSpaceOnUse">
+    <stop stop-color="red"/>
+    <stop offset="0.333333" stop-color="red"/>
+    <stop offset="0.333333" stop-color="yellow"/>
+    <stop offset="0.666666" stop-color="yellow"/>
+    <stop offset="0.666666" stop-color="red"/>
+    <stop offset="1" stop-color="red"/>
+  </linearGradient>
+  <text x="100" y="100" style="font: 50px Linux Libertine; text-rendering: geometricPrecision" textLength="132" lengthAdjust="spacingAndGlyphs" fill="url(#g)">123</text>
+  <text transform="scale(2,1)translate(50,0)" y="100" style="font: 50px Linux Libertine; text-rendering: geometricPrecision; fill: none; stroke: black; stroke-width: 2px">123</text>
+  <rect x="100" y="110" width="132" height="10" fill="url(#g)"/>
+</svg>
diff --git a/layout/reftests/svg/text/textLength-5-ref.svg b/layout/reftests/svg/text/textLength-5-ref.svg
new file mode 100644
index 000000000..2c6e7c2a4
--- /dev/null
+++ b/layout/reftests/svg/text/textLength-5-ref.svg
@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+  <text x="100" y="100" style="font: 32px sans-serif" textLength="50" lengthAdjust="spacingAndGlyphs">hello</text>
+  <text x="100" y="140" style="font: 32px sans-serif" textLength="50" lengthAdjust="spacingAndGlyphs">hello</text>
+</svg>
diff --git a/layout/reftests/svg/text/textLength-5.svg b/layout/reftests/svg/text/textLength-5.svg
new file mode 100644
index 000000000..52e2fc3a3
--- /dev/null
+++ b/layout/reftests/svg/text/textLength-5.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+  <text x="100" y="100" style="font: 32px sans-serif" textLength="100" lengthAdjust="spacingAndGlyphs">hello<tspan x="100" y="140">hello</tspan></text>
+</svg>
diff --git a/layout/reftests/svg/text/textLength-6-ref.svg b/layout/reftests/svg/text/textLength-6-ref.svg
new file mode 100644
index 000000000..2c6e7c2a4
--- /dev/null
+++ b/layout/reftests/svg/text/textLength-6-ref.svg
@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+  <text x="100" y="100" style="font: 32px sans-serif" textLength="50" lengthAdjust="spacingAndGlyphs">hello</text>
+  <text x="100" y="140" style="font: 32px sans-serif" textLength="50" lengthAdjust="spacingAndGlyphs">hello</text>
+</svg>
diff --git a/layout/reftests/svg/text/textLength-6.svg b/layout/reftests/svg/text/textLength-6.svg
new file mode 100644
index 000000000..587124f71
--- /dev/null
+++ b/layout/reftests/svg/text/textLength-6.svg
@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+  <text x="100" y="100" style="font: 32px sans-serif">hello<tspan x="100" y="140">hello</tspan>
+    <animate attributeName="textLength" begin="-100s" dur="200s" values="50; 100; 100; 150"/>
+    <set attributeName="lengthAdjust" to="spacingAndGlyphs"/></text>
+</svg>
diff --git a/layout/reftests/svg/text/textLength-ref.svg b/layout/reftests/svg/text/textLength-ref.svg
new file mode 100644
index 000000000..bcdb21f4c
--- /dev/null
+++ b/layout/reftests/svg/text/textLength-ref.svg
@@ -0,0 +1,40 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    @font-face { font-family: Linux Libertine; src: url(../../fonts/LinLibertine_Re-4.7.5.woff); }
+    svg { font: 50px Linux Libertine; text-rendering: geometricPrecision; }
+  </style>
+  <!-- the unscaled width of the "123" is 66 -->
+  <g transform="translate(50,0)">
+    <g stroke="red">
+      <path d="M 0,40 h 66"/>
+      <path d="M 0,80 h 132"/>
+      <path d="M 0,120 h 132"/>
+      <path d="M 0,160 h 44"/>
+      <path d="M 0,200 h 44"/>
+    </g>
+
+    <g fill="aqua">
+      <text y="40">123</text>
+      <text y="80">1</text>
+      <text x="66" y="80" text-anchor="middle">2</text>
+      <text x="132" y="80" text-anchor="end">3</text>
+      <text transform="scale(2,1)" y="120">123</text>
+      <text y="160">1</text>
+      <text x="22" y="160" text-anchor="middle">2</text>
+      <text x="44" y="160" text-anchor="end">3</text>
+      <text transform="scale(0.6666666666,1)" y="200">123</text>
+    </g>
+
+    <g fill="none" stroke="black" stroke-width="2px">
+      <text y="40">123</text>
+      <text y="80">1</text>
+      <text x="66" y="80" text-anchor="middle">2</text>
+      <text x="132" y="80" text-anchor="end">3</text>
+      <text transform="scale(2,1)" y="120">123</text>
+      <text y="160">1</text>
+      <text x="22" y="160" text-anchor="middle">2</text>
+      <text x="44" y="160" text-anchor="end">3</text>
+      <text transform="scale(0.6666666666,1)" y="200">123</text>
+    </g>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/textLength.svg b/layout/reftests/svg/text/textLength.svg
new file mode 100644
index 000000000..93dd2e61f
--- /dev/null
+++ b/layout/reftests/svg/text/textLength.svg
@@ -0,0 +1,36 @@
+<svg xmlns="http://www.w3.org/2000/svg">
+  <style>
+    @font-face { font-family: Linux Libertine; src: url(../../fonts/LinLibertine_Re-4.7.5.woff); }
+    svg { font: 50px Linux Libertine; text-rendering: geometricPrecision; }
+  </style>
+  <!-- the unscaled width of the "123" is 66 -->
+  <g transform="translate(50,0)">
+    <g stroke="red">
+      <path d="M 0,40 h 66"/>
+      <path d="M 0,80 h 132"/>
+      <path d="M 0,120 h 132"/>
+      <path d="M 0,160 h 44"/>
+      <path d="M 0,200 h 44"/>
+    </g>
+
+    <g fill="aqua">
+      <text y="40">123</text>
+      <text y="80" textLength="132">123</text>
+      <text y="120" textLength="132" lengthAdjust="spacingAndGlyphs">123</text>
+      <text y="160" textLength="44">123</text>
+      <text y="200" textLength="44" lengthAdjust="spacingAndGlyphs">123</text>
+    </g>
+
+    <g fill="none" stroke="black" stroke-width="2px">
+      <text y="40">123</text>
+      <text y="80">1</text>
+      <text x="66" y="80" text-anchor="middle">2</text>
+      <text x="132" y="80" text-anchor="end">3</text>
+      <text transform="scale(2,1)" y="120">123</text>
+      <text y="160">1</text>
+      <text x="22" y="160" text-anchor="middle">2</text>
+      <text x="44" y="160" text-anchor="end">3</text>
+      <text transform="scale(0.6666666666,1)" y="200">123</text>
+    </g>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-a-ref.svg b/layout/reftests/svg/text/textpath-a-ref.svg
new file mode 100644
index 000000000..50de8ee34
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-a-ref.svg
@@ -0,0 +1,8 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="font: 16px sans-serif">
+  <path id="p" d="M 100,100 h 100"/>
+  <text><textPath xlink:href="#p">hello</textPath></text>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-a.svg b/layout/reftests/svg/text/textpath-a.svg
new file mode 100644
index 000000000..639f47db4
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-a.svg
@@ -0,0 +1,8 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="font: 16px sans-serif">
+  <path id="p" d="M 100,100 h 100"/>
+  <text><a><textPath xlink:href="#p">hello</textPath></a></text>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-after-anchor-end-ref.svg b/layout/reftests/svg/text/textpath-after-anchor-end-ref.svg
new file mode 100644
index 000000000..5b32f5461
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-after-anchor-end-ref.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <g transform="translate(150,50)" style="font: 32px sans-serif">
+    <path id="p" d="M 100,100 l 100,100"/>
+    <text text-anchor="end"><textPath xlink:href="#p" startOffset="100%">hello</textPath><tspan y="0">there</tspan></text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-after-anchor-end.svg b/layout/reftests/svg/text/textpath-after-anchor-end.svg
new file mode 100644
index 000000000..4a8a19b08
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-after-anchor-end.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <g transform="translate(150,50)" style="font: 32px sans-serif">
+    <path id="p" d="M 100,100 l 100,100"/>
+    <text text-anchor="end"><textPath xlink:href="#p" startOffset="100%">hello</textPath>there</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-after-ref.svg b/layout/reftests/svg/text/textpath-after-ref.svg
new file mode 100644
index 000000000..c90ae4fcc
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-after-ref.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <g transform="translate(50,50)" style="font: 32px sans-serif">
+    <path id="p" d="M 100,100 l 100,100"/>
+    <text><textPath xlink:href="#p">hello</textPath></text>
+    <text><tspan visibility="hidden">hello</tspan>there</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-after.svg b/layout/reftests/svg/text/textpath-after.svg
new file mode 100644
index 000000000..b250e833e
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-after.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <g transform="translate(50,50)" style="font: 32px sans-serif">
+    <path id="p" d="M 100,100 l 100,100"/>
+    <text><textPath xlink:href="#p">hello</textPath>there</text>
+  </g>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-anchor-end-ref.svg b/layout/reftests/svg/text/textpath-anchor-end-ref.svg
new file mode 100644
index 000000000..27d80ae05
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-anchor-end-ref.svg
@@ -0,0 +1,8 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <path id="p" d="M 0,100 h 200"/>
+  <text x="200" y="100" text-anchor="end" style="font: 16px sans-serif">hello</text>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-anchor-end.svg b/layout/reftests/svg/text/textpath-anchor-end.svg
new file mode 100644
index 000000000..f77549ab7
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-anchor-end.svg
@@ -0,0 +1,8 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <path id="p" d="M 0,100 h 200"/>
+  <text text-anchor="end" style="font: 16px sans-serif"><textPath xlink:href="#p" startOffset="100%">hello</textPath></text>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-anchor-middle-ref.svg b/layout/reftests/svg/text/textpath-anchor-middle-ref.svg
new file mode 100644
index 000000000..dfa19bc42
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-anchor-middle-ref.svg
@@ -0,0 +1,7 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <text x="100" y="100" text-anchor="middle" style="font: 16px sans-serif">ABCDE</text>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-anchor-middle.svg b/layout/reftests/svg/text/textpath-anchor-middle.svg
new file mode 100644
index 000000000..8f7b347e2
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-anchor-middle.svg
@@ -0,0 +1,8 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <path id="p" d="M 0,100 h 200"/>
+  <text text-anchor="middle" style="font: 16px sans-serif"><textPath xlink:href="#p" startOffset="50%">ABCDE</textPath></text>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-invalid-parent-ref.svg b/layout/reftests/svg/text/textpath-invalid-parent-ref.svg
new file mode 100644
index 000000000..ecb9af043
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-invalid-parent-ref.svg
@@ -0,0 +1,8 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="font: 16px sans-serif">
+  <path id="p" d="M 100,100 h 100"/>
+  <text x="50" y="100">hello<tspan><textPath xlink:href="#p"> or not</textPath></tspan></text>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-invalid-parent.svg b/layout/reftests/svg/text/textpath-invalid-parent.svg
new file mode 100644
index 000000000..ecb9af043
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-invalid-parent.svg
@@ -0,0 +1,8 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="font: 16px sans-serif">
+  <path id="p" d="M 100,100 h 100"/>
+  <text x="50" y="100">hello<tspan><textPath xlink:href="#p"> or not</textPath></tspan></text>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-multiline-2-ref.svg b/layout/reftests/svg/text/textpath-multiline-2-ref.svg
new file mode 100644
index 000000000..8bd2b7cb3
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-multiline-2-ref.svg
@@ -0,0 +1,12 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <path id="p" d="M 50,200 C 50,100 300,100 300,200" fill="none"/>
+  <text style="font: 24px/30px sans-serif; text-anchor: middle">
+    <textPath xlink:href="#p" startOffset="50%">
+      <tspan x="0" y="0">hello</tspan><tspan x="0" y="30">hello</tspan><tspan x="0" y="60">hello</tspan>
+    </textPath>
+  </text>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-multiline-2.svg b/layout/reftests/svg/text/textpath-multiline-2.svg
new file mode 100644
index 000000000..363cf8be5
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-multiline-2.svg
@@ -0,0 +1,12 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <path id="p" d="M 50,200 C 50,100 300,100 300,200" fill="none"/>
+  <text style="white-space: pre-line; font: 24px/30px sans-serif; text-anchor: middle">
+    <textPath xlink:href="#p" startOffset="50%">hello
+hello
+hello</textPath>
+  </text>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-multiline-ref.svg b/layout/reftests/svg/text/textpath-multiline-ref.svg
new file mode 100644
index 000000000..d6d0ed7bb
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-multiline-ref.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <text x="100" y="100" style="line-height: 20px; white-space: pre-line; font: 16px sans-serif">line 1
+line 2
+line 3</text>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-multiline.svg b/layout/reftests/svg/text/textpath-multiline.svg
new file mode 100644
index 000000000..06f5ec379
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-multiline.svg
@@ -0,0 +1,12 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <path id="p" d="M 100,100 h 400"/>
+  <text style="white-space: pre-line; line-height: 20px; font: 16px sans-serif">
+    <textPath xlink:href="#p">line 1
+line 2
+line 3</textPath>
+  </text>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-ref.svg b/layout/reftests/svg/text/textpath-ref.svg
new file mode 100644
index 000000000..5bd8d5b9d
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-ref.svg
@@ -0,0 +1,33 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <path id="p" d="M 100,100 h 50 v 200" fill="none" stroke="red" stroke-width="1"/>
+  <g style="font: 30px monospace">
+    <text x="100" y="100">a</text>
+  </g>
+  <script><![CDATA[
+    function put(s, x, y, r) {
+      var e = document.createElementNS("http://www.w3.org/2000/svg", "text");
+      e.setAttribute("x", x);
+      e.setAttribute("y", y);
+      e.setAttribute("rotate", r);
+      e.textContent = s;
+      g.appendChild(e);
+    }
+
+    var s = "a.b.c.d.e.";
+    var text = document.getElementsByTagName("text")[0];
+    var g = text.parentNode;
+    var adv = text.getSubStringLength(0, 1);
+    for (var i = 1; i < s.length; i++) {
+      var x = i * adv;
+      if (x + adv / 2 < 50) {
+        put(s[i], 100 + x, 100, 0);
+      } else {
+        put(s[i], 150, 50 + x, 90);
+      }
+    }
+  ]]></script>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-selection-ref.svg b/layout/reftests/svg/text/textpath-selection-ref.svg
new file mode 100644
index 000000000..4d06ad021
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-selection-ref.svg
@@ -0,0 +1,39 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <path id="p" d="M 100,100 h 50 v 200" fill="none" stroke="red" stroke-width="1"/>
+  <g style="font: 30px monospace">
+    <text x="100" y="100">a</text>
+  </g>
+  <script><![CDATA[
+    function put(s, x, y, r) {
+      var e = document.createElementNS("http://www.w3.org/2000/svg", "text");
+      e.setAttribute("x", x);
+      e.setAttribute("y", y);
+      e.setAttribute("rotate", r);
+      e.textContent = s;
+      g.appendChild(e);
+    }
+
+    var s = "a.b.c.d.e.";
+    var text = document.getElementsByTagName("text")[0];
+    var g = text.parentNode;
+    var adv = text.getSubStringLength(0, 1);
+    for (var i = 1; i < s.length; i++) {
+      var x = i * adv;
+      if (x + adv / 2 < 50) {
+        put(s[i], 100 + x, 100, 0);
+      } else {
+        put(s[i], 150, 50 + x, 90);
+      }
+    }
+
+    var lastText = document.getElementsByTagName("text")[s.length - 1];
+    var range = document.createRange();
+    range.setStart(text.firstChild, 1);
+    range.setEnd(lastText.firstChild, 0);
+    window.getSelection().addRange(range);
+  ]]></script>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-selection.svg b/layout/reftests/svg/text/textpath-selection.svg
new file mode 100644
index 000000000..6e98a9d84
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-selection.svg
@@ -0,0 +1,15 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <path id="p" d="M 100,100 h 50 v 200" fill="none" stroke="red" stroke-width="1"/>
+  <text style="font: 30px monospace"><textPath xlink:href="#p">a.b.c.d.e.</textPath></text>
+  <script>
+    var textPath = document.getElementsByTagName("textPath")[0];
+    var range = document.createRange();
+    range.setStart(textPath.firstChild, 1);
+    range.setEnd(textPath.firstChild, 9);
+    window.getSelection().addRange(range);
+  </script>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-vertical-dx-ref.svg b/layout/reftests/svg/text/textpath-vertical-dx-ref.svg
new file mode 100644
index 000000000..e73812b61
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-vertical-dx-ref.svg
@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <style>
+    path { stroke: red; }
+    text { writing-mode: vertical-rl; font: 24px sans-serif; }
+  </style>
+  <path id="p" d="M 40,40 v 150"/>
+  <text transform="translate(16, 0)"><textPath xlink:href="#p">中国 China</textPath></text>
+</svg>
diff --git a/layout/reftests/svg/text/textpath-vertical-dx.svg b/layout/reftests/svg/text/textpath-vertical-dx.svg
new file mode 100644
index 000000000..92657cd3c
--- /dev/null
+++ b/layout/reftests/svg/text/textpath-vertical-dx.svg
@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <style>
+    path { stroke: red; }
+    text { writing-mode: vertical-rl; font: 24px sans-serif; }
+  </style>
+  <path id="p" d="M 40,40 v 150"/>
+  <text dx="16"><textPath xlink:href="#p">中国 China</textPath></text>
+</svg>
diff --git a/layout/reftests/svg/text/textpath.svg b/layout/reftests/svg/text/textpath.svg
new file mode 100644
index 000000000..cba2085c9
--- /dev/null
+++ b/layout/reftests/svg/text/textpath.svg
@@ -0,0 +1,8 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <path id="p" d="M 100,100 h 50 v 200" fill="none" stroke="red" stroke-width="1"/>
+  <text style="font: 30px monospace"><textPath xlink:href="#p">a.b.c.d.e.</textPath></text>
+</svg>
diff --git a/layout/reftests/svg/text/vertical-01-ref.svg b/layout/reftests/svg/text/vertical-01-ref.svg
new file mode 100644
index 000000000..31989c426
--- /dev/null
+++ b/layout/reftests/svg/text/vertical-01-ref.svg
@@ -0,0 +1,12 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+  <defs>
+    <path id="path" d="M 100, 100 v 200" />
+  </defs>
+  <text style="font: 48px sans-serif" text-rendering="geometricPrecision">
+    <textPath xlink:href="#path">A B C</textPath>
+  </text>
+</svg>
diff --git a/layout/reftests/svg/text/vertical-01.svg b/layout/reftests/svg/text/vertical-01.svg
new file mode 100644
index 000000000..a5fe02af0
--- /dev/null
+++ b/layout/reftests/svg/text/vertical-01.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <text x="100" y="100" text-rendering="geometricPrecision"
+        writing-mode="vertical-rl" style="text-orientation: sideways-right;font: 48px sans-serif">
+    A B C
+  </text>
+</svg>
author	Matt A. Tobin <mattatobin@localhost.localdomain>	2018-02-02 04:16:08 -0500
committer	Matt A. Tobin <mattatobin@localhost.localdomain>	2018-02-02 04:16:08 -0500
commit	5f8de423f190bbb79a62f804151bc24824fa32d8 (patch)
tree	10027f336435511475e392454359edea8e25895d /layout/reftests/svg/text
parent	49ee0794b5d912db1f95dce6eb52d781dc210db5 (diff)
download	UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.gz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.lz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.xz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.zip