1 files changed, 38 insertions, 0 deletions
diff --git a/testing/web-platform/tests/html/canvas/element/layers/2d.layer.blur-from-outside-canvas.with-clipping-expected.html b/testing/web-platform/tests/html/canvas/element/layers/2d.layer.blur-from-outside-canvas.with-clipping-expected.html
new file mode 100644
index 0000000000..1823f78983
--- /dev/null
+++ b/testing/web-platform/tests/html/canvas/element/layers/2d.layer.blur-from-outside-canvas.with-clipping-expected.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
+<title>Canvas test: 2d.layer.blur-from-outside-canvas.with-clipping</title>
+<h1>2d.layer.blur-from-outside-canvas.with-clipping</h1>
+<p class="desc">Checks blur leaking inside from drawing outside the canvas</p>
+<canvas id="canvas" width="200" height="200">
+  <p class="fallback">FAIL (fallback content)</p>
+</canvas>
+<script>
+  const canvas = document.getElementById("canvas");
+  const ctx = canvas.getContext('2d');
+
+  const svg = `
+  <svg xmlns="http://www.w3.org/2000/svg"
+        width="200" height="200"
+        color-interpolation-filters="sRGB">
+    <filter id="filter" x="-100%" y="-100%" width="300%" height="300%">
+      <feGaussianBlur in="SourceGraphic" stdDeviation="30" />
+    </filter>
+    <g filter="url(#filter)">
+      <rect x="201" y="50" width="100" height="100" fill="turquoise"/>
+      <rect x="50" y="201" width="100" height="100" fill="indigo"/>
+      <rect x="-101" y="50" width="100" height="100" fill="orange"/>
+      <rect x="50" y="-101" width="100" height="100" fill="brown"/>
+    </g>
+  </svg>`;
+  const img = new Image();
+  img.width = 200;
+  img.height = 200;
+  img.onload = () => {
+      const clipRegion = new Path2D();
+      clipRegion.rect(20, 20, 160, 160);
+      ctx.clip(clipRegion);
+
+      ctx.drawImage(img, 0, 0);
+  };
+  img.src = 'data:image/svg+xml;base64,' + btoa(svg);
+</script>