[SVG] Transform animation leaves traces of text behind.

LayoutTests/svg/text/non-invertible-matrix-text.svg

Index: LayoutTests/svg/text/non-invertible-matrix-text.svg
diff --git a/LayoutTests/svg/text/non-invertible-matrix-text.svg b/LayoutTests/svg/text/non-invertible-matrix-text.svg
new file mode 100644
index 0000000000000000000000000000000000000000..86cc517245a6d1f454a70318d6a1fc104250a52d
--- /dev/null
+++ b/LayoutTests/svg/text/non-invertible-matrix-text.svg
@@ -0,0 +1,16 @@
+<svg width="620" height="450" viewBox="0 0 800 600" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" onload="runTest()">
+	<script>
+	<![CDATA[
+		function runTest() {
+			document.getElementById('first').setAttribute("transform", "translate(241.0859375, -21)scale(0, 1)translate(-241.0859375, 21)");

[Stephen Chennney, 2014/03/19 12:11:05]

Is there anything special about the 241.0859375 value? If not, please just use
200 or something that doesn't imply it's special.

[Erik Dahlström (inactive), 2014/03/19 14:00:10]

This came from script-generated content, the translate-position is/was the
midpoint on the glyph. It has some relevance, but the decimalpoints might be
possible to remove if you want.

The important thing is to get the glyph to span across two tiles, because that's
when the leftovers become visible. The tiles right now are ~255px wide.

+			document.getElementById('second').setAttribute("transform", "translate(241.0859375, -21)scale(0, 1)translate(-241.0859375, 21)");
+		}
+	]]>
+	</script>
+
+	<g id="textGroup" transform="translate(70,300)" font-family="sans-serif" font-size="60" text-rendering="geometricPrecision">
+		<rect x="254" width="1" height="1"/>
+		<text id="first" x="197.7978515625" y="0" fill="red">s</text>
+		<text id="second" x="229.0576171875" y="0" fill="red">!</text>
+    </g>
+</svg>