diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
| commit | 43a97878ce14b72f0981164f87f2e35e14151312 (patch) | |
| tree | 620249daf56c0258faa40cbdcf9cfba06de2a846 /testing/web-platform/tests/svg/linking/reftests | |
| parent | Initial commit. (diff) | |
| download | firefox-upstream.tar.xz firefox-upstream.zip | |
Adding upstream version 110.0.1.upstream/110.0.1upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/svg/linking/reftests')
31 files changed, 596 insertions, 0 deletions
diff --git a/testing/web-platform/tests/svg/linking/reftests/href-a-element-attr-change.html b/testing/web-platform/tests/svg/linking/reftests/href-a-element-attr-change.html new file mode 100644 index 0000000000..c74b2e0156 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-a-element-attr-change.html @@ -0,0 +1,29 @@ +<!DOCTYPE html> +<html class="reftest-wait"> +<meta charset="utf-8"> +<title>href - a element</title> +<meta name="assert" + content="The a element should keep its link status after removing href if there is still xlink:href"> +<link rel="match" href="href-a-element-ref.html"> +<style> +a:link rect { + fill: lime; +} +</style> +<body> + <svg width="100" height="100" viewBox="0 0 100 100" + xmlns:xlink="http://www.w3.org/1999/xlink" onload="loaded();"> + <a id="link" href="abc.html" xlink:href="def.html"> + <rect width="100%" height="100%" fill="red"/> + </a> + </svg> +</body> +<script> + function loaded() { + document.getElementById('link').removeAttribute('href'); + requestAnimationFrame(function() { + document.documentElement.classList.remove("reftest-wait"); + }); + } +</script> +</html> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-a-element-ref.html b/testing/web-platform/tests/svg/linking/reftests/href-a-element-ref.html new file mode 100644 index 0000000000..0c67c98b02 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-a-element-ref.html @@ -0,0 +1,8 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - a element reference</title> +<body> + <svg width="100" height="100" viewBox="0 0 100 100"> + <rect width="100%" height="100%" fill="lime"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-feImage-element-ref.html b/testing/web-platform/tests/svg/linking/reftests/href-feImage-element-ref.html new file mode 100644 index 0000000000..cb3758dfa7 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-feImage-element-ref.html @@ -0,0 +1,15 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - feImage element reference</title> +<body> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <filter id="Fitted" primitiveUnits="objectBoundingBox"> + <feImage xlink:href="/images/rgrg-256x256.png" + x="0" y="0" width="100%" height="100%" + preserveAspectRatio="none"/> + </filter> + <rect x="20" y="25" width="100" height="110" filter="url(#Fitted)"/> + <rect x="20" y="25" width="100" height="110" fill="none" stroke="green"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-feImage-element.html b/testing/web-platform/tests/svg/linking/reftests/href-feImage-element.html new file mode 100644 index 0000000000..efdbe63a1f --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-feImage-element.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - feImage element</title> +<meta name="assert" content="The feImage element should accept href"> +<link rel="match" href="href-feImage-element-ref.html"> +<body> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <filter id="Fitted" primitiveUnits="objectBoundingBox"> + <feImage href="/images/rgrg-256x256.png" + xlink:href="/images/grgr-256x256.png" + x="0" y="0" width="100%" height="100%" + preserveAspectRatio="none"/> + </filter> + <rect x="20" y="25" width="100" height="110" filter="url(#Fitted)"/> + <rect x="20" y="25" width="100" height="110" fill="none" stroke="green"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-filter-element-ref.html b/testing/web-platform/tests/svg/linking/reftests/href-filter-element-ref.html new file mode 100644 index 0000000000..9b009e31d1 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-filter-element-ref.html @@ -0,0 +1,12 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - filter element reference</title> +<body> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <filter id="blurMe"> + <feGaussianBlur in="SourceGraphic" stdDeviation="5" /> + </filter> + <circle cx="60" cy="60" r="50" fill="green" filter="url(#blurMe)" /> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-filter-element.html b/testing/web-platform/tests/svg/linking/reftests/href-filter-element.html new file mode 100644 index 0000000000..3f718d0c55 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-filter-element.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - filter element</title> +<meta name="assert" content="The filter element should accept href"> +<link rel="match" href="href-filter-element-ref.html"> +<body> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <filter id="blurMe"> + <feGaussianBlur in="SourceGraphic" stdDeviation="5" /> + </filter> + <filter id="dropShadow"> + <feGaussianBlur in="SourceAlpha" stdDeviation="3" /> + <feOffset dx="2" dy="4" /> + <feMerge> + <feMergeNode /> + <feMergeNode in="SourceGraphic" /> + </feMerge> + </filter> + <filter id="Copied" href="#blurMe" xlink:href="#dropShadow"> + </filter> + <circle cx="60" cy="60" r="50" fill="green" filter="url(#Copied)"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-gradient-element-ref.html b/testing/web-platform/tests/svg/linking/reftests/href-gradient-element-ref.html new file mode 100644 index 0000000000..279be683df --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-gradient-element-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - gradient element reference</title> +<body> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <linearGradient id="MyGradient"> + <stop offset="5%" stop-color="green"/> + <stop offset="95%" stop-color="gold"/> + </linearGradient> + <rect fill="url(#MyGradient)" stroke="black" x="0" y="0" + width="100" height="100"/> + + <radialGradient id="MyRadialGradient"> + <stop offset="0%" stop-color="red"/> + <stop offset="100%" stop-color="blue"/> + </radialGradient> + <rect x="110" y="0" rx="15" ry="15" width="100" height="100" + fill="url(#MyRadialGradient)"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-gradient-element.html b/testing/web-platform/tests/svg/linking/reftests/href-gradient-element.html new file mode 100644 index 0000000000..2442b6f3d4 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-gradient-element.html @@ -0,0 +1,31 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - gradient element</title> +<meta name="assert" content="The gradient element should accept href"> +<link rel="match" href="href-gradient-element-ref.html"> +<body> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <linearGradient id="MyGradient"> + <stop offset="5%" stop-color="green"/> + <stop offset="95%" stop-color="gold"/> + </linearGradient> + <linearGradient id="MyGradient2"> + <stop offset="5%" stop-color="red"/> + <stop offset="95%" stop-color="blue"/> + </linearGradient> + <linearGradient id="CopiedGradient" href="#MyGradient" + xlink:href="#MyGradient2"> + </linearGradient> + <rect fill="url(#CopiedGradient)" stroke="black" x="0" y="0" + width="100" height="100"/> + + <radialGradient id="MyRadialGradient"> + <stop offset="0%" stop-color="red"/> + <stop offset="100%" stop-color="blue"/> + </radialGradient> + <radialGradient id="CopiedRadialGradient" href="#MyRadialGradient"/> + <rect x="110" y="0" rx="15" ry="15" width="100" height="100" + fill="url(#CopiedRadialGradient)"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-image-element-ref.html b/testing/web-platform/tests/svg/linking/reftests/href-image-element-ref.html new file mode 100644 index 0000000000..c51906fdec --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-image-element-ref.html @@ -0,0 +1,9 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - image element reference</title> +<body> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <image xlink:href="/images/green.png" width="100px" height="100px"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-image-element.html b/testing/web-platform/tests/svg/linking/reftests/href-image-element.html new file mode 100644 index 0000000000..779e33f620 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-image-element.html @@ -0,0 +1,12 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - image element</title> +<meta name="assert" content="The image should accept href"> +<link rel="match" href="href-image-element-ref.html"> +<body> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <image href="/images/green.png" xlink:href="/images/red.png" + width="100px" height="100px"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-pattern-element-ref.html b/testing/web-platform/tests/svg/linking/reftests/href-pattern-element-ref.html new file mode 100644 index 0000000000..bd8770c974 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-pattern-element-ref.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - pattern element reference</title> +<body> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <pattern id="Pattern" x="0" y="0" width=".25" height=".25"> + <rect x="0" y="0" width="25" height="25" fill="skyblue"/> + <circle cx="25" cy="25" r="20" fill="green" fill-opacity="0.5"/> + </pattern> + <rect fill="url(#Pattern)" stroke="black" x="0" y="0" + width="200" height="200"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-pattern-element.html b/testing/web-platform/tests/svg/linking/reftests/href-pattern-element.html new file mode 100644 index 0000000000..89aa243152 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-pattern-element.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - pattern element</title> +<meta name="assert" content="The pattern element should accept href"> +<link rel="match" href="href-pattern-element-ref.html"> +<body> + <svg width="300" height="300" viewBox="0 0 300 300"> + <pattern id="Pattern" x="0" y="0" width=".25" height=".25"> + <rect x="0" y="0" width="25" height="25" fill="skyblue"/> + <circle cx="25" cy="25" r="20" fill="green" fill-opacity="0.5"/> + </pattern> + <pattern id="Pattern2" x="0" y="0" width=".25" height=".25"> + <rect x="0" y="0" width="25" height="25" fill="skyblue"/> + <circle cx="25" cy="25" r="20" fill="red" fill-opacity="0.5"/> + </pattern> + <pattern id="CopiedPattern" href="#Pattern" xlink:href="#Pattern2"> + </pattern> + <rect fill="url(#CopiedPattern)" stroke="black" x="0" y="0" + width="200" height="200"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-textPath-element-ref.html b/testing/web-platform/tests/svg/linking/reftests/href-textPath-element-ref.html new file mode 100644 index 0000000000..4e1fd3531d --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-textPath-element-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - textPath element reference</title> +<body> + <svg width="100%" height="100%" viewBox="0 0 1000 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <defs> + <path id="MyPath" + d="M 100 200 + C 200 100 300 0 400 100 + C 500 200 600 300 700 200 + C 800 100 900 100 900 100" /> + </defs> + <text font-family="Verdana" font-size="40"> + <textPath xlink:href="#MyPath"> + We go up, then we go down, then up again + </textPath> + </text> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-textPath-element.html b/testing/web-platform/tests/svg/linking/reftests/href-textPath-element.html new file mode 100644 index 0000000000..b31e92224a --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-textPath-element.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - textPath element</title> +<meta name="assert" content="The textPath element should accept href"> +<link rel="match" href="href-textPath-element-ref.html"> +<body> + <svg width="100%" height="100%" viewBox="0 0 1000 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <defs> + <path id="MyPath" + d="M 100 200 + C 200 100 300 0 400 100 + C 500 200 600 300 700 200 + C 800 100 900 100 900 100" /> + <path id="MyPath2" d="M 100 100 L 900 100" /> + </defs> + <text font-family="Verdana" font-size="40"> + <textPath href="#MyPath" xlink:href="#MyPath2"> + We go up, then we go down, then up again + </textPath> + </text> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-use-element-ref.html b/testing/web-platform/tests/svg/linking/reftests/href-use-element-ref.html new file mode 100644 index 0000000000..93577b7643 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-use-element-ref.html @@ -0,0 +1,12 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - use element reference</title> +<body> + <svg style="display: none"> + <rect id='refRect' style="fill: red" width="100" height="100" /> + </svg> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <use xlink:href="#refRect"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/href-use-element.html b/testing/web-platform/tests/svg/linking/reftests/href-use-element.html new file mode 100644 index 0000000000..e6b37f29e5 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/href-use-element.html @@ -0,0 +1,15 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>href - use element</title> +<meta name="assert" content="The use element should accept href"> +<link rel="match" href="href-use-element-ref.html"> +<body> + <svg style="display: none"> + <circle id="refCircle" style="fill: orange" cx="50px" cy="50px" r="50px" /> + <rect id='refRect' style="fill: red" width="100" height="100" /> + </svg> + <svg width="300" height="300" viewBox="0 0 300 300" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <use href="#refRect" xlink:href="#refCircle"/> + </svg> +</body> diff --git a/testing/web-platform/tests/svg/linking/reftests/reference/green-100x100.svg b/testing/web-platform/tests/svg/linking/reftests/reference/green-100x100.svg new file mode 100644 index 0000000000..120941444a --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/reference/green-100x100.svg @@ -0,0 +1,3 @@ +<svg xmlns="http://www.w3.org/2000/svg"> + <rect width="100" height="100" fill="green"/> +</svg> diff --git a/testing/web-platform/tests/svg/linking/reftests/url-processing-invalid-base.svg b/testing/web-platform/tests/svg/linking/reftests/url-processing-invalid-base.svg new file mode 100644 index 0000000000..fc5d7c6b06 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/url-processing-invalid-base.svg @@ -0,0 +1,15 @@ +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>An invalid base URL makes all internal references invalid</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/linking.html#processingURL"/> + <html:link rel="help" href="https://svgwg.org/svg2-draft/painting.html#SpecifyingPaint"/> + <html:link rel="help" href="https://svgwg.org/svg2-draft/pservers.html#PaintServerTemplates"/> + <html:link rel="match" href="reference/green-100x100.svg"/> + <html:base href="invalid:"/> + <linearGradient id="p2"> + <stop stop-color="orange"/> + </linearGradient> + <linearGradient id="p" href="#p2"/> + <rect width="100" height="100" fill="red"/> + <rect width="100" height="100" fill="url(#p) green"/> +</svg> diff --git a/testing/web-platform/tests/svg/linking/reftests/url-processing-whitespace-001.svg b/testing/web-platform/tests/svg/linking/reftests/url-processing-whitespace-001.svg new file mode 100644 index 0000000000..6baa0fdd84 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/url-processing-whitespace-001.svg @@ -0,0 +1,17 @@ +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Leading and trailing whitespace is stripped from (local) URL references (<paint>)</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/linking.html#processingURL"/> + <html:link rel="help" href="https://svgwg.org/svg2-draft/painting.html#SpecifyingPaint"/> + <html:link rel="match" href="reference/green-100x100.svg"/> + <linearGradient id="green"> + <stop stop-color="green"/> + </linearGradient> + <linearGradient id="red"> + <stop stop-color="red"/> + </linearGradient> + <rect width="50" height="50" fill="url(' #green') red"/> + <rect width="50" height="50" fill="url('#green ') red" x="50"/> + <rect width="50" height="50" fill="url(' #green ') red" y="50"/> + <rect width="50" height="50" fill="url(' # red ') green" y="50" x="50"/> +</svg> diff --git a/testing/web-platform/tests/svg/linking/reftests/url-processing-whitespace-002.svg b/testing/web-platform/tests/svg/linking/reftests/url-processing-whitespace-002.svg new file mode 100644 index 0000000000..ee4969a532 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/url-processing-whitespace-002.svg @@ -0,0 +1,19 @@ +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Leading and trailing whitespace is stripped from (local) URL references (<use> href)</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/linking.html#processingURL"/> + <html:link rel="help" href="https://svgwg.org/svg2-draft/struct.html#UseElementHrefAttribute"/> + <html:link rel="match" href="reference/green-100x100.svg"/> + <defs> + <rect id="green" width="50" height="50" fill="green"/> + <rect id="red" width="50" height="50" fill="red"/> + </defs> + <rect width="100" height="100" fill="red"/> + <use href=" #green"/> + <use href="#green " x="50"/> + <use href=" #green " y="50"/> + <g transform="translate(50 50)"> + <rect id="green" width="50" height="50" fill="green"/> + <use href=" # red "/> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/linking/reftests/url-processing-whitespace-003.svg b/testing/web-platform/tests/svg/linking/reftests/url-processing-whitespace-003.svg new file mode 100644 index 0000000000..1dabd9f8f9 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/url-processing-whitespace-003.svg @@ -0,0 +1,24 @@ +<svg xmlns="http://www.w3.org/2000/svg" + xmlns:html="http://www.w3.org/1999/xhtml"> + <title>Leading and trailing whitespace is stripped from (local) URL references (<linearGradient> href)</title> + <html:link rel="help" href="https://svgwg.org/svg2-draft/linking.html#processingURL"/> + <html:link rel="help" href="https://svgwg.org/svg2-draft/pservers.html#PaintServerTemplates"/> + <html:link rel="match" href="reference/green-100x100.svg"/> + <linearGradient id="green"> + <stop stop-color="green"/> + </linearGradient> + <linearGradient id="red"> + <stop stop-color="red"/> + </linearGradient> + <linearGradient id="g1" href=" #green"/> + <linearGradient id="g2" href="#green "/> + <linearGradient id="g3" href=" #green "/> + <linearGradient id="g4" href=" # red "> + <stop stop-color="green"/> + </linearGradient> + <rect width="100" height="100" fill="red"/> + <rect width="50" height="50" fill="url(#g1) red"/> + <rect width="50" height="50" fill="url(#g2) red" x="50"/> + <rect width="50" height="50" fill="url(#g3) red" y="50"/> + <rect width="50" height="50" fill="url(#g4) red" y="50" x="50"/> +</svg> diff --git a/testing/web-platform/tests/svg/linking/reftests/url-reference-local-textpath.svg b/testing/web-platform/tests/svg/linking/reftests/url-reference-local-textpath.svg new file mode 100644 index 0000000000..c90cfb317f --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/url-reference-local-textpath.svg @@ -0,0 +1,10 @@ +<svg xmlns="http://www.w3.org/2000/svg" xmlns:h="http://www.w3.org/1999/xhtml"> + <title>Local URL reference on <textPath> with base URL different from document URL</title> + <h:link rel="stylesheet" type="text/css" href="/fonts/ahem.css"/> + <h:link rel="help" href="https://svgwg.org/svg2-draft/linking.html#linkRefAttrs"/> + <h:link rel="match" href="reference/green-100x100.svg"/> + <h:base href="http://www.example.com/"/> + + <path id="path" d="M0,80h100"/> + <text font-size="100" font-family="Ahem" fill="green"><textPath href="#path">X</textPath></text> +</svg> diff --git a/testing/web-platform/tests/svg/linking/reftests/use-descendant-combinator-001.html b/testing/web-platform/tests/svg/linking/reftests/use-descendant-combinator-001.html new file mode 100644 index 0000000000..5619e0ba69 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/use-descendant-combinator-001.html @@ -0,0 +1,28 @@ +<!doctype html> +<meta charset=utf-8> +<title>CSS Test: use element doesn't cross shadow tree boundaries in selector-matching</title> +<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io"> +<link rel="help" href="https://svgwg.org/svg2-draft/struct.html#UseElement"> +<link rel="match" href="/svg/linking/reftests/use-descendant-combinator-ref.html"> +<style> +#test rect { + stroke: red; + stroke-width: 10px; +} +</style> +<p> + You should see a green square, and no red. +</p> +<svg + version="1.1" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <defs> + <g id="square"> + <rect width="100" height="100"/> + </g> + </defs> + <g id="test"> + <use xlink:href="#square" fill="green" /> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/linking/reftests/use-descendant-combinator-002.html b/testing/web-platform/tests/svg/linking/reftests/use-descendant-combinator-002.html new file mode 100644 index 0000000000..643f20d16d --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/use-descendant-combinator-002.html @@ -0,0 +1,33 @@ +<!doctype html> +<meta charset=utf-8> +<title>CSS Test: use element doesn't cross shadow tree boundaries in selector-matching</title> +<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io"> +<link rel="help" href="https://svgwg.org/svg2-draft/struct.html#UseElement"> +<link rel="match" href="/svg/linking/reftests/use-descendant-combinator-ref.html"> +<style> +#test rect { + stroke: red; + stroke-width: 10px; +} +.inside-use rect { + fill: green; +} +</style> +<p> + You should see a green square, and no red. +</p> +<svg + version="1.1" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <defs> + <g id="square"> + <g class="inside-use"> + <rect width="100" height="100"/> + </g> + </g> + </defs> + <g id="test"> + <use xlink:href="#square" /> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/linking/reftests/use-descendant-combinator-003.html b/testing/web-platform/tests/svg/linking/reftests/use-descendant-combinator-003.html new file mode 100644 index 0000000000..14bf5bd122 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/use-descendant-combinator-003.html @@ -0,0 +1,37 @@ +<!doctype html> +<meta charset=utf-8> +<title>CSS Test: use element doesn't cross shadow tree boundaries in selector-matching, and is invalidated properly</title> +<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io"> +<link rel="help" href="https://svgwg.org/svg2-draft/struct.html#UseElement"> +<link rel="match" href="/svg/linking/reftests/use-descendant-combinator-ref.html"> +<style> +#test rect { + stroke: red; + stroke-width: 10px; +} +.inside-use rect { + fill: red; +} +defs .inside-use rect { + fill: red; +} +</style> +<p> + You should see a green square, and no red. +</p> +<svg> + <defs> + <g id="square"> + <g class="inside-use"> + <rect width="100" height="100"/> + </g> + </g> + </defs> + <g id="test"> + <use href="#square" /> + </g> +</svg> +<script> + document.body.offsetTop; + document.styleSheets[0].cssRules[1].style.fill = 'green'; +</script> diff --git a/testing/web-platform/tests/svg/linking/reftests/use-descendant-combinator-ref.html b/testing/web-platform/tests/svg/linking/reftests/use-descendant-combinator-ref.html new file mode 100644 index 0000000000..dae3fc1173 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/use-descendant-combinator-ref.html @@ -0,0 +1,12 @@ +<!doctype html> +<meta charset=utf-8> +<title>CSS Test reference</title> +<p> + You should see a green square, and no red. +</p> +<svg + version="1.1" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <rect width="100" height="100" fill="green"/> +</svg> diff --git a/testing/web-platform/tests/svg/linking/reftests/use-hidden-attr-change.html b/testing/web-platform/tests/svg/linking/reftests/use-hidden-attr-change.html new file mode 100644 index 0000000000..4fe535bbac --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/use-hidden-attr-change.html @@ -0,0 +1,32 @@ +<!doctype html> +<meta charset=utf-8> +<title>use element reacts to attribute changes when it's not rendered</title> +<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io"> +<link rel="help" href="https://svgwg.org/svg2-draft/struct.html#UseElement"> +<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1502658"> +<link rel="match" href="/svg/linking/reftests/use-descendant-combinator-ref.html"> +<style> +</style> +<p> + You should see a green square, and no red. +</p> +<svg + version="1.1" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink" + style="display: none"> + <defs> + <g id="square"> + <rect width="100" height="100" fill="green" /> + </g> + </defs> + <g id="test"> + <use /> + </g> +</svg> +<script> + onload = () => { + document.querySelector("use").setAttributeNS("http://www.w3.org/1999/xlink", "href", "#square"); + document.querySelector("svg").style.display = ""; + } +</script> diff --git a/testing/web-platform/tests/svg/linking/reftests/use-keyframes-ref.html b/testing/web-platform/tests/svg/linking/reftests/use-keyframes-ref.html new file mode 100644 index 0000000000..7d96781805 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/use-keyframes-ref.html @@ -0,0 +1,6 @@ +<!doctype html> +<meta charset="utf-8"> +<title>CSS Test Reference</title> +<svg width="100" height="100" viewBox="0 0 100 100"> + <rect width="100%" height="100%" fill="lime" /> +</svg> diff --git a/testing/web-platform/tests/svg/linking/reftests/use-keyframes.html b/testing/web-platform/tests/svg/linking/reftests/use-keyframes.html new file mode 100644 index 0000000000..2ae24138f2 --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/use-keyframes.html @@ -0,0 +1,19 @@ +<!doctype html> +<meta charset="utf-8"> +<title>CSS Test: Keyframe animations from the document match in use elements</title> +<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io"> +<link rel="author" title="Mozilla" href="https://mozilla.org"> +<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1513920"> +<link rel="match" href="use-keyframes-ref.html"> +<style> +@keyframes animationname { + from { fill: lime; } + to { fill: lime; } +} +</style> +<svg width="100" height="100" viewBox="0 0 100 100"> + <symbol id="symbol"> + <rect width="100%" height="100%" fill="red" style="animation: animationname 1s infinite;" /> + </symbol> + <use href="#symbol" /> +</svg> diff --git a/testing/web-platform/tests/svg/linking/reftests/use-nested-symbol-001.html b/testing/web-platform/tests/svg/linking/reftests/use-nested-symbol-001.html new file mode 100644 index 0000000000..7008a2512a --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/use-nested-symbol-001.html @@ -0,0 +1,26 @@ +<!doctype html> +<meta charset=utf-8> +<title>CSS Test: symbol doesn't improperly render in svg use shadow tree</title> +<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io"> +<link rel="help" href="https://svgwg.org/svg2-draft/struct.html#UseElement"> +<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1547619"> +<link rel="match" href="/svg/linking/reftests/use-descendant-combinator-ref.html"> +<p> + You should see a green square, and no red. +</p> +<svg + version="1.1" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <defs> + <symbol id="square"> + <rect width="100" height="100"/> + <symbol> + <rect width="100" height="100" fill="red" /> + </symbol> + </symbol> + </defs> + <g id="test"> + <use xlink:href="#square" fill="green" /> + </g> +</svg> diff --git a/testing/web-platform/tests/svg/linking/reftests/use-symbol-rendered-001.html b/testing/web-platform/tests/svg/linking/reftests/use-symbol-rendered-001.html new file mode 100644 index 0000000000..b3ca3a321a --- /dev/null +++ b/testing/web-platform/tests/svg/linking/reftests/use-symbol-rendered-001.html @@ -0,0 +1,31 @@ +<!doctype html> +<meta charset=utf-8> +<title>CSS Test: symbol referenced in a use shadow tree should actually be a symbol</title> +<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io"> +<link rel="help" href="https://svgwg.org/svg2-draft/struct.html#SymbolNotes"> +<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1547619"> +<link rel="match" href="/svg/linking/reftests/use-descendant-combinator-ref.html"> +<p> + You should see a green square, and no red. +</p> +<style> +rect { + fill: red; +} +symbol rect { + fill: green; +} +</style> +<svg + version="1.1" + xmlns="http://www.w3.org/2000/svg" + xmlns:xlink="http://www.w3.org/1999/xlink"> + <defs> + <symbol id="square"> + <rect width="100" height="100"/> + </symbol> + </defs> + <g id="test"> + <use xlink:href="#square" fill="green" /> + </g> +</svg> |
