Bug 1969782 - Account for the aToMarkedFrameUserSpace transform when setting up contextPaint for an SVG marker. r=longsonr

jfkthame · jfkthame · commit 78bcff6db846 · 2025-06-01T21:50:00.000Z
This makes the context-fill gradient used in the marker match how it's painted in the context, regardless of the zoom or other transforms present. (This also matches the rendering I see in Chrome.) Includes a test that fails without the patch. Differential Revision: https://phabricator.services.mozilla.com/D252021
diff --git a/layout/svg/SVGMarkerFrame.cpp b/layout/svg/SVGMarkerFrame.cpp
@@ -135,7 +135,8 @@ void SVGMarkerFrame::PaintMark(gfxContext& aContext,
   // The CTM of each frame referencing us may be different.
   SVGFrame->NotifySVGChanged(ISVGDisplayableFrame::TRANSFORM_CHANGED);
   auto contextPaint = MakeRefPtr<SVGContextPaintImpl>();
-  contextPaint->Init(aContext.GetDrawTarget(), aContext.CurrentMatrixDouble(),
+  contextPaint->Init(aContext.GetDrawTarget(),
+                     aToMarkedFrameUserSpace * aContext.CurrentMatrixDouble(),
                      aMarkedFrame, SVGContextPaint::GetContextPaint(marker),
                      aImgParams);
   AutoSetRestoreSVGContextPaint autoSetRestore(contextPaint,
diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-context-fill-transform-ref.html b/testing/web-platform/tests/svg/painting/reftests/marker-context-fill-transform-ref.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+
+<style>
+iframe {
+  display: block;
+  border: none;
+}
+</style>
+
+<p>None of the marker rects should be visible as disruptions in the gradient, regardless of transforms:</p>
+<iframe width=300 height=150 src='support/svg-marker-ref.svg'></iframe>
+<iframe width=300 height=150 src='support/svg-marker-ref.svg'></iframe>
+<iframe width=300 height=150 src='support/svg-marker-ref.svg'></iframe>
diff --git a/testing/web-platform/tests/svg/painting/reftests/marker-context-fill-transform.html b/testing/web-platform/tests/svg/painting/reftests/marker-context-fill-transform.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+
+<title>SVG rendering test: context-fill in markers with transform</title>
+
+<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1969782">
+<link rel="match" href="marker-context-fill-transform-ref.html">
+
+<style>
+iframe {
+  display: block;
+  border: none;
+}
+#a {
+  zoom: 1;
+}
+#b {
+  zoom: 2;
+}
+#c {
+  zoom: 0.25;
+}
+</style>
+
+<p>None of the marker rects should be visible as disruptions in the gradient, regardless of transforms:</p>
+<iframe id=a width=300 height=150 src='support/svg-marker-context-paint.svg'></iframe>
+<iframe id=b width=150 height=75 src='support/svg-marker-context-paint.svg'></iframe>
+<iframe id=c width=1200 height=600 src='support/svg-marker-context-paint.svg'></iframe>
diff --git a/testing/web-platform/tests/svg/painting/reftests/support/svg-marker-context-paint.svg b/testing/web-platform/tests/svg/painting/reftests/support/svg-marker-context-paint.svg
@@ -0,0 +1,29 @@
+<svg id="svg-root" viewBox="0 0 1600 900"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <defs>
+    <linearGradient id="lg">
+      <stop offset="0" stop-color="red"/>
+      <stop offset="1" stop-color="blue"/>
+    </linearGradient>
+
+    <!--
+      This marker will render two rectangles, both within the filled area
+      of the path we're using, so they should be indistinguishable from it.
+      -->
+    <marker id="marker" refX="-10" refY="-10" markerWidth="600" markerHeight="400" >
+      <rect y="0" width="200" height="100" fill="context-fill"/>
+      <rect x="250" y="270" width="300" height="100" fill="context-fill"/>
+    </marker>
+  </defs>
+
+  <path fill="url(#lg)" d="M 10 10 h 600 v 400 h -600 Z" marker-start="url(#marker)"/>
+
+  <g transform="translate(300 450) scale(0.75 0.5) rotate(60)">
+    <path fill="url(#lg)" d="M 10 10 h 600 v 400 h -600 Z" marker-start="url(#marker)"/>
+  </g>
+
+  <g transform="translate(600 450) scale(1.5 0.5) rotate(-30)">
+    <path fill="url(#lg)" d="M 10 10 h 600 v 400 h -600 Z" marker-start="url(#marker)"/>
+  </g>
+</svg>
diff --git a/testing/web-platform/tests/svg/painting/reftests/support/svg-marker-ref.svg b/testing/web-platform/tests/svg/painting/reftests/support/svg-marker-ref.svg
@@ -0,0 +1,20 @@
+<svg id="svg-root" viewBox="0 0 1600 900"
+  xmlns="http://www.w3.org/2000/svg"
+  xmlns:html="http://www.w3.org/1999/xhtml">
+  <defs>
+    <linearGradient id="lg">
+      <stop offset="0" stop-color="red"/>
+      <stop offset="1" stop-color="blue"/>
+    </linearGradient>
+  </defs>
+
+  <path fill="url(#lg)" d="M 10 10 h 600 v 400 h -600 Z"/>
+
+  <g transform="translate(300 450) scale(0.75 0.5) rotate(60)">
+    <path fill="url(#lg)" d="M 10 10 h 600 v 400 h -600 Z"/>
+  </g>
+
+  <g transform="translate(600 450) scale(1.5 0.5) rotate(-30)">
+    <path fill="url(#lg)" d="M 10 10 h 600 v 400 h -600 Z"/>
+  </g>
+</svg>
