| <!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("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("SecurityError", () => { |
| xOriginContext.getImageData(0, 0, 1, 1) |
| }, "feImage element with a cross-origin reference should taint the \ |
| canvas"); |
| |
| t.done(); |
| }; |
| }); |
| </script> |
| </body> |
| </html> |
