diff options
Diffstat (limited to 'testing/web-platform/tests/css/compositing/svg')
5 files changed, 88 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/compositing/svg/mix-blend-mode-in-svg-image.html b/testing/web-platform/tests/css/compositing/svg/mix-blend-mode-in-svg-image.html new file mode 100644 index 0000000000..ed0520e443 --- /dev/null +++ b/testing/web-platform/tests/css/compositing/svg/mix-blend-mode-in-svg-image.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> + <head> + <title>CSS Compositing and Blending: mix-blend-mode in an SVG linked as an image</title> + <link rel="author" title="Rik Cabanier" href="mailto:cabanier@adobe.com""> + <link rel="help" href="https://drafts.fxtf.org/compositing-1/#isolation"> + <link rel="reviewer" title="Dirk Schulze" href="mailto:dschulze@adobe.com"> + <link rel="help" href="https://drafts.fxtf.org/compositing-1/#csscompositingrules_SVG"> + <link rel="help" href="https://drafts.fxtf.org/compositing-1/#mix-blend-mode"> + <meta name="flags" content="svg"> + <link rel="match" href="reference/mix-blend-mode-in-svg-image-ref.html"> + </head> + <body> + <p>There should be a green rectangle on the screen. <br> + Test passes if you see a green rectangle.</p> + <img src="support/green_square_blending.svg"/> + </body> +</html> diff --git a/testing/web-platform/tests/css/compositing/svg/mix-blend-mode-svg-rectangle.html b/testing/web-platform/tests/css/compositing/svg/mix-blend-mode-svg-rectangle.html new file mode 100644 index 0000000000..543586f098 --- /dev/null +++ b/testing/web-platform/tests/css/compositing/svg/mix-blend-mode-svg-rectangle.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8"> + <title>CSS Test: mix-blend-mode for a simple SVG element - rectangle</title> + <link rel="author" title="Mirela Budăeș" href="mailto:mbudaes@adobe.com"> + <link rel="reviewer" title="Mihai Balan" href="mailto:mibalan@adobe.com"> + <link rel="reviewer" title="Rik Cabanier" href="mailto:cabanier@adobe.com"> + <link rel="help" href="https://drafts.fxtf.org/compositing-1/#csscompositingrules_SVG"> + <link rel="help" href="https://drafts.fxtf.org/compositing-1/#mix-blend-mode"> + <meta name="flags" content="svg"> + <link rel="match" href="reference/mix-blend-mode-svg-rectangle-ref.html"> + </head> + <body> + <!-- The white background is to prevent alpha-blending differences in Chrome + for the antialiased pixels of the text. --> + <p style="background: white">There should be no red rectangle on the screen. <br> + Test passes if you see a black rectangle.</p> + <svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="400px" height="400px" > + <rect x="0" y="0" width="100" height="100" fill="aqua"/> + <rect x="0" y="0" width="100" height="100" fill="red" style="mix-blend-mode: multiply"/> + </svg> + </body> +</html> diff --git a/testing/web-platform/tests/css/compositing/svg/reference/mix-blend-mode-in-svg-image-ref.html b/testing/web-platform/tests/css/compositing/svg/reference/mix-blend-mode-in-svg-image-ref.html new file mode 100644 index 0000000000..9a2a030737 --- /dev/null +++ b/testing/web-platform/tests/css/compositing/svg/reference/mix-blend-mode-in-svg-image-ref.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8"> + <title>CSS Reftest Reference</title> + <link rel="author" title="Mirela Budăeș" href="mailto:mbudaes@adobe.com"> + <style> + div { + width: 100px; + height:100px; + background-color: #0F0; + } + </style> + </head> + <body> + <p>There should be a green rectangle on the screen. <br> + Test passes if you see a green rectangle.</p> + <div></div> + </body> +</html> diff --git a/testing/web-platform/tests/css/compositing/svg/reference/mix-blend-mode-svg-rectangle-ref.html b/testing/web-platform/tests/css/compositing/svg/reference/mix-blend-mode-svg-rectangle-ref.html new file mode 100644 index 0000000000..94e73b57c9 --- /dev/null +++ b/testing/web-platform/tests/css/compositing/svg/reference/mix-blend-mode-svg-rectangle-ref.html @@ -0,0 +1,23 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8"> + <title>CSS Reftest Reference</title> + <link rel="author" title="Mirela Budăeș" href="mailto:mbudaes@adobe.com"> + <style> + p { + background: white; + } + div { + width: 100px; + height:100px; + background-color: black;/*rgb(0,0,0);*/ + } + </style> + </head> + <body> + <p>There should be no red rectangle on the screen. <br> + Test passes if you see a black rectangle.</p> + <div></div> + </body> +</html> diff --git a/testing/web-platform/tests/css/compositing/svg/support/green_square_blending.svg b/testing/web-platform/tests/css/compositing/svg/support/green_square_blending.svg new file mode 100644 index 0000000000..19d61e27fe --- /dev/null +++ b/testing/web-platform/tests/css/compositing/svg/support/green_square_blending.svg @@ -0,0 +1,3 @@ +<svg xmlns="http://www.w3.org/2000/svg" version="1.1"> + <rect width="100" height="100" style="fill:rgb(0,255,0);mix-blend-mode: difference;"/> +</svg> |
