diff options
Diffstat (limited to 'testing/web-platform/tests/svg/embedded')
11 files changed, 177 insertions, 0 deletions
diff --git a/testing/web-platform/tests/svg/embedded/image-crossorigin.sub.html b/testing/web-platform/tests/svg/embedded/image-crossorigin.sub.html new file mode 100644 index 0000000000..531512ec16 --- /dev/null +++ b/testing/web-platform/tests/svg/embedded/image-crossorigin.sub.html @@ -0,0 +1,69 @@ +<!DOCTYPE HTML> +<html> +<title>Test Crossorigin</title> +<link rel="help" href="https://www.w3.org/TR/SVG/embedded.html#ImageElementCrossoriginAttribute"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> + +<script class="testbody" type="text/javascript"> + + function draw_and_read_image(image, should_throw) { + let c = document.createElement('canvas'); + document.body.appendChild(c); + let ctx = c.getContext('2d'); + ctx.drawImage(image, 0, 0); + + function get_image_data() { + ctx.getImageData(0, 0, 4, 4); + } + + if (should_throw) { + assert_throws_dom('SecurityError', get_image_data); + } else { + get_image_data(); + } + + document.body.removeChild(c); + } + + async_test(t => { + let image = document.createElementNS("http://www.w3.org/2000/svg", "image"); + image.setAttribute("href", "/images/green.png"); + image.crossOrigin = "anonymous"; + image.onload = t.step_func_done(() => { + draw_and_read_image(image, false); + }); + image.onerror = t.unreached_func(); + }, "Can get pixels of canvas with same origin image drawn"); + + async_test(t => { + let image = document.createElementNS("http://www.w3.org/2000/svg", "image"); + image.setAttribute("href", "http://{{hosts[][www]}}:{{ports[http][0]}}/images/green.png?pipe=header(Access-Control-Allow-Origin,*)"); + image.crossOrigin = "anonymous"; + image.onload = t.step_func_done(() => { + draw_and_read_image(image, false); + }); + image.onerror = t.unreached_func(); + }, "Can get pixels of canvas with CORS enabled cross origin image drawn"); + + async_test(t => { + let image = document.createElementNS("http://www.w3.org/2000/svg", "image"); + image.setAttribute("href", "http://{{hosts[][www]}}:{{ports[http][0]}}/images/green.png?pipe=header(Access-Control-Allow-Origin,*)"); + image.onload = t.step_func_done(() => { + draw_and_read_image(image, true); + }); + image.onerror = t.unreached_func(); + }, "Can't get pixels of canvas with CORS enabled cross origin image drawn from non-CORS element"); + + async_test(t => { + let image = document.createElementNS("http://www.w3.org/2000/svg", "image"); + image.setAttribute("href", "http://{{hosts[][www]}}:{{ports[http][0]}}/images/green.png"); + + image.onload = t.step_func_done(() => { + draw_and_read_image(image, true); + }); + image.onerror = t.unreached_func(); + }, "Can't get pixels of canvas with non-CORS enabled cross origin image drawn"); + +</script> +</html> diff --git a/testing/web-platform/tests/svg/embedded/image-embedding-svg-nested-svg-in-foreignobject.html b/testing/web-platform/tests/svg/embedded/image-embedding-svg-nested-svg-in-foreignobject.html new file mode 100644 index 0000000000..880305253c --- /dev/null +++ b/testing/web-platform/tests/svg/embedded/image-embedding-svg-nested-svg-in-foreignobject.html @@ -0,0 +1,16 @@ +<!doctype html> +<title>Only synthesize a 'viewBox' for the outermost SVG root in image contexts</title> +<link rel="help" href="https://crbug.com/1313530"> +<link rel="match" href="../struct/reftests/reference/green-100x100.html"> +<img width="100" height="100" src="data:image/svg+xml, + <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200' width='100' id='svg'> + <rect width='200' height='200' fill='red'/> + <foreignObject width='200' height='200'> + <div xmlns='http://www.w3.org/1999/xhtml' style='height: 100px; width: 100px'> + <svg xmlns='http://www.w3.org/2000/svg' style='width: 100%; height: 100%; overflow: visible' width='200' height='200'> + <rect width='200' height='200' fill='green'/> + </svg> + </div> + </foreignObject> + </svg> +"> diff --git a/testing/web-platform/tests/svg/embedded/image-embedding-svg-viewref-with-viewbox.svg b/testing/web-platform/tests/svg/embedded/image-embedding-svg-viewref-with-viewbox.svg new file mode 100644 index 0000000000..6340c19d2a --- /dev/null +++ b/testing/web-platform/tests/svg/embedded/image-embedding-svg-viewref-with-viewbox.svg @@ -0,0 +1,14 @@ +<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:h="http://www.w3.org/1999/xhtml"> + <title><image> referencing SVG image with <view> with 'viewBox'</title> + <h:link rel="help" href="https://svgwg.org/svg2-draft/embedded.html#ImageElement"/> + <h:link rel="help" href="https://svgwg.org/svg2-draft/linking.html#LinksIntoSVG"/> + <h:link rel="match" href="reference/green-rect-100x100.svg"/> + <rect x="-355" y="-1110" width="455" height="1210" fill="red"/> + <image preserveAspectRatio="none" x="-355" y="-1110" width="455" height="1210" + xlink:href="data:image/svg+xml, + %3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2317 2320'%3e + %3cview id='view' preserveAspectRatio='none' viewBox='0 0 455 1210'/%3e + %3crect width='455' height='1210' fill='green'/%3e + %3c/svg%3e#view"/> +</svg> diff --git a/testing/web-platform/tests/svg/embedded/image-embedding-svg-with-auto-height.svg b/testing/web-platform/tests/svg/embedded/image-embedding-svg-with-auto-height.svg new file mode 100644 index 0000000000..45ebb57376 --- /dev/null +++ b/testing/web-platform/tests/svg/embedded/image-embedding-svg-with-auto-height.svg @@ -0,0 +1,8 @@ +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:h="http://www.w3.org/1999/xhtml" viewBox="0 0 3 3" width="200" height="200"> + <metadata> + <title><image> embedding SVG image with auto height</title> + <h:link rel="match" href="reference/green-rect-100x100.svg"/> + </metadata> + <image href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='50' height='50' ><rect width='50' height='50' fill='green'/></svg>" width="1.5"/> +</svg> diff --git a/testing/web-platform/tests/svg/embedded/image-embedding-svg-with-fractional-viewbox.svg b/testing/web-platform/tests/svg/embedded/image-embedding-svg-with-fractional-viewbox.svg new file mode 100644 index 0000000000..6e37c7b7b6 --- /dev/null +++ b/testing/web-platform/tests/svg/embedded/image-embedding-svg-with-fractional-viewbox.svg @@ -0,0 +1,11 @@ +<svg xmlns="http://www.w3.org/2000/svg" xmlns:h="http://www.w3.org/1999/xhtml"> + <title><image> embedding SVG image with fractional viewBox</title> + <h:link rel="help" href="https://crbug.com/1123047"/> + <h:link rel="match" href="reference/green-rect-100x100.svg"/> + + <rect width="100" height="100" fill="red"/> + <svg viewBox="0 0 200 150" width="100" height="100" preserveAspectRatio="none"> + <image preserveAspectRatio="none" y="-150" width="200" height="300" + href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1683.78 1190.55'><rect width='1696' height='1199' fill='green'/></svg>"/> + </svg> +</svg> diff --git a/testing/web-platform/tests/svg/embedded/image-embedding-svg-with-near-integral-width-ref.html b/testing/web-platform/tests/svg/embedded/image-embedding-svg-with-near-integral-width-ref.html new file mode 100644 index 0000000000..655d982b16 --- /dev/null +++ b/testing/web-platform/tests/svg/embedded/image-embedding-svg-with-near-integral-width-ref.html @@ -0,0 +1,7 @@ +<!doctype html> +<title>Rendering of an <img> embedding an SVG with a near-integral width (reference)</title> +<img src="data:image/svg+xml, + <svg xmlns='http://www.w3.org/2000/svg' width='100' height='100'> + <rect width='100%' height='100%' fill='green'/> + </svg> +" style="left: 7.5px; top: 8px; position: absolute"> diff --git a/testing/web-platform/tests/svg/embedded/image-embedding-svg-with-near-integral-width.html b/testing/web-platform/tests/svg/embedded/image-embedding-svg-with-near-integral-width.html new file mode 100644 index 0000000000..8f3ecab441 --- /dev/null +++ b/testing/web-platform/tests/svg/embedded/image-embedding-svg-with-near-integral-width.html @@ -0,0 +1,14 @@ +<!doctype html> +<title>Rendering of an <img> embedding an SVG with a near-integral width</title> +<link rel="help" href="https://crbug.com/1392140"> +<link rel="match" href="image-embedding-svg-with-near-integral-width-ref.html"> +<img src="data:image/svg+xml, + <svg xmlns='http://www.w3.org/2000/svg' width='100' height='100'> + <rect width='100%' height='100%' fill='red'/> + </svg> +" style="left: 7.5px; top: 8px; position: absolute"> +<img src="data:image/svg+xml, + <svg xmlns='http://www.w3.org/2000/svg' width='99.99999' height='100'> + <rect width='100%' height='100%' fill='green'/> + </svg> +" style="left: 7.5px; top: 8px; position: absolute"> diff --git a/testing/web-platform/tests/svg/embedded/image-embedding-svg-with-viewport-units-inline-style.svg b/testing/web-platform/tests/svg/embedded/image-embedding-svg-with-viewport-units-inline-style.svg new file mode 100644 index 0000000000..7ef2655dc9 --- /dev/null +++ b/testing/web-platform/tests/svg/embedded/image-embedding-svg-with-viewport-units-inline-style.svg @@ -0,0 +1,10 @@ +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:h="http://www.w3.org/1999/xhtml"> + <metadata> + <title><image> embedding SVG image with viewport units</title> + <h:link rel="match" href="reference/green-rect-100x100.svg"/> + </metadata> + <image xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><rect style='width: 50vw; height: 50vh' fill='green'/></svg>" + width="200" height="200"/> +</svg> diff --git a/testing/web-platform/tests/svg/embedded/image-embedding-svg-with-viewport-units.svg b/testing/web-platform/tests/svg/embedded/image-embedding-svg-with-viewport-units.svg new file mode 100644 index 0000000000..653856de21 --- /dev/null +++ b/testing/web-platform/tests/svg/embedded/image-embedding-svg-with-viewport-units.svg @@ -0,0 +1,10 @@ +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + xmlns:h="http://www.w3.org/1999/xhtml"> + <metadata> + <title><image> embedding SVG image with viewport units</title> + <h:link rel="match" href="reference/green-rect-100x100.svg"/> + </metadata> + <image xlink:href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><rect width='50vw' height='50vh' fill='green'/></svg>" + width="200" height="200"/> +</svg> diff --git a/testing/web-platform/tests/svg/embedded/image-fractional-width-vertical-fidelity.svg b/testing/web-platform/tests/svg/embedded/image-fractional-width-vertical-fidelity.svg new file mode 100644 index 0000000000..4409ee32a9 --- /dev/null +++ b/testing/web-platform/tests/svg/embedded/image-fractional-width-vertical-fidelity.svg @@ -0,0 +1,15 @@ +<svg xmlns="http://www.w3.org/2000/svg" xmlns:h="http://www.w3.org/1999/xhtml"> + <title>Vertical fidelity of <image> element with fractional width</title> + <h:link rel="help" href="https://svgwg.org/svg2-draft/embedded.html#ImageElement"/> + <h:link rel="match" href="reference/green-rect-100x100.svg"/> + <rect x="95" width="5" height="100" fill="green"/> + <rect width="95" height="100" fill="red"/> + <g clip-path="url(#c)"> + <clipPath id="c"> + <rect width="95" height="100"/> + </clipPath> + <image href="data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='xMinYMin'%3e + %3crect width='100' height='100' fill='green'/%3e%3c/svg%3e" + width="101.2" height="100"/> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/embedded/reference/green-rect-100x100.svg b/testing/web-platform/tests/svg/embedded/reference/green-rect-100x100.svg new file mode 100644 index 0000000000..120941444a --- /dev/null +++ b/testing/web-platform/tests/svg/embedded/reference/green-rect-100x100.svg @@ -0,0 +1,3 @@ +<svg xmlns="http://www.w3.org/2000/svg"> + <rect width="100" height="100" fill="green"/> +</svg> |
