Bug 1460859 [wpt PR 10963] - Add basic text in a shape tests., a=testonly
authorChris Lilley <chris@w3.org>
Mon, 20 Aug 2018 22:08:20 +0000
changeset 487793 2dcc5b1e23dde5ef5ed30c1f38e40b149aa00744
parent 487792 3446e763cf522ae6165a9e693b301a04dc904764
child 487794 3166f55901c15bab16166a1daa2ebe09c4395311
push id9719
push userffxbld-merge
push dateFri, 24 Aug 2018 17:49:46 +0000
treeherdermozilla-beta@719ec98fba77 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerstestonly
bugs1460859, 10963
milestone63.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1460859 [wpt PR 10963] - Add basic text in a shape tests., a=testonly Automatic update from web-platform-testsMerge pull request #10963 from Tavmjong/text-shape Add basic text in a shape tests. -- wpt-commits: 79d77b7a845d6a141feeb7f2f719fa121b34be89 wpt-pr: 10963
testing/web-platform/meta/MANIFEST.json
testing/web-platform/tests/svg/text/reftests/text-complex-001-ref.svg
testing/web-platform/tests/svg/text/reftests/text-complex-001.svg
testing/web-platform/tests/svg/text/reftests/text-complex-002-ref.svg
testing/web-platform/tests/svg/text/reftests/text-complex-002.svg
testing/web-platform/tests/svg/text/reftests/text-shape-inside-001-ref.svg
testing/web-platform/tests/svg/text/reftests/text-shape-inside-001.svg
testing/web-platform/tests/svg/text/reftests/text-shape-inside-002-ref.svg
testing/web-platform/tests/svg/text/reftests/text-shape-inside-002.svg
--- a/testing/web-platform/meta/MANIFEST.json
+++ b/testing/web-platform/meta/MANIFEST.json
@@ -186366,16 +186366,40 @@
       [
        "/svg/styling/render/transform-ref.svg",
        "=="
       ]
      ],
      {}
     ]
    ],
+   "svg/text/reftests/text-complex-001.svg": [
+    [
+     "/svg/text/reftests/text-complex-001.svg",
+     [
+      [
+       "/svg/text/reftests/text-complex-001-ref.svg",
+       "=="
+      ]
+     ],
+     {}
+    ]
+   ],
+   "svg/text/reftests/text-complex-002.svg": [
+    [
+     "/svg/text/reftests/text-complex-002.svg",
+     [
+      [
+       "/svg/text/reftests/text-complex-002-ref.svg",
+       "=="
+      ]
+     ],
+     {}
+    ]
+   ],
    "svg/text/reftests/text-inline-size-001.svg": [
     [
      "/svg/text/reftests/text-inline-size-001.svg",
      [
       [
        "/svg/text/reftests/text-inline-size-001-ref.svg",
        "=="
       ]
@@ -186498,16 +186522,40 @@
       [
        "/svg/text/reftests/text-multiline-003-ref.svg",
        "=="
       ]
      ],
      {}
     ]
    ],
+   "svg/text/reftests/text-shape-inside-001.svg": [
+    [
+     "/svg/text/reftests/text-shape-inside-001.svg",
+     [
+      [
+       "/svg/text/reftests/text-shape-inside-001-ref.svg",
+       "=="
+      ]
+     ],
+     {}
+    ]
+   ],
+   "svg/text/reftests/text-shape-inside-002.svg": [
+    [
+     "/svg/text/reftests/text-shape-inside-002.svg",
+     [
+      [
+       "/svg/text/reftests/text-shape-inside-002-ref.svg",
+       "=="
+      ]
+     ],
+     {}
+    ]
+   ],
    "svg/text/reftests/textpath-shape-001.svg": [
     [
      "/svg/text/reftests/textpath-shape-001.svg",
      [
       [
        "/svg/text/reftests/textpath-side-001-ref.svg",
        "=="
       ]
@@ -301234,16 +301282,26 @@
      {}
     ]
    ],
    "svg/styling/render/transform-ref.svg": [
     [
      {}
     ]
    ],
+   "svg/text/reftests/text-complex-001-ref.svg": [
+    [
+     {}
+    ]
+   ],
+   "svg/text/reftests/text-complex-002-ref.svg": [
+    [
+     {}
+    ]
+   ],
    "svg/text/reftests/text-inline-size-001-ref.svg": [
     [
      {}
     ]
    ],
    "svg/text/reftests/text-inline-size-002-ref.svg": [
     [
      {}
@@ -301289,16 +301347,26 @@
      {}
     ]
    ],
    "svg/text/reftests/text-multiline-003-ref.svg": [
     [
      {}
     ]
    ],
+   "svg/text/reftests/text-shape-inside-001-ref.svg": [
+    [
+     {}
+    ]
+   ],
+   "svg/text/reftests/text-shape-inside-002-ref.svg": [
+    [
+     {}
+    ]
+   ],
    "svg/text/reftests/textpath-shape-001-ref.svg": [
     [
      {}
     ]
    ],
    "svg/text/reftests/textpath-side-001-ref.svg": [
     [
      {}
@@ -637146,16 +637214,32 @@
   "svg/styling/required-properties.svg": [
    "c257254d747fb0231d638ac431fcae97dbbed7e7",
    "testharness"
   ],
   "svg/svg-in-svg/svg-in-svg-circular-filter-reference-crash.html": [
    "51303171f09d28e3958ab74ecdce7f9cf120bd12",
    "testharness"
   ],
+  "svg/text/reftests/text-complex-001-ref.svg": [
+   "5ade69dce1de95954861271c0e523767230ae275",
+   "support"
+  ],
+  "svg/text/reftests/text-complex-001.svg": [
+   "747737cce7e39fb7336530328e5de7f1d2c07f01",
+   "reftest"
+  ],
+  "svg/text/reftests/text-complex-002-ref.svg": [
+   "3d3968fa4923436e760dd80b05af292a615cffcb",
+   "support"
+  ],
+  "svg/text/reftests/text-complex-002.svg": [
+   "40b62ac95d66f2914c8a373332f567929e8d2aae",
+   "reftest"
+  ],
   "svg/text/reftests/text-inline-size-001-ref.svg": [
    "6abd211584ea3b500e409c0f0fa956182fe131e6",
    "support"
   ],
   "svg/text/reftests/text-inline-size-001.svg": [
    "ae1a10d190ac0f04a2a3168ff8096aaa4fa60066",
    "reftest"
   ],
@@ -637234,16 +637318,32 @@
   "svg/text/reftests/text-multiline-003-ref.svg": [
    "cbfce51b88e8be12f4a29945444b819066d5f74d",
    "support"
   ],
   "svg/text/reftests/text-multiline-003.svg": [
    "e52bb770521c1b60a6b3998324882a36153ef243",
    "reftest"
   ],
+  "svg/text/reftests/text-shape-inside-001-ref.svg": [
+   "5a2c6c0b472669ce32509bd0bdbd09ba1a195ab2",
+   "support"
+  ],
+  "svg/text/reftests/text-shape-inside-001.svg": [
+   "248fe1a44f98099dd678e9ef63f1b97a5c09cfdf",
+   "reftest"
+  ],
+  "svg/text/reftests/text-shape-inside-002-ref.svg": [
+   "e75ce485c5cf3fa3fc5acb24bb3d2b2d4b6ef49b",
+   "support"
+  ],
+  "svg/text/reftests/text-shape-inside-002.svg": [
+   "64b1307966c4527c0ba6546d7e80730512d8f382",
+   "reftest"
+  ],
   "svg/text/reftests/textpath-shape-001-ref.svg": [
    "10827c85810cdf9dc7e70a665c289814d35ed219",
    "support"
   ],
   "svg/text/reftests/textpath-shape-001.svg": [
    "cd4d384d9dd893bb249f280f0569971abfc4d1b2",
    "reftest"
   ],
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/svg/text/reftests/text-complex-001-ref.svg
@@ -0,0 +1,73 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg id="svg-root"
+  width="100%" height="100%" viewBox="0 0 480 360"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <g id="testmeta">
+    <title>Text in Shape — 001</title>
+    <html:link rel="author"
+          title="Tavmjong Bah"
+          href="mailto:tavmjong@free.fr"/>
+    <html:link rel="reviewer"
+          title="NAME_OF_REVIEWER"
+          href="mailto:EMAIL OR http://CONTACT_PAGE" />
+          <!-- YYYY-MM-DD -->
+    <html:link rel="help"
+          href="https://svgwg.org/svg2-draft/text.html#TextShapeInside"/>
+    <metadata class="flags">TOKENS</metadata>
+    <desc class="assert">TEST ASSERTION</desc>
+  </g>
+
+  <style id="test-font" type="text/css">
+    /* Standard Font (if needed). */
+    @font-face {
+      font-family: FreeSans;
+      src: url("fonts/FreeSans.woff") format("woff"),
+           local("FreeSans");
+    }
+    text { font-family: FreeSans, sans-serif }
+  </style>
+
+  <style id="test-style" type="text/css">
+    /* Style that is being tested (if needed). */
+    text { font-family: FreeSans, sans-serif }
+  </style>
+
+  <defs>
+    <circle id="Circle1" cx="120" cy="180" r="100"/>
+    <circle id="Circle2" cx="360" cy="240" r="100"/>
+    <rect id="Rect1" x="120" y="80"  width="240" height="80" style="shape-margin: 20px;"/>
+    <rect id="Rect2" x="120" y="260" width="240" height="80" style="shape-margin: 20px;"/>
+    <circle id="Circle1x" cx="120" cy="180" r="80"/>
+    <circle id="Circle2x" cx="360" cy="240" r="80"/>
+    <rect id="Rect1x" x="100" y="60"  width="280" height="120"/>
+    <rect id="Rect2x" x="100" y="240" width="280" height="120"/>
+  </defs>
+
+  <g style="fill:none;stroke:lightblue">
+    <use xlink:href="#Rect1"   />
+    <use xlink:href="#Rect2"   />
+    <use xlink:href="#Circle1" />
+    <use xlink:href="#Circle2" />
+  </g>
+  <g style="fill:none;stroke:lightblue;stroke-dasharray:5 5">
+    <use xlink:href="#Rect1x" />
+    <use xlink:href="#Rect2x" style="shape-margin: 20px;" />
+    <use xlink:href="#Circle1x" />
+    <use xlink:href="#Circle2x" />
+  </g>
+
+  <g id="test-body-reference" style="font-size:16px">
+    <text style="text-anchor:middle">
+      <tspan x="74.1"  y="157.3">Lorem</tspan>
+      <tspan x="71"    y="177.3">ipsum</tspan>
+      <tspan x="120"   y="197.3">dolor sit amet,</tspan>
+      <tspan x="120"   y="217.3">consectetur</tspan>
+      <tspan x="360"   y="197.2">adipisicing elit,</tspan>
+      <tspan x="360"   y="217.2">sed do eiusmod</tspan>
+      <tspan x="401.3" y="237.2">tempor </tspan>
+    </text>
+  </g>
+
+</svg>
new file mode 100755
--- /dev/null
+++ b/testing/web-platform/tests/svg/text/reftests/text-complex-001.svg
@@ -0,0 +1,69 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg id="svg-root"
+  width="100%" height="100%" viewBox="0 0 480 360"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <g id="testmeta">
+    <title>Text in Shape — 001</title>
+    <html:link rel="author"
+          title="Tavmjong Bah"
+          href="mailto:tavmjong@free.fr"/>
+    <html:link rel="reviewer"
+          title="NAME_OF_REVIEWER"
+          href="mailto:EMAIL OR http://CONTACT_PAGE" />
+          <!-- YYYY-MM-DD -->
+    <html:link rel="help"
+          href="https://svgwg.org/svg2-draft/text.html#TextShapeInside"/>
+    <html:link rel="match"  href="text-complex-001-ref.svg" />
+    <metadata class="flags">TOKENS</metadata>
+    <desc class="assert">TEST ASSERTION</desc>
+  </g>
+
+  <style id="test-font" type="text/css">
+    /* Standard Font (if needed). */
+    @font-face {
+      font-family: FreeSans;
+      src: url("fonts/FreeSans.woff") format("woff"),
+           local("FreeSans");
+    }
+    text { font-family: FreeSans, sans-serif }
+  </style>
+
+  <style id="test-style" type="text/css">
+    /* Style that is being tested (if needed). */
+    text { font-family: FreeSans, sans-serif }
+  </style>
+
+  <defs>
+    <circle id="Circle1" cx="120" cy="180" r="100"/>
+    <circle id="Circle2" cx="360" cy="240" r="100"/>
+    <rect id="Rect1" x="120" y="80"  width="240" height="80" style="shape-margin: 20px;"/>
+    <rect id="Rect2" x="120" y="260" width="240" height="80" style="shape-margin: 20px;"/>
+    <circle id="Circle1x" cx="120" cy="180" r="80"/>
+    <circle id="Circle2x" cx="360" cy="240" r="80"/>
+    <rect id="Rect1x" x="100" y="60"  width="280" height="120"/>
+    <rect id="Rect2x" x="100" y="240" width="280" height="120"/>
+  </defs>
+
+  <g style="fill:none;stroke:lightblue">
+    <use xlink:href="#Rect1"   />
+    <use xlink:href="#Rect2"   />
+    <use xlink:href="#Circle1" />
+    <use xlink:href="#Circle2" />
+  </g>
+  <g style="fill:none;stroke:lightblue;stroke-dasharray:5 5">
+    <use xlink:href="#Rect1x" />
+    <use xlink:href="#Rect2x" style="shape-margin: 20px;" />
+    <use xlink:href="#Circle1x" />
+    <use xlink:href="#Circle2x" />
+  </g>
+
+  <g id="test-body-content" style="font-size:16px;line-spacing:1.25">
+    <text style="shape-inside:url(#Circle1) url(#Circle2);
+                 shape-subtract:url(#Rect1) url(#Rect2);
+                 shape-padding:20px;
+                 text-align: center;">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</text>
+  </g>
+
+</svg>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/svg/text/reftests/text-complex-002-ref.svg
@@ -0,0 +1,74 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg id="svg-root"
+  width="100%" height="100%" viewBox="0 0 480 360"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <g id="testmeta">
+    <title>Text in Shape — 002</title>
+    <html:link rel="author"
+          title="Tavmjong Bah"
+          href="mailto:tavmjong@free.fr"/>
+    <html:link rel="reviewer"
+          title="NAME_OF_REVIEWER"
+          href="mailto:EMAIL OR http://CONTACT_PAGE" />
+          <!-- YYYY-MM-DD -->
+    <html:link rel="help"
+          href="https://svgwg.org/svg2-draft/text.html#TextShapeInside"/>
+    <metadata class="flags">TOKENS</metadata>
+    <desc class="assert">TEST ASSERTION</desc>
+  </g>
+
+  <style id="test-font" type="text/css">
+    /* Standard Font (if needed). */
+    @font-face {
+      font-family: FreeSans;
+      src: url("fonts/FreeSans.woff") format("woff"),
+           local("FreeSans");
+    }
+    text { font-family: FreeSans, sans-serif }
+  </style>
+
+  <style id="test-style" type="text/css">
+    /* Style that is being tested (if needed). */
+    text { font-family: FreeSans, sans-serif }
+  </style>
+
+  <defs>
+    <circle id="Circle1" cx="360" cy="180" r="100"/>
+    <circle id="Circle2" cx="120" cy="240" r="100"/>
+    <rect id="Rect1" x="120" y="80"  width="240" height="80" style="shape-margin: 20px;"/>
+    <rect id="Rect2" x="120" y="260" width="240" height="80" style="shape-margin: 20px;"/>
+    <circle id="Circle1x" cx="360" cy="180" r="80"/>
+    <circle id="Circle2x" cx="120" cy="240" r="80"/>
+    <rect id="Rect1x" x="100" y="60"  width="280" height="120"/>
+    <rect id="Rect2x" x="100" y="240" width="280" height="120"/>
+  </defs>
+
+  <g style="fill:none;stroke:lightblue">
+    <use xlink:href="#Rect1"   />
+    <use xlink:href="#Rect2"   />
+    <use xlink:href="#Circle1" />
+    <use xlink:href="#Circle2" />
+  </g>
+  <g style="fill:none;stroke:lightblue;stroke-dasharray:5 5">
+    <use xlink:href="#Rect1x" />
+    <use xlink:href="#Rect2x" style="shape-margin: 20px;" />
+    <use xlink:href="#Circle1x" />
+    <use xlink:href="#Circle2x" />
+  </g>
+
+  <g id="test-body-reference" style="font-size:16px;direction:rtl">
+    <text style="text-anchor:middle">
+      <tspan x="398.9" y="137.9">لكن</tspan>
+      <tspan x="406.1" y="158.5">لا بد أن</tspan>
+      <tspan x="408.9" y="179.2">أوضح لك</tspan>
+      <tspan x="360.0" y="199.8">أن كل هذه الأفكار</tspan>
+      <tspan x="360"   y="220.5">المغلوطة حول</tspan>
+      <tspan x="120"   y="197.8">استنكار النشوة</tspan>
+      <tspan x="120"   y="218.5">وتمجيد الألم نشأت</tspan>
+      <tspan x="76.0"  y="239.1">بالفعل،</tspan>
+    </text>
+  </g>
+
+</svg>
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/svg/text/reftests/text-complex-002.svg
@@ -0,0 +1,69 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg id="svg-root"
+  width="100%" height="100%" viewBox="0 0 480 360"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <g id="testmeta">
+    <title>Text in Shape — 002</title>
+    <html:link rel="author"
+          title="Tavmjong Bah"
+          href="mailto:tavmjong@free.fr"/>
+    <html:link rel="reviewer"
+          title="NAME_OF_REVIEWER"
+          href="mailto:EMAIL OR http://CONTACT_PAGE" />
+          <!-- YYYY-MM-DD -->
+    <html:link rel="help"
+          href="https://svgwg.org/svg2-draft/text.html#TextShapeInside"/>
+    <html:link rel="match"  href="text-complex-002-ref.svg" />
+    <metadata class="flags">TOKENS</metadata>
+    <desc class="assert">TEST ASSERTION</desc>
+  </g>
+
+  <style id="test-font" type="text/css">
+    /* Standard Font (if needed). */
+    @font-face {
+      font-family: FreeSans;
+      src: url("fonts/FreeSans.woff") format("woff"),
+           local("FreeSans");
+    }
+    text { font-family: FreeSans, sans-serif }
+  </style>
+
+  <style id="test-style" type="text/css">
+    /* Style that is being tested (if needed). */
+    text { font-family: FreeSans, sans-serif }
+  </style>
+
+  <defs>
+    <circle id="Circle1" cx="360" cy="180" r="100"/>
+    <circle id="Circle2" cx="120" cy="240" r="100"/>
+    <rect id="Rect1" x="120" y="80"  width="240" height="80" style="shape-margin: 20px;"/>
+    <rect id="Rect2" x="120" y="260" width="240" height="80" style="shape-margin: 20px;"/>
+    <circle id="Circle1x" cx="360" cy="180" r="80"/>
+    <circle id="Circle2x" cx="120" cy="240" r="80"/>
+    <rect id="Rect1x" x="100" y="60"  width="280" height="120"/>
+    <rect id="Rect2x" x="100" y="240" width="280" height="120"/>
+  </defs>
+
+  <g style="fill:none;stroke:lightblue">
+    <use xlink:href="#Rect1"   />
+    <use xlink:href="#Rect2"   />
+    <use xlink:href="#Circle1" />
+    <use xlink:href="#Circle2" />
+  </g>
+  <g style="fill:none;stroke:lightblue;stroke-dasharray:5 5">
+    <use xlink:href="#Rect1x" />
+    <use xlink:href="#Rect2x" style="shape-margin: 20px;" />
+    <use xlink:href="#Circle1x" />
+    <use xlink:href="#Circle2x" />
+  </g>
+
+  <g id="test-body-content" style="font-size:16px;line-spacing:1.25;direction:rtl           ">
+    <text style="shape-inside:url(#Circle1) url(#Circle2);
+                 shape-subtract:url(#Rect1) url(#Rect2);
+                 shape-padding:20px;
+                 text-align: center;">لكن لا بد أن أوضح لك أن كل هذه الأفكار المغلوطة حول استنكار  النشوة وتمجيد الألم نشأت بالفعل، وسأعرض لك التفاصيل</text>
+  </g>
+
+</svg>
new file mode 100755
--- /dev/null
+++ b/testing/web-platform/tests/svg/text/reftests/text-shape-inside-001-ref.svg
@@ -0,0 +1,77 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg id="svg-root"
+  width="100%" height="100%" viewBox="0 0 480 360"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <g id="testmeta">
+    <title>Text in Shape — 001</title>
+    <html:link rel="author"
+          title="Tavmjong Bah"
+          href="mailto:tavmjong@free.fr"/>
+    <html:link rel="reviewer"
+          title="NAME_OF_REVIEWER"
+          href="mailto:EMAIL OR http://CONTACT_PAGE" />
+          <!-- YYYY-MM-DD -->
+    <html:link rel="help"
+          href="https://svgwg.org/svg2-draft/text.html#TextShapeInside"/>
+    <metadata class="flags">TOKENS</metadata>
+    <desc class="assert">TEST ASSERTION</desc>
+  </g>
+
+  <style id="test-font" type="text/css">
+    /* Standard Font (if needed). */
+    @font-face {
+      font-family: FreeSans;
+      src: url("fonts/FreeSans.woff") format("woff"),
+           local("FreeSans");
+    }
+    text { font-family: FreeSans, sans-serif }
+  </style>
+
+  <style id="test-style" type="text/css">
+    /* Style that is being tested (if needed). */
+    text { font-family: FreeSans, sans-serif }
+  </style>
+
+  <defs>
+    <rect id="TestRect" x="90" y="100" width="300" height="40"/>
+  </defs>
+
+  <g id="test-body-reference" style="font-size:16px">
+    <g transform="translate(0,0)">
+      <use xlink:href="#TestRect" style="fill:none;stroke:lightblue"/>
+      <text>
+        <tspan x="90" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
+        <tspan x="90" y="134.8">adipisicing elit,</tspan>
+      </text>
+    </g>
+    <g transform="translate(0,60)">
+      <use xlink:href="#TestRect" style="fill:none;stroke:lightblue"/>
+      <text style="text-anchor:middle">
+        <tspan x="240" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
+        <tspan x="240" y="134.8">adipisicing elit,</tspan>
+      </text>
+    </g>
+    <g transform="translate(0,120)">
+      <use xlink:href="#TestRect" style="fill:none;stroke:lightblue"/>
+      <text style="text-anchor:end">
+        <tspan x="390" y="114.8">Lorem ipsum dolor sit amet, consectetur</tspan>
+        <tspan x="390" y="134.8">adipisicing elit,</tspan>
+      </text>
+    </g>
+    <g transform="translate(0,180)">
+      <use xlink:href="#TestRect" style="fill:none;stroke:lightblue"/>
+      <text>
+        <tspan x="90" y="114.8">Lorem</tspan>
+        <tspan x="142.9">ipsum</tspan>
+        <tspan x="193.4">dolor</tspan>
+        <tspan x="236.8">sit</tspan>
+        <tspan x="261.2">amet,</tspan>
+        <tspan x="308.9">consectetur</tspan>
+        <tspan x="90" y="134.8">adipisicing elit,</tspan>
+      </text>
+    </g>
+  </g>
+
+</svg>
new file mode 100755
--- /dev/null
+++ b/testing/web-platform/tests/svg/text/reftests/text-shape-inside-001.svg
@@ -0,0 +1,61 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg id="svg-root"
+  width="100%" height="100%" viewBox="0 0 480 360"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <g id="testmeta">
+    <title>Text in Shape — 001</title>
+    <html:link rel="author"
+          title="Tavmjong Bah"
+          href="mailto:tavmjong@free.fr"/>
+    <html:link rel="reviewer"
+          title="NAME_OF_REVIEWER"
+          href="mailto:EMAIL OR http://CONTACT_PAGE" />
+          <!-- YYYY-MM-DD -->
+    <html:link rel="help"
+          href="https://svgwg.org/svg2-draft/text.html#TextShapeInside"/>
+    <html:link rel="match"  href="text-shape-inside-001-ref.svg" />
+    <metadata class="flags">TOKENS</metadata>
+    <desc class="assert">TEST ASSERTION</desc>
+  </g>
+
+  <style id="test-font" type="text/css">
+    /* Standard Font (if needed). */
+    @font-face {
+      font-family: FreeSans;
+      src: url("fonts/FreeSans.woff") format("woff"),
+           local("FreeSans");
+    }
+    text { font-family: FreeSans, sans-serif }
+  </style>
+
+  <style id="test-style" type="text/css">
+    /* Style that is being tested (if needed). */
+    text { font-family: FreeSans, sans-serif }
+  </style>
+
+  <defs>
+    <rect id="TestRect" x="90" y="100" width="300" height="40"/>
+  </defs>
+
+  <g id="test-body-content" style="font-size:16px;line-spacing:1.25">
+    <g transform="translate(0,0)">
+      <use xlink:href="#TestRect" style="fill:none;stroke:lightblue"/>
+      <text style="shape-inside:url(#TestRect)">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
+    </g>
+    <g transform="translate(0,60)">
+      <use xlink:href="#TestRect" style="fill:none;stroke:lightblue"/>
+      <text style="shape-inside:url(#TestRect);text-align:center">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
+    </g>
+    <g transform="translate(0,120)">
+      <use xlink:href="#TestRect" style="fill:none;stroke:lightblue"/>
+      <text style="shape-inside:url(#TestRect);text-align:right">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
+    </g>
+    <g transform="translate(0,180)">
+      <use xlink:href="#TestRect" style="fill:none;stroke:lightblue"/>
+      <text style="shape-inside:url(#TestRect);text-align:justify">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
+    </g>
+  </g>
+
+</svg>
new file mode 100755
--- /dev/null
+++ b/testing/web-platform/tests/svg/text/reftests/text-shape-inside-002-ref.svg
@@ -0,0 +1,76 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg id="svg-root"
+  width="100%" height="100%" viewBox="0 0 480 360"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <g id="testmeta">
+    <title>Text in Shape — 002</title>
+    <html:link rel="author"
+          title="Tavmjong Bah"
+          href="mailto:tavmjong@free.fr"/>
+    <html:link rel="reviewer"
+          title="NAME_OF_REVIEWER"
+          href="mailto:EMAIL OR http://CONTACT_PAGE" />
+          <!-- YYYY-MM-DD -->
+    <html:link rel="help"
+          href="https://svgwg.org/svg2-draft/text.html#TextShapeInside"/>
+    <metadata class="flags">TOKENS</metadata>
+    <desc class="assert">TEST ASSERTION</desc>
+  </g>
+
+  <style id="test-font" type="text/css">
+    /* Standard Font (if needed). */
+    @font-face {
+      font-family: FreeSans;
+      src: url("fonts/FreeSans.woff") format("woff"),
+           local("FreeSans");
+    }
+    text { font-family: FreeSans, sans-serif }
+  </style>
+
+  <style id="test-style" type="text/css">
+    /* Style that is being tested (if needed). */
+    text { font-family: FreeSans, sans-serif }
+  </style>
+
+  <defs>
+    <rect id="TestRect" x="90" y="100" width="60" height="200"/>
+  </defs>
+
+  <g id="test-body-reference" style="font-size:16px">
+    <g transform="translate(0,0)">
+      <use xlink:href="#TestRect" style="fill:none;stroke:lightblue"/>
+      <text transform="translate(250,10) rotate(90)">
+        <tspan x="90" y="114.8">Lorem ipsum dolor sit amet,</tspan>
+        <tspan x="90" y="134.8">consectetur adipisicing elit,</tspan>
+      </text>
+    </g>
+    <g transform="translate(80,0)">
+      <use xlink:href="#TestRect" style="fill:none;stroke:lightblue"/>
+      <text transform="translate(250,-40) rotate(90)" style="text-anchor:middle">
+        <tspan x="240" y="114.8">Lorem ipsum dolor sit amet,</tspan>
+        <tspan x="240" y="134.8">consectetur adipisicing elit,</tspan>
+      </text>
+    </g>
+    <g transform="translate(160,0)">
+      <use xlink:href="#TestRect" style="fill:none;stroke:lightblue"/>
+      <text transform="translate(250,-90) rotate(90)" style="text-anchor:end">
+        <tspan x="390" y="114.8">Lorem ipsum dolor sit amet,</tspan>
+        <tspan x="390" y="134.8">consectetur adipisicing elit,</tspan>
+      </text>
+    </g>
+    <g transform="translate(240,0)">
+      <use xlink:href="#TestRect" style="fill:none;stroke:lightblue"/>
+      <text transform="translate(250,-150) rotate(90)">
+        <tspan x="250" y="114.8">Lorem</tspan>
+        <tspan x="300.3">ipsum</tspan>
+        <tspan x="348.2">dolor</tspan>
+        <tspan x="389">sit</tspan>
+        <tspan x="410.9">amet,</tspan>
+        <tspan x="250" y="134.8">consectetur adipisicing elit,</tspan>
+      </text>
+    </g>
+  </g>
+
+</svg>
new file mode 100755
--- /dev/null
+++ b/testing/web-platform/tests/svg/text/reftests/text-shape-inside-002.svg
@@ -0,0 +1,61 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg id="svg-root"
+  width="100%" height="100%" viewBox="0 0 480 360"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:xlink="http://www.w3.org/1999/xlink"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <g id="testmeta">
+    <title>Text in Shape — 002</title>
+    <html:link rel="author"
+          title="Tavmjong Bah"
+          href="mailto:tavmjong@free.fr"/>
+    <html:link rel="reviewer"
+          title="NAME_OF_REVIEWER"
+          href="mailto:EMAIL OR http://CONTACT_PAGE" />
+          <!-- YYYY-MM-DD -->
+    <html:link rel="help"
+          href="https://svgwg.org/svg2-draft/text.html#TextShapeInside"/>
+    <html:link rel="match"  href="text-shape-inside-002-ref.svg" />
+    <metadata class="flags">TOKENS</metadata>
+    <desc class="assert">TEST ASSERTION</desc>
+  </g>
+
+  <style id="test-font" type="text/css">
+    /* Standard Font (if needed). */
+    @font-face {
+      font-family: FreeSans;
+      src: url("fonts/FreeSans.woff") format("woff"),
+           local("FreeSans");
+    }
+    text { font-family: FreeSans, sans-serif }
+  </style>
+
+  <style id="test-style" type="text/css">
+    /* Style that is being tested (if needed). */
+    text { font-family: FreeSans, sans-serif }
+  </style>
+
+  <defs>
+    <rect id="TestRect" x="90" y="100" width="60" height="200"/>
+  </defs>
+
+  <g id="test-body-content" style="font-size:16px;line-spacing:1.25;writing-mode:tb-rl">
+    <g transform="translate(0,0)">
+      <use xlink:href="#TestRect" style="fill:none;stroke:lightblue"/>
+      <text style="shape-inside:url(#TestRect)">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
+    </g>
+    <g transform="translate(80,0)">
+      <use xlink:href="#TestRect" style="fill:none;stroke:lightblue"/>
+      <text style="shape-inside:url(#TestRect);text-align:center">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
+    </g>
+    <g transform="translate(160,0)">
+      <use xlink:href="#TestRect" style="fill:none;stroke:lightblue"/>
+      <text style="shape-inside:url(#TestRect);text-align:right">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
+    </g>
+    <g transform="translate(240,0)">
+      <use xlink:href="#TestRect" style="fill:none;stroke:lightblue"/>
+      <text style="shape-inside:url(#TestRect);text-align:justify">Lorem ipsum dolor sit amet, consectetur adipisicing elit,</text>
+    </g>
+  </g>
+
+</svg>