1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/layout/reftests/svg/dynamic-pattern-01.svg Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,115 @@
1.4 +<!--
1.5 + Any copyright is dedicated to the Public Domain.
1.6 + http://creativecommons.org/publicdomain/zero/1.0/
1.7 +-->
1.8 +<svg xmlns="http://www.w3.org/2000/svg" version="1.1" class="reftest-wait"
1.9 + xmlns:xlink="http://www.w3.org/1999/xlink" onload="startTest()">
1.10 + <title>Testing that dynamic changes to the element for a given ID are reflected in patterns</title>
1.11 +
1.12 + <rect id="u1" x="10%" width="11%" height="100%" fill="url(#r1)"/>
1.13 + <script>
1.14 + // force frame construction; test that parsing "r1" after frame construction
1.15 + // is still bound to "u1" eventually
1.16 + var rect = document.getElementById("u1").getBoundingClientRect();
1.17 + </script>
1.18 + <pattern id="r1" width="100%" height="100%" patternUnits="userSpaceOnUse">
1.19 + <rect width="100%" height="100%" fill="lime"/>
1.20 + </pattern>
1.21 +
1.22 + <pattern id="x" width="100%" height="100%" patternUnits="userSpaceOnUse">
1.23 + <rect width="100%" height="100%" fill="lime"/>
1.24 + </pattern>
1.25 + <rect id="u2" x="20%" width="11%" height="100%" fill="url(#r2)"/>
1.26 +
1.27 + <pattern id="r3" width="100%" height="100%" patternUnits="userSpaceOnUse">
1.28 + <rect width="100%" height="100%" fill="red"/>
1.29 + </pattern>
1.30 + <pattern id="r3" width="100%" height="100%" patternUnits="userSpaceOnUse">
1.31 + <rect width="100%" height="100%" fill="lime"/>
1.32 + </pattern>
1.33 + <rect id="u3" x="30%" width="11%" height="100%" fill="url(#r3)"/>
1.34 +
1.35 + <pattern id="r4" width="100%" height="100%" patternUnits="userSpaceOnUse">
1.36 + <rect width="100%" height="100%" fill="red"/>
1.37 + </pattern>
1.38 + <pattern id="r4" width="100%" height="100%" patternUnits="userSpaceOnUse">
1.39 + <rect width="100%" height="100%" fill="lime"/>
1.40 + </pattern>
1.41 + <rect id="u4" x="40%" width="11%" height="100%" fill="url(#r4)"/>
1.42 +
1.43 + <pattern id="r5" width="100%" height="100%" patternUnits="userSpaceOnUse">
1.44 + <rect width="100%" height="100%" fill="red"/>
1.45 + </pattern>
1.46 + <rect id="u5" x="50%" width="11%" height="100%" fill="url(#r5)"/>
1.47 +
1.48 + <pattern id="r6" width="100%" height="100%" patternUnits="userSpaceOnUse">
1.49 + <rect width="100%" height="100%" fill="red"/>
1.50 + </pattern>
1.51 + <pattern id="r6-2" width="100%" height="100%" patternUnits="userSpaceOnUse">
1.52 + <rect width="100%" height="100%" fill="lime"/>
1.53 + </pattern>
1.54 + <rect id="u6" x="60%" width="11%" height="100%" fill="url(#r6)"/>
1.55 +
1.56 + <pattern id="r7" width="100%" height="100%" patternUnits="userSpaceOnUse">
1.57 + <rect width="100%" height="100%" fill="lime"/>
1.58 + </pattern>
1.59 + <pattern id="r7-2" width="100%" height="100%" patternUnits="userSpaceOnUse">
1.60 + <rect width="100%" height="100%" fill="red"/>
1.61 + </pattern>
1.62 + <rect id="u7" x="70%" width="11%" height="100%" fill="url(#r7)"/>
1.63 +
1.64 + <pattern id="r8-2" width="100%" height="100%" patternUnits="userSpaceOnUse">
1.65 + <rect width="100%" height="100%" fill="lime"/>
1.66 + </pattern>
1.67 + <pattern id="r8" width="100%" height="100%" patternUnits="userSpaceOnUse">
1.68 + <rect width="100%" height="100%" fill="red"/>
1.69 + </pattern>
1.70 + <rect id="u8" x="80%" width="11%" height="100%" fill="url(#r8)"/>
1.71 +
1.72 + <rect width="11%" height="100%" fill="lime"/>
1.73 + <rect x="90%" width="11%" height="100%" fill="lime"/>
1.74 +
1.75 + <script>
1.76 + function startTest() {
1.77 + document.addEventListener("MozReftestInvalidate", doTest, false);
1.78 + setTimeout(doTest, 4000); // fallback for running outside reftest
1.79 + }
1.80 +
1.81 + function doTest() {
1.82 + // check that changing an id to "r2" lets u2 find it
1.83 + var r2 = document.getElementById("x");
1.84 + r2.setAttribute("id", "r2");
1.85 +
1.86 + var rect = document.getElementById("u3").getBoundingClientRect();
1.87 + // check that removing the bad r3 lets u3 find the good one
1.88 + var r3 = document.getElementById("r3");
1.89 + r3.parentNode.removeChild(r3);
1.90 +
1.91 + // check that renaming the bad r4 lets u4 find the good one
1.92 + var r4 = document.getElementById("r4");
1.93 + r4.removeAttribute("id");
1.94 +
1.95 + // check that changing u5's reference works
1.96 + var u5 = document.getElementById("u5");
1.97 + u5.setAttribute("fill", "url(#r1)");
1.98 +
1.99 + // check that inserting a good element before the bad r6 works
1.100 + var r6 = document.getElementById("r6-2");
1.101 + r6.parentNode.removeChild(r6);
1.102 + r6.setAttribute("id", "r6");
1.103 + document.documentElement.insertBefore(r6, document.documentElement.firstChild);
1.104 +
1.105 + // check that inserting a bad element after a good one doesn't break anything
1.106 + var r7 = document.getElementById("r7-2");
1.107 + r7.parentNode.removeChild(r7);
1.108 + r7.setAttribute("id", "r7");
1.109 + document.documentElement.appendChild(r7);
1.110 +
1.111 + // check that renaming a good element to r8 works
1.112 + var r8 = document.getElementById("r8-2");
1.113 + r8.setAttribute("id", "r8");
1.114 +
1.115 + document.documentElement.removeAttribute("class");
1.116 + }
1.117 + </script>
1.118 +</svg>
