svg-image-taint-canvas.html | Explore in Territory

<!DOCTYPE HTML>
<html>
<head>
  <script src="../../../resources/testharness.js"></script>
  <script src="../../../resources/testharnessreport.js"></script>
</head>
<body>
  <svg style="display: block; width: 0; height: 0">
    <defs>
      <filter id="clean-image">
        <feImage href="../resources/square.png" />
      </filter>

      <circle id="circle" r="100" fill="blue" />
      <filter id="reference-image">
        <feImage href="#circle" />
      </filter>

      <filter id="x-origin-image">
        <feImage href="http://localhost:8000/resources/square.png" />
      </filter>

    </defs>
  </svg>
  <script>

    async_test((t) => {
      var xOriginImage = new Image();
      // Use a cross-origin URL.
      xOriginImage.src = "http://localhost:8000/resources/square.png";

      xOriginImage.onload = function() {
        var cleanCanvas = document.createElement("canvas");
        var cleanContext = cleanCanvas.getContext("2d");
        cleanContext.filter = "url(#clean-image)";
        cleanContext.fillRect(0, 0, 100, 100);
        assert_equals(cleanContext.getImageData(0, 0, 1, 1).data[0], 0,
          "Local feImage should not taint canvas");

        var referenceCanvas = document.createElement("canvas");
        var referenceContext = referenceCanvas.getContext("2d");
        referenceContext.filter = "url(#reference-image)";
        referenceContext.fillRect(0, 0, 100, 100);
        assert_throws_dom("SecurityError", () => {
          referenceContext.getImageData(0, 0, 1, 1)
        }, "feImage element with a reference should taint the canvas");

        var xOriginCanvas = document.createElement("canvas");
        var xOriginContext = xOriginCanvas.getContext("2d");
        xOriginContext.filter = "url(#x-origin-image)";
        xOriginContext.fillRect(0, 0, 100, 100);
        assert_throws_dom("SecurityError", () => {
          xOriginContext.getImageData(0, 0, 1, 1)
        }, "feImage element with a cross-origin reference should taint the \
        canvas");

        t.done();
      };
    });
  </script>
</body>
</html>
chromium/third_party/blink/web_tests/http/tests/canvas/svg-image-taint-canvas.html
