diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-06-12 05:35:37 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-06-12 05:35:37 +0000 |
| commit | a90a5cba08fdf6c0ceb95101c275108a152a3aed (patch) | |
| tree | 532507288f3defd7f4dcf1af49698bcb76034855 /testing/web-platform/tests/html/canvas/offscreen/filters | |
| parent | Adding debian version 126.0.1-1. (diff) | |
| download | firefox-a90a5cba08fdf6c0ceb95101c275108a152a3aed.tar.xz firefox-a90a5cba08fdf6c0ceb95101c275108a152a3aed.zip | |
Merging upstream version 127.0.
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/html/canvas/offscreen/filters')
36 files changed, 810 insertions, 760 deletions
diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.isotropic.tentative-expected.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.isotropic.tentative-expected.html deleted file mode 100644 index dac31c97f1..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.isotropic.tentative-expected.html +++ /dev/null @@ -1,15 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<title>Canvas test: 2d.filter.canvasFilterObject.gaussianBlur.isotropic.tentative</title> -<h1>2d.filter.canvasFilterObject.gaussianBlur.isotropic.tentative</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> - -<svg xmlns="http://www.w3.org/2000/svg" - width="100" height="100" - color-interpolation-filters="sRGB"> - <filter id="blur" x="-50%" y="-50%" width="200%" height="200%"> - <feGaussianBlur stdDeviation="4 4" /> - </filter> - <rect x="25" y="25" width="50" height="50" - fill="teal" filter="url(#blur)" /> -</svg> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.isotropic.tentative.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.isotropic.tentative.html deleted file mode 100644 index 801e6fdb8c..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.isotropic.tentative.html +++ /dev/null @@ -1,23 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<link rel="match" href="2d.filter.canvasFilterObject.gaussianBlur.isotropic.tentative-expected.html"> -<title>Canvas test: 2d.filter.canvasFilterObject.gaussianBlur.isotropic.tentative</title> -<h1>2d.filter.canvasFilterObject.gaussianBlur.isotropic.tentative</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script> - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.filter = new CanvasFilter({ - name: 'gaussianBlur', - stdDeviation: [4, 4], - }); - ctx.fillRect(25, 25, 50, 50); - - const outputCanvas = document.getElementById("canvas"); - outputCanvas.getContext('2d').drawImage(canvas, 0, 0); -</script> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.isotropic.tentative.w.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.isotropic.tentative.w.html deleted file mode 100644 index 6c7c7f7649..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.isotropic.tentative.w.html +++ /dev/null @@ -1,37 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<html class="reftest-wait"> -<link rel="match" href="2d.filter.canvasFilterObject.gaussianBlur.isotropic.tentative-expected.html"> -<title>Canvas test: 2d.filter.canvasFilterObject.gaussianBlur.isotropic.tentative</title> -<h1>2d.filter.canvasFilterObject.gaussianBlur.isotropic.tentative</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script id='myWorker' type='text/worker'> - self.onmessage = function(e) { - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.filter = new CanvasFilter({ - name: 'gaussianBlur', - stdDeviation: [4, 4], - }); - ctx.fillRect(25, 25, 50, 50); - - const bitmap = canvas.transferToImageBitmap(); - self.postMessage(bitmap, bitmap); - }; -</script> -<script> - const blob = new Blob([document.getElementById('myWorker').textContent]); - const worker = new Worker(URL.createObjectURL(blob)); - worker.addEventListener('message', msg => { - const outputCtx = document.getElementById("canvas").getContext('2d'); - outputCtx.drawImage(msg.data, 0, 0); - document.documentElement.classList.remove("reftest-wait"); - }); - worker.postMessage(null); -</script> -</html> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.mostly-x.tentative-expected.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.mostly-x.tentative-expected.html deleted file mode 100644 index 88d0cb2de2..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.mostly-x.tentative-expected.html +++ /dev/null @@ -1,15 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<title>Canvas test: 2d.filter.canvasFilterObject.gaussianBlur.mostly-x.tentative</title> -<h1>2d.filter.canvasFilterObject.gaussianBlur.mostly-x.tentative</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> - -<svg xmlns="http://www.w3.org/2000/svg" - width="100" height="100" - color-interpolation-filters="sRGB"> - <filter id="blur" x="-50%" y="-50%" width="200%" height="200%"> - <feGaussianBlur stdDeviation="4 1" /> - </filter> - <rect x="25" y="25" width="50" height="50" - fill="teal" filter="url(#blur)" /> -</svg> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.mostly-x.tentative.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.mostly-x.tentative.html deleted file mode 100644 index ba986d8e7b..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.mostly-x.tentative.html +++ /dev/null @@ -1,23 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<link rel="match" href="2d.filter.canvasFilterObject.gaussianBlur.mostly-x.tentative-expected.html"> -<title>Canvas test: 2d.filter.canvasFilterObject.gaussianBlur.mostly-x.tentative</title> -<h1>2d.filter.canvasFilterObject.gaussianBlur.mostly-x.tentative</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script> - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.filter = new CanvasFilter({ - name: 'gaussianBlur', - stdDeviation: [4, 1], - }); - ctx.fillRect(25, 25, 50, 50); - - const outputCanvas = document.getElementById("canvas"); - outputCanvas.getContext('2d').drawImage(canvas, 0, 0); -</script> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.mostly-x.tentative.w.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.mostly-x.tentative.w.html deleted file mode 100644 index 86fe086327..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.mostly-x.tentative.w.html +++ /dev/null @@ -1,37 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<html class="reftest-wait"> -<link rel="match" href="2d.filter.canvasFilterObject.gaussianBlur.mostly-x.tentative-expected.html"> -<title>Canvas test: 2d.filter.canvasFilterObject.gaussianBlur.mostly-x.tentative</title> -<h1>2d.filter.canvasFilterObject.gaussianBlur.mostly-x.tentative</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script id='myWorker' type='text/worker'> - self.onmessage = function(e) { - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.filter = new CanvasFilter({ - name: 'gaussianBlur', - stdDeviation: [4, 1], - }); - ctx.fillRect(25, 25, 50, 50); - - const bitmap = canvas.transferToImageBitmap(); - self.postMessage(bitmap, bitmap); - }; -</script> -<script> - const blob = new Blob([document.getElementById('myWorker').textContent]); - const worker = new Worker(URL.createObjectURL(blob)); - worker.addEventListener('message', msg => { - const outputCtx = document.getElementById("canvas").getContext('2d'); - outputCtx.drawImage(msg.data, 0, 0); - document.documentElement.classList.remove("reftest-wait"); - }); - worker.postMessage(null); -</script> -</html> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.mostly-y.tentative-expected.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.mostly-y.tentative-expected.html deleted file mode 100644 index 744983d4ae..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.mostly-y.tentative-expected.html +++ /dev/null @@ -1,15 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<title>Canvas test: 2d.filter.canvasFilterObject.gaussianBlur.mostly-y.tentative</title> -<h1>2d.filter.canvasFilterObject.gaussianBlur.mostly-y.tentative</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> - -<svg xmlns="http://www.w3.org/2000/svg" - width="100" height="100" - color-interpolation-filters="sRGB"> - <filter id="blur" x="-50%" y="-50%" width="200%" height="200%"> - <feGaussianBlur stdDeviation="1 4" /> - </filter> - <rect x="25" y="25" width="50" height="50" - fill="teal" filter="url(#blur)" /> -</svg> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.mostly-y.tentative.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.mostly-y.tentative.html deleted file mode 100644 index 0265cfa6c4..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.mostly-y.tentative.html +++ /dev/null @@ -1,23 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<link rel="match" href="2d.filter.canvasFilterObject.gaussianBlur.mostly-y.tentative-expected.html"> -<title>Canvas test: 2d.filter.canvasFilterObject.gaussianBlur.mostly-y.tentative</title> -<h1>2d.filter.canvasFilterObject.gaussianBlur.mostly-y.tentative</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script> - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.filter = new CanvasFilter({ - name: 'gaussianBlur', - stdDeviation: [1, 4], - }); - ctx.fillRect(25, 25, 50, 50); - - const outputCanvas = document.getElementById("canvas"); - outputCanvas.getContext('2d').drawImage(canvas, 0, 0); -</script> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.mostly-y.tentative.w.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.mostly-y.tentative.w.html deleted file mode 100644 index c22b320857..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.mostly-y.tentative.w.html +++ /dev/null @@ -1,37 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<html class="reftest-wait"> -<link rel="match" href="2d.filter.canvasFilterObject.gaussianBlur.mostly-y.tentative-expected.html"> -<title>Canvas test: 2d.filter.canvasFilterObject.gaussianBlur.mostly-y.tentative</title> -<h1>2d.filter.canvasFilterObject.gaussianBlur.mostly-y.tentative</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script id='myWorker' type='text/worker'> - self.onmessage = function(e) { - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.filter = new CanvasFilter({ - name: 'gaussianBlur', - stdDeviation: [1, 4], - }); - ctx.fillRect(25, 25, 50, 50); - - const bitmap = canvas.transferToImageBitmap(); - self.postMessage(bitmap, bitmap); - }; -</script> -<script> - const blob = new Blob([document.getElementById('myWorker').textContent]); - const worker = new Worker(URL.createObjectURL(blob)); - worker.addEventListener('message', msg => { - const outputCtx = document.getElementById("canvas").getContext('2d'); - outputCtx.drawImage(msg.data, 0, 0); - document.documentElement.classList.remove("reftest-wait"); - }); - worker.postMessage(null); -</script> -</html> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.tentative-expected.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.tentative-expected.html new file mode 100644 index 0000000000..c1ca0ab46f --- /dev/null +++ b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.tentative-expected.html @@ -0,0 +1,85 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.filter.canvasFilterObject.gaussianBlur.tentative</title> +<h1 style="font-size: 20px;">2d.filter.canvasFilterObject.gaussianBlur.tentative</h1> +<p class="desc">Test CanvasFilter() with gaussianBlur.</p> + +<div style="display: grid; grid-gap: 4px; + grid-template-columns: repeat(5, max-content); + font-size: 13px; text-align: center;"> +<span> + <div>x-only</div> + <div style="width: 100px; height: 100px; outline: 1px solid"> + <svg xmlns="http://www.w3.org/2000/svg" + width="100" height="100" + color-interpolation-filters="sRGB"> + <filter id="blur0" x="-50%" y="-50%" width="200%" height="200%"> + <feGaussianBlur stdDeviation="4 0" /> + </filter> + <rect x="25" y="25" width="50" height="50" + fill="teal" filter="url(#blur0)" /> + </svg> + </div> +</span> + +<span> + <div>mostly-x</div> + <div style="width: 100px; height: 100px; outline: 1px solid"> + <svg xmlns="http://www.w3.org/2000/svg" + width="100" height="100" + color-interpolation-filters="sRGB"> + <filter id="blur1" x="-50%" y="-50%" width="200%" height="200%"> + <feGaussianBlur stdDeviation="4 1" /> + </filter> + <rect x="25" y="25" width="50" height="50" + fill="teal" filter="url(#blur1)" /> + </svg> + </div> +</span> + +<span> + <div>isotropic</div> + <div style="width: 100px; height: 100px; outline: 1px solid"> + <svg xmlns="http://www.w3.org/2000/svg" + width="100" height="100" + color-interpolation-filters="sRGB"> + <filter id="blur2" x="-50%" y="-50%" width="200%" height="200%"> + <feGaussianBlur stdDeviation="4 4" /> + </filter> + <rect x="25" y="25" width="50" height="50" + fill="teal" filter="url(#blur2)" /> + </svg> + </div> +</span> + +<span> + <div>mostly-y</div> + <div style="width: 100px; height: 100px; outline: 1px solid"> + <svg xmlns="http://www.w3.org/2000/svg" + width="100" height="100" + color-interpolation-filters="sRGB"> + <filter id="blur3" x="-50%" y="-50%" width="200%" height="200%"> + <feGaussianBlur stdDeviation="1 4" /> + </filter> + <rect x="25" y="25" width="50" height="50" + fill="teal" filter="url(#blur3)" /> + </svg> + </div> +</span> + +<span> + <div>y-only</div> + <div style="width: 100px; height: 100px; outline: 1px solid"> + <svg xmlns="http://www.w3.org/2000/svg" + width="100" height="100" + color-interpolation-filters="sRGB"> + <filter id="blur4" x="-50%" y="-50%" width="200%" height="200%"> + <feGaussianBlur stdDeviation="0 4" /> + </filter> + <rect x="25" y="25" width="50" height="50" + fill="teal" filter="url(#blur4)" /> + </svg> + </div> +</span> + +</div> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.tentative.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.tentative.html new file mode 100644 index 0000000000..8e7ea3f727 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.tentative.html @@ -0,0 +1,121 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<link rel="match" href="2d.filter.canvasFilterObject.gaussianBlur.tentative-expected.html"> +<title>Canvas test: 2d.filter.canvasFilterObject.gaussianBlur.tentative</title> +<h1 style="font-size: 20px;">2d.filter.canvasFilterObject.gaussianBlur.tentative</h1> +<p class="desc">Test CanvasFilter() with gaussianBlur.</p> + +<div style="display: grid; grid-gap: 4px; + grid-template-columns: repeat(5, max-content); + font-size: 13px; text-align: center;"> +<span> + <div>x-only</div> + <canvas id="canvas0" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script type="module"> + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.filter = new CanvasFilter({ + name: 'gaussianBlur', + stdDeviation: [4, 0], + }); + ctx.fillRect(25, 25, 50, 50); + + const outputCanvas = document.getElementById("canvas0"); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(canvas, 0, 0); + </script> +</span> + +<span> + <div>mostly-x</div> + <canvas id="canvas1" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script type="module"> + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.filter = new CanvasFilter({ + name: 'gaussianBlur', + stdDeviation: [4, 1], + }); + ctx.fillRect(25, 25, 50, 50); + + const outputCanvas = document.getElementById("canvas1"); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(canvas, 0, 0); + </script> +</span> + +<span> + <div>isotropic</div> + <canvas id="canvas2" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script type="module"> + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.filter = new CanvasFilter({ + name: 'gaussianBlur', + stdDeviation: [4, 4], + }); + ctx.fillRect(25, 25, 50, 50); + + const outputCanvas = document.getElementById("canvas2"); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(canvas, 0, 0); + </script> +</span> + +<span> + <div>mostly-y</div> + <canvas id="canvas3" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script type="module"> + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.filter = new CanvasFilter({ + name: 'gaussianBlur', + stdDeviation: [1, 4], + }); + ctx.fillRect(25, 25, 50, 50); + + const outputCanvas = document.getElementById("canvas3"); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(canvas, 0, 0); + </script> +</span> + +<span> + <div>y-only</div> + <canvas id="canvas4" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script type="module"> + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.filter = new CanvasFilter({ + name: 'gaussianBlur', + stdDeviation: [0, 4], + }); + ctx.fillRect(25, 25, 50, 50); + + const outputCanvas = document.getElementById("canvas4"); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(canvas, 0, 0); + </script> +</span> + +</div> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.tentative.w.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.tentative.w.html new file mode 100644 index 0000000000..71626ac46e --- /dev/null +++ b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.tentative.w.html @@ -0,0 +1,194 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<html class="reftest-wait"> +<link rel="match" href="2d.filter.canvasFilterObject.gaussianBlur.tentative-expected.html"> +<title>Canvas test: 2d.filter.canvasFilterObject.gaussianBlur.tentative</title> +<h1 style="font-size: 20px;">2d.filter.canvasFilterObject.gaussianBlur.tentative</h1> +<p class="desc">Test CanvasFilter() with gaussianBlur.</p> +<script>pending_tests = 5;</script> + +<div style="display: grid; grid-gap: 4px; + grid-template-columns: repeat(5, max-content); + font-size: 13px; text-align: center;"> +<span> + <div>x-only</div> + <canvas id="canvas0" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script id="myWorker0" type="text/worker"> + self.onmessage = function(e) { + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.filter = new CanvasFilter({ + name: 'gaussianBlur', + stdDeviation: [4, 0], + }); + ctx.fillRect(25, 25, 50, 50); + + const bitmap = canvas.transferToImageBitmap(); + self.postMessage(bitmap, bitmap); + }; + </script> + <script type="module"> + const blob = new Blob([document.getElementById('myWorker0').textContent]); + const worker = new Worker(URL.createObjectURL(blob)); + worker.addEventListener('message', msg => { + const outputCanvas = document.getElementById('canvas0'); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(msg.data, 0, 0); + if (--pending_tests == 0) { + document.documentElement.classList.remove('reftest-wait'); + } + }); + worker.postMessage(null); + </script> +</span> + +<span> + <div>mostly-x</div> + <canvas id="canvas1" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script id="myWorker1" type="text/worker"> + self.onmessage = function(e) { + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.filter = new CanvasFilter({ + name: 'gaussianBlur', + stdDeviation: [4, 1], + }); + ctx.fillRect(25, 25, 50, 50); + + const bitmap = canvas.transferToImageBitmap(); + self.postMessage(bitmap, bitmap); + }; + </script> + <script type="module"> + const blob = new Blob([document.getElementById('myWorker1').textContent]); + const worker = new Worker(URL.createObjectURL(blob)); + worker.addEventListener('message', msg => { + const outputCanvas = document.getElementById('canvas1'); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(msg.data, 0, 0); + if (--pending_tests == 0) { + document.documentElement.classList.remove('reftest-wait'); + } + }); + worker.postMessage(null); + </script> +</span> + +<span> + <div>isotropic</div> + <canvas id="canvas2" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script id="myWorker2" type="text/worker"> + self.onmessage = function(e) { + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.filter = new CanvasFilter({ + name: 'gaussianBlur', + stdDeviation: [4, 4], + }); + ctx.fillRect(25, 25, 50, 50); + + const bitmap = canvas.transferToImageBitmap(); + self.postMessage(bitmap, bitmap); + }; + </script> + <script type="module"> + const blob = new Blob([document.getElementById('myWorker2').textContent]); + const worker = new Worker(URL.createObjectURL(blob)); + worker.addEventListener('message', msg => { + const outputCanvas = document.getElementById('canvas2'); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(msg.data, 0, 0); + if (--pending_tests == 0) { + document.documentElement.classList.remove('reftest-wait'); + } + }); + worker.postMessage(null); + </script> +</span> + +<span> + <div>mostly-y</div> + <canvas id="canvas3" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script id="myWorker3" type="text/worker"> + self.onmessage = function(e) { + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.filter = new CanvasFilter({ + name: 'gaussianBlur', + stdDeviation: [1, 4], + }); + ctx.fillRect(25, 25, 50, 50); + + const bitmap = canvas.transferToImageBitmap(); + self.postMessage(bitmap, bitmap); + }; + </script> + <script type="module"> + const blob = new Blob([document.getElementById('myWorker3').textContent]); + const worker = new Worker(URL.createObjectURL(blob)); + worker.addEventListener('message', msg => { + const outputCanvas = document.getElementById('canvas3'); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(msg.data, 0, 0); + if (--pending_tests == 0) { + document.documentElement.classList.remove('reftest-wait'); + } + }); + worker.postMessage(null); + </script> +</span> + +<span> + <div>y-only</div> + <canvas id="canvas4" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script id="myWorker4" type="text/worker"> + self.onmessage = function(e) { + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.filter = new CanvasFilter({ + name: 'gaussianBlur', + stdDeviation: [0, 4], + }); + ctx.fillRect(25, 25, 50, 50); + + const bitmap = canvas.transferToImageBitmap(); + self.postMessage(bitmap, bitmap); + }; + </script> + <script type="module"> + const blob = new Blob([document.getElementById('myWorker4').textContent]); + const worker = new Worker(URL.createObjectURL(blob)); + worker.addEventListener('message', msg => { + const outputCanvas = document.getElementById('canvas4'); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(msg.data, 0, 0); + if (--pending_tests == 0) { + document.documentElement.classList.remove('reftest-wait'); + } + }); + worker.postMessage(null); + </script> +</span> + +</div> +</html> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.x-only.tentative-expected.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.x-only.tentative-expected.html deleted file mode 100644 index e611113e42..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.x-only.tentative-expected.html +++ /dev/null @@ -1,15 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<title>Canvas test: 2d.filter.canvasFilterObject.gaussianBlur.x-only.tentative</title> -<h1>2d.filter.canvasFilterObject.gaussianBlur.x-only.tentative</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> - -<svg xmlns="http://www.w3.org/2000/svg" - width="100" height="100" - color-interpolation-filters="sRGB"> - <filter id="blur" x="-50%" y="-50%" width="200%" height="200%"> - <feGaussianBlur stdDeviation="4 0" /> - </filter> - <rect x="25" y="25" width="50" height="50" - fill="teal" filter="url(#blur)" /> -</svg> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.x-only.tentative.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.x-only.tentative.html deleted file mode 100644 index 3ed8e9ddf9..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.x-only.tentative.html +++ /dev/null @@ -1,23 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<link rel="match" href="2d.filter.canvasFilterObject.gaussianBlur.x-only.tentative-expected.html"> -<title>Canvas test: 2d.filter.canvasFilterObject.gaussianBlur.x-only.tentative</title> -<h1>2d.filter.canvasFilterObject.gaussianBlur.x-only.tentative</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script> - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.filter = new CanvasFilter({ - name: 'gaussianBlur', - stdDeviation: [4, 0], - }); - ctx.fillRect(25, 25, 50, 50); - - const outputCanvas = document.getElementById("canvas"); - outputCanvas.getContext('2d').drawImage(canvas, 0, 0); -</script> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.x-only.tentative.w.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.x-only.tentative.w.html deleted file mode 100644 index 35cbc1b365..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.x-only.tentative.w.html +++ /dev/null @@ -1,37 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<html class="reftest-wait"> -<link rel="match" href="2d.filter.canvasFilterObject.gaussianBlur.x-only.tentative-expected.html"> -<title>Canvas test: 2d.filter.canvasFilterObject.gaussianBlur.x-only.tentative</title> -<h1>2d.filter.canvasFilterObject.gaussianBlur.x-only.tentative</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script id='myWorker' type='text/worker'> - self.onmessage = function(e) { - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.filter = new CanvasFilter({ - name: 'gaussianBlur', - stdDeviation: [4, 0], - }); - ctx.fillRect(25, 25, 50, 50); - - const bitmap = canvas.transferToImageBitmap(); - self.postMessage(bitmap, bitmap); - }; -</script> -<script> - const blob = new Blob([document.getElementById('myWorker').textContent]); - const worker = new Worker(URL.createObjectURL(blob)); - worker.addEventListener('message', msg => { - const outputCtx = document.getElementById("canvas").getContext('2d'); - outputCtx.drawImage(msg.data, 0, 0); - document.documentElement.classList.remove("reftest-wait"); - }); - worker.postMessage(null); -</script> -</html> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.y-only.tentative-expected.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.y-only.tentative-expected.html deleted file mode 100644 index c6d915cb07..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.y-only.tentative-expected.html +++ /dev/null @@ -1,15 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<title>Canvas test: 2d.filter.canvasFilterObject.gaussianBlur.y-only.tentative</title> -<h1>2d.filter.canvasFilterObject.gaussianBlur.y-only.tentative</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> - -<svg xmlns="http://www.w3.org/2000/svg" - width="100" height="100" - color-interpolation-filters="sRGB"> - <filter id="blur" x="-50%" y="-50%" width="200%" height="200%"> - <feGaussianBlur stdDeviation="0 4" /> - </filter> - <rect x="25" y="25" width="50" height="50" - fill="teal" filter="url(#blur)" /> -</svg> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.y-only.tentative.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.y-only.tentative.html deleted file mode 100644 index f563ad9d77..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.y-only.tentative.html +++ /dev/null @@ -1,23 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<link rel="match" href="2d.filter.canvasFilterObject.gaussianBlur.y-only.tentative-expected.html"> -<title>Canvas test: 2d.filter.canvasFilterObject.gaussianBlur.y-only.tentative</title> -<h1>2d.filter.canvasFilterObject.gaussianBlur.y-only.tentative</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script> - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.filter = new CanvasFilter({ - name: 'gaussianBlur', - stdDeviation: [0, 4], - }); - ctx.fillRect(25, 25, 50, 50); - - const outputCanvas = document.getElementById("canvas"); - outputCanvas.getContext('2d').drawImage(canvas, 0, 0); -</script> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.y-only.tentative.w.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.y-only.tentative.w.html deleted file mode 100644 index 171a41caa8..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.canvasFilterObject.gaussianBlur.y-only.tentative.w.html +++ /dev/null @@ -1,37 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<html class="reftest-wait"> -<link rel="match" href="2d.filter.canvasFilterObject.gaussianBlur.y-only.tentative-expected.html"> -<title>Canvas test: 2d.filter.canvasFilterObject.gaussianBlur.y-only.tentative</title> -<h1>2d.filter.canvasFilterObject.gaussianBlur.y-only.tentative</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script id='myWorker' type='text/worker'> - self.onmessage = function(e) { - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.filter = new CanvasFilter({ - name: 'gaussianBlur', - stdDeviation: [0, 4], - }); - ctx.fillRect(25, 25, 50, 50); - - const bitmap = canvas.transferToImageBitmap(); - self.postMessage(bitmap, bitmap); - }; -</script> -<script> - const blob = new Blob([document.getElementById('myWorker').textContent]); - const worker = new Worker(URL.createObjectURL(blob)); - worker.addEventListener('message', msg => { - const outputCtx = document.getElementById("canvas").getContext('2d'); - outputCtx.drawImage(msg.data, 0, 0); - document.documentElement.classList.remove("reftest-wait"); - }); - worker.postMessage(null); -</script> -</html> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur-expected.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur-expected.html new file mode 100644 index 0000000000..f24e9d0dba --- /dev/null +++ b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur-expected.html @@ -0,0 +1,85 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<title>Canvas test: 2d.filter.layers.gaussianBlur</title> +<h1 style="font-size: 20px;">2d.filter.layers.gaussianBlur</h1> +<p class="desc">Test CanvasFilter() with gaussianBlur.</p> + +<div style="display: grid; grid-gap: 4px; + grid-template-columns: repeat(5, max-content); + font-size: 13px; text-align: center;"> +<span> + <div>x-only</div> + <div style="width: 100px; height: 100px; outline: 1px solid"> + <svg xmlns="http://www.w3.org/2000/svg" + width="100" height="100" + color-interpolation-filters="sRGB"> + <filter id="blur0" x="-50%" y="-50%" width="200%" height="200%"> + <feGaussianBlur stdDeviation="4 0" /> + </filter> + <rect x="25" y="25" width="50" height="50" + fill="teal" filter="url(#blur0)" /> + </svg> + </div> +</span> + +<span> + <div>mostly-x</div> + <div style="width: 100px; height: 100px; outline: 1px solid"> + <svg xmlns="http://www.w3.org/2000/svg" + width="100" height="100" + color-interpolation-filters="sRGB"> + <filter id="blur1" x="-50%" y="-50%" width="200%" height="200%"> + <feGaussianBlur stdDeviation="4 1" /> + </filter> + <rect x="25" y="25" width="50" height="50" + fill="teal" filter="url(#blur1)" /> + </svg> + </div> +</span> + +<span> + <div>isotropic</div> + <div style="width: 100px; height: 100px; outline: 1px solid"> + <svg xmlns="http://www.w3.org/2000/svg" + width="100" height="100" + color-interpolation-filters="sRGB"> + <filter id="blur2" x="-50%" y="-50%" width="200%" height="200%"> + <feGaussianBlur stdDeviation="4 4" /> + </filter> + <rect x="25" y="25" width="50" height="50" + fill="teal" filter="url(#blur2)" /> + </svg> + </div> +</span> + +<span> + <div>mostly-y</div> + <div style="width: 100px; height: 100px; outline: 1px solid"> + <svg xmlns="http://www.w3.org/2000/svg" + width="100" height="100" + color-interpolation-filters="sRGB"> + <filter id="blur3" x="-50%" y="-50%" width="200%" height="200%"> + <feGaussianBlur stdDeviation="1 4" /> + </filter> + <rect x="25" y="25" width="50" height="50" + fill="teal" filter="url(#blur3)" /> + </svg> + </div> +</span> + +<span> + <div>y-only</div> + <div style="width: 100px; height: 100px; outline: 1px solid"> + <svg xmlns="http://www.w3.org/2000/svg" + width="100" height="100" + color-interpolation-filters="sRGB"> + <filter id="blur4" x="-50%" y="-50%" width="200%" height="200%"> + <feGaussianBlur stdDeviation="0 4" /> + </filter> + <rect x="25" y="25" width="50" height="50" + fill="teal" filter="url(#blur4)" /> + </svg> + </div> +</span> + +</div> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.html new file mode 100644 index 0000000000..a51fe32008 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.html @@ -0,0 +1,126 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<link rel="match" href="2d.filter.layers.gaussianBlur-expected.html"> +<title>Canvas test: 2d.filter.layers.gaussianBlur</title> +<h1 style="font-size: 20px;">2d.filter.layers.gaussianBlur</h1> +<p class="desc">Test CanvasFilter() with gaussianBlur.</p> + +<div style="display: grid; grid-gap: 4px; + grid-template-columns: repeat(5, max-content); + font-size: 13px; text-align: center;"> +<span> + <div>x-only</div> + <canvas id="canvas0" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script type="module"> + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.beginLayer({filter: { + name: 'gaussianBlur', + stdDeviation: [4, 0], + }}); + ctx.fillRect(25, 25, 50, 50); + ctx.endLayer(); + + const outputCanvas = document.getElementById("canvas0"); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(canvas, 0, 0); + </script> +</span> + +<span> + <div>mostly-x</div> + <canvas id="canvas1" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script type="module"> + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.beginLayer({filter: { + name: 'gaussianBlur', + stdDeviation: [4, 1], + }}); + ctx.fillRect(25, 25, 50, 50); + ctx.endLayer(); + + const outputCanvas = document.getElementById("canvas1"); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(canvas, 0, 0); + </script> +</span> + +<span> + <div>isotropic</div> + <canvas id="canvas2" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script type="module"> + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.beginLayer({filter: { + name: 'gaussianBlur', + stdDeviation: [4, 4], + }}); + ctx.fillRect(25, 25, 50, 50); + ctx.endLayer(); + + const outputCanvas = document.getElementById("canvas2"); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(canvas, 0, 0); + </script> +</span> + +<span> + <div>mostly-y</div> + <canvas id="canvas3" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script type="module"> + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.beginLayer({filter: { + name: 'gaussianBlur', + stdDeviation: [1, 4], + }}); + ctx.fillRect(25, 25, 50, 50); + ctx.endLayer(); + + const outputCanvas = document.getElementById("canvas3"); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(canvas, 0, 0); + </script> +</span> + +<span> + <div>y-only</div> + <canvas id="canvas4" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script type="module"> + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.beginLayer({filter: { + name: 'gaussianBlur', + stdDeviation: [0, 4], + }}); + ctx.fillRect(25, 25, 50, 50); + ctx.endLayer(); + + const outputCanvas = document.getElementById("canvas4"); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(canvas, 0, 0); + </script> +</span> + +</div> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.isotropic-expected.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.isotropic-expected.html deleted file mode 100644 index 4f93754862..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.isotropic-expected.html +++ /dev/null @@ -1,15 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<title>Canvas test: 2d.filter.layers.gaussianBlur.isotropic</title> -<h1>2d.filter.layers.gaussianBlur.isotropic</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> - -<svg xmlns="http://www.w3.org/2000/svg" - width="100" height="100" - color-interpolation-filters="sRGB"> - <filter id="blur" x="-50%" y="-50%" width="200%" height="200%"> - <feGaussianBlur stdDeviation="4 4" /> - </filter> - <rect x="25" y="25" width="50" height="50" - fill="teal" filter="url(#blur)" /> -</svg> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.isotropic.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.isotropic.html deleted file mode 100644 index 50a98df1be..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.isotropic.html +++ /dev/null @@ -1,24 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<link rel="match" href="2d.filter.layers.gaussianBlur.isotropic-expected.html"> -<title>Canvas test: 2d.filter.layers.gaussianBlur.isotropic</title> -<h1>2d.filter.layers.gaussianBlur.isotropic</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script> - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.beginLayer({filter: { - name: 'gaussianBlur', - stdDeviation: [4, 4], - }}); - ctx.fillRect(25, 25, 50, 50); - ctx.endLayer(); - - const outputCanvas = document.getElementById("canvas"); - outputCanvas.getContext('2d').drawImage(canvas, 0, 0); -</script> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.isotropic.w.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.isotropic.w.html deleted file mode 100644 index a68b8e78a2..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.isotropic.w.html +++ /dev/null @@ -1,38 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<html class="reftest-wait"> -<link rel="match" href="2d.filter.layers.gaussianBlur.isotropic-expected.html"> -<title>Canvas test: 2d.filter.layers.gaussianBlur.isotropic</title> -<h1>2d.filter.layers.gaussianBlur.isotropic</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script id='myWorker' type='text/worker'> - self.onmessage = function(e) { - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.beginLayer({filter: { - name: 'gaussianBlur', - stdDeviation: [4, 4], - }}); - ctx.fillRect(25, 25, 50, 50); - ctx.endLayer(); - - const bitmap = canvas.transferToImageBitmap(); - self.postMessage(bitmap, bitmap); - }; -</script> -<script> - const blob = new Blob([document.getElementById('myWorker').textContent]); - const worker = new Worker(URL.createObjectURL(blob)); - worker.addEventListener('message', msg => { - const outputCtx = document.getElementById("canvas").getContext('2d'); - outputCtx.drawImage(msg.data, 0, 0); - document.documentElement.classList.remove("reftest-wait"); - }); - worker.postMessage(null); -</script> -</html> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.mostly-x-expected.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.mostly-x-expected.html deleted file mode 100644 index 255270c192..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.mostly-x-expected.html +++ /dev/null @@ -1,15 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<title>Canvas test: 2d.filter.layers.gaussianBlur.mostly-x</title> -<h1>2d.filter.layers.gaussianBlur.mostly-x</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> - -<svg xmlns="http://www.w3.org/2000/svg" - width="100" height="100" - color-interpolation-filters="sRGB"> - <filter id="blur" x="-50%" y="-50%" width="200%" height="200%"> - <feGaussianBlur stdDeviation="4 1" /> - </filter> - <rect x="25" y="25" width="50" height="50" - fill="teal" filter="url(#blur)" /> -</svg> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.mostly-x.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.mostly-x.html deleted file mode 100644 index efc634796c..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.mostly-x.html +++ /dev/null @@ -1,24 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<link rel="match" href="2d.filter.layers.gaussianBlur.mostly-x-expected.html"> -<title>Canvas test: 2d.filter.layers.gaussianBlur.mostly-x</title> -<h1>2d.filter.layers.gaussianBlur.mostly-x</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script> - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.beginLayer({filter: { - name: 'gaussianBlur', - stdDeviation: [4, 1], - }}); - ctx.fillRect(25, 25, 50, 50); - ctx.endLayer(); - - const outputCanvas = document.getElementById("canvas"); - outputCanvas.getContext('2d').drawImage(canvas, 0, 0); -</script> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.mostly-x.w.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.mostly-x.w.html deleted file mode 100644 index 7d20d78503..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.mostly-x.w.html +++ /dev/null @@ -1,38 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<html class="reftest-wait"> -<link rel="match" href="2d.filter.layers.gaussianBlur.mostly-x-expected.html"> -<title>Canvas test: 2d.filter.layers.gaussianBlur.mostly-x</title> -<h1>2d.filter.layers.gaussianBlur.mostly-x</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script id='myWorker' type='text/worker'> - self.onmessage = function(e) { - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.beginLayer({filter: { - name: 'gaussianBlur', - stdDeviation: [4, 1], - }}); - ctx.fillRect(25, 25, 50, 50); - ctx.endLayer(); - - const bitmap = canvas.transferToImageBitmap(); - self.postMessage(bitmap, bitmap); - }; -</script> -<script> - const blob = new Blob([document.getElementById('myWorker').textContent]); - const worker = new Worker(URL.createObjectURL(blob)); - worker.addEventListener('message', msg => { - const outputCtx = document.getElementById("canvas").getContext('2d'); - outputCtx.drawImage(msg.data, 0, 0); - document.documentElement.classList.remove("reftest-wait"); - }); - worker.postMessage(null); -</script> -</html> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.mostly-y-expected.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.mostly-y-expected.html deleted file mode 100644 index 76a46b1533..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.mostly-y-expected.html +++ /dev/null @@ -1,15 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<title>Canvas test: 2d.filter.layers.gaussianBlur.mostly-y</title> -<h1>2d.filter.layers.gaussianBlur.mostly-y</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> - -<svg xmlns="http://www.w3.org/2000/svg" - width="100" height="100" - color-interpolation-filters="sRGB"> - <filter id="blur" x="-50%" y="-50%" width="200%" height="200%"> - <feGaussianBlur stdDeviation="1 4" /> - </filter> - <rect x="25" y="25" width="50" height="50" - fill="teal" filter="url(#blur)" /> -</svg> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.mostly-y.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.mostly-y.html deleted file mode 100644 index bdc6e66fe5..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.mostly-y.html +++ /dev/null @@ -1,24 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<link rel="match" href="2d.filter.layers.gaussianBlur.mostly-y-expected.html"> -<title>Canvas test: 2d.filter.layers.gaussianBlur.mostly-y</title> -<h1>2d.filter.layers.gaussianBlur.mostly-y</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script> - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.beginLayer({filter: { - name: 'gaussianBlur', - stdDeviation: [1, 4], - }}); - ctx.fillRect(25, 25, 50, 50); - ctx.endLayer(); - - const outputCanvas = document.getElementById("canvas"); - outputCanvas.getContext('2d').drawImage(canvas, 0, 0); -</script> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.mostly-y.w.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.mostly-y.w.html deleted file mode 100644 index dfd6438b19..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.mostly-y.w.html +++ /dev/null @@ -1,38 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<html class="reftest-wait"> -<link rel="match" href="2d.filter.layers.gaussianBlur.mostly-y-expected.html"> -<title>Canvas test: 2d.filter.layers.gaussianBlur.mostly-y</title> -<h1>2d.filter.layers.gaussianBlur.mostly-y</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script id='myWorker' type='text/worker'> - self.onmessage = function(e) { - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.beginLayer({filter: { - name: 'gaussianBlur', - stdDeviation: [1, 4], - }}); - ctx.fillRect(25, 25, 50, 50); - ctx.endLayer(); - - const bitmap = canvas.transferToImageBitmap(); - self.postMessage(bitmap, bitmap); - }; -</script> -<script> - const blob = new Blob([document.getElementById('myWorker').textContent]); - const worker = new Worker(URL.createObjectURL(blob)); - worker.addEventListener('message', msg => { - const outputCtx = document.getElementById("canvas").getContext('2d'); - outputCtx.drawImage(msg.data, 0, 0); - document.documentElement.classList.remove("reftest-wait"); - }); - worker.postMessage(null); -</script> -</html> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.w.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.w.html new file mode 100644 index 0000000000..10ea8baa10 --- /dev/null +++ b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.w.html @@ -0,0 +1,199 @@ +<!DOCTYPE html> +<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> +<html class="reftest-wait"> +<link rel="match" href="2d.filter.layers.gaussianBlur-expected.html"> +<title>Canvas test: 2d.filter.layers.gaussianBlur</title> +<h1 style="font-size: 20px;">2d.filter.layers.gaussianBlur</h1> +<p class="desc">Test CanvasFilter() with gaussianBlur.</p> +<script>pending_tests = 5;</script> + +<div style="display: grid; grid-gap: 4px; + grid-template-columns: repeat(5, max-content); + font-size: 13px; text-align: center;"> +<span> + <div>x-only</div> + <canvas id="canvas0" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script id="myWorker0" type="text/worker"> + self.onmessage = function(e) { + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.beginLayer({filter: { + name: 'gaussianBlur', + stdDeviation: [4, 0], + }}); + ctx.fillRect(25, 25, 50, 50); + ctx.endLayer(); + + const bitmap = canvas.transferToImageBitmap(); + self.postMessage(bitmap, bitmap); + }; + </script> + <script type="module"> + const blob = new Blob([document.getElementById('myWorker0').textContent]); + const worker = new Worker(URL.createObjectURL(blob)); + worker.addEventListener('message', msg => { + const outputCanvas = document.getElementById('canvas0'); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(msg.data, 0, 0); + if (--pending_tests == 0) { + document.documentElement.classList.remove('reftest-wait'); + } + }); + worker.postMessage(null); + </script> +</span> + +<span> + <div>mostly-x</div> + <canvas id="canvas1" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script id="myWorker1" type="text/worker"> + self.onmessage = function(e) { + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.beginLayer({filter: { + name: 'gaussianBlur', + stdDeviation: [4, 1], + }}); + ctx.fillRect(25, 25, 50, 50); + ctx.endLayer(); + + const bitmap = canvas.transferToImageBitmap(); + self.postMessage(bitmap, bitmap); + }; + </script> + <script type="module"> + const blob = new Blob([document.getElementById('myWorker1').textContent]); + const worker = new Worker(URL.createObjectURL(blob)); + worker.addEventListener('message', msg => { + const outputCanvas = document.getElementById('canvas1'); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(msg.data, 0, 0); + if (--pending_tests == 0) { + document.documentElement.classList.remove('reftest-wait'); + } + }); + worker.postMessage(null); + </script> +</span> + +<span> + <div>isotropic</div> + <canvas id="canvas2" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script id="myWorker2" type="text/worker"> + self.onmessage = function(e) { + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.beginLayer({filter: { + name: 'gaussianBlur', + stdDeviation: [4, 4], + }}); + ctx.fillRect(25, 25, 50, 50); + ctx.endLayer(); + + const bitmap = canvas.transferToImageBitmap(); + self.postMessage(bitmap, bitmap); + }; + </script> + <script type="module"> + const blob = new Blob([document.getElementById('myWorker2').textContent]); + const worker = new Worker(URL.createObjectURL(blob)); + worker.addEventListener('message', msg => { + const outputCanvas = document.getElementById('canvas2'); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(msg.data, 0, 0); + if (--pending_tests == 0) { + document.documentElement.classList.remove('reftest-wait'); + } + }); + worker.postMessage(null); + </script> +</span> + +<span> + <div>mostly-y</div> + <canvas id="canvas3" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script id="myWorker3" type="text/worker"> + self.onmessage = function(e) { + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.beginLayer({filter: { + name: 'gaussianBlur', + stdDeviation: [1, 4], + }}); + ctx.fillRect(25, 25, 50, 50); + ctx.endLayer(); + + const bitmap = canvas.transferToImageBitmap(); + self.postMessage(bitmap, bitmap); + }; + </script> + <script type="module"> + const blob = new Blob([document.getElementById('myWorker3').textContent]); + const worker = new Worker(URL.createObjectURL(blob)); + worker.addEventListener('message', msg => { + const outputCanvas = document.getElementById('canvas3'); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(msg.data, 0, 0); + if (--pending_tests == 0) { + document.documentElement.classList.remove('reftest-wait'); + } + }); + worker.postMessage(null); + </script> +</span> + +<span> + <div>y-only</div> + <canvas id="canvas4" width="100" height="100" style="outline: 1px solid"> + <p class="fallback">FAIL (fallback content)</p> + </canvas> + <script id="myWorker4" type="text/worker"> + self.onmessage = function(e) { + const canvas = new OffscreenCanvas(100, 100); + const ctx = canvas.getContext('2d'); + + ctx.fillStyle = 'teal'; + ctx.beginLayer({filter: { + name: 'gaussianBlur', + stdDeviation: [0, 4], + }}); + ctx.fillRect(25, 25, 50, 50); + ctx.endLayer(); + + const bitmap = canvas.transferToImageBitmap(); + self.postMessage(bitmap, bitmap); + }; + </script> + <script type="module"> + const blob = new Blob([document.getElementById('myWorker4').textContent]); + const worker = new Worker(URL.createObjectURL(blob)); + worker.addEventListener('message', msg => { + const outputCanvas = document.getElementById('canvas4'); + const outputCtx = outputCanvas.getContext('2d'); + outputCtx.drawImage(msg.data, 0, 0); + if (--pending_tests == 0) { + document.documentElement.classList.remove('reftest-wait'); + } + }); + worker.postMessage(null); + </script> +</span> + +</div> +</html> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.x-only-expected.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.x-only-expected.html deleted file mode 100644 index 26741f9847..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.x-only-expected.html +++ /dev/null @@ -1,15 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<title>Canvas test: 2d.filter.layers.gaussianBlur.x-only</title> -<h1>2d.filter.layers.gaussianBlur.x-only</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> - -<svg xmlns="http://www.w3.org/2000/svg" - width="100" height="100" - color-interpolation-filters="sRGB"> - <filter id="blur" x="-50%" y="-50%" width="200%" height="200%"> - <feGaussianBlur stdDeviation="4 0" /> - </filter> - <rect x="25" y="25" width="50" height="50" - fill="teal" filter="url(#blur)" /> -</svg> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.x-only.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.x-only.html deleted file mode 100644 index 0d42acb8b5..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.x-only.html +++ /dev/null @@ -1,24 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<link rel="match" href="2d.filter.layers.gaussianBlur.x-only-expected.html"> -<title>Canvas test: 2d.filter.layers.gaussianBlur.x-only</title> -<h1>2d.filter.layers.gaussianBlur.x-only</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script> - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.beginLayer({filter: { - name: 'gaussianBlur', - stdDeviation: [4, 0], - }}); - ctx.fillRect(25, 25, 50, 50); - ctx.endLayer(); - - const outputCanvas = document.getElementById("canvas"); - outputCanvas.getContext('2d').drawImage(canvas, 0, 0); -</script> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.x-only.w.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.x-only.w.html deleted file mode 100644 index b235c7ad38..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.x-only.w.html +++ /dev/null @@ -1,38 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<html class="reftest-wait"> -<link rel="match" href="2d.filter.layers.gaussianBlur.x-only-expected.html"> -<title>Canvas test: 2d.filter.layers.gaussianBlur.x-only</title> -<h1>2d.filter.layers.gaussianBlur.x-only</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script id='myWorker' type='text/worker'> - self.onmessage = function(e) { - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.beginLayer({filter: { - name: 'gaussianBlur', - stdDeviation: [4, 0], - }}); - ctx.fillRect(25, 25, 50, 50); - ctx.endLayer(); - - const bitmap = canvas.transferToImageBitmap(); - self.postMessage(bitmap, bitmap); - }; -</script> -<script> - const blob = new Blob([document.getElementById('myWorker').textContent]); - const worker = new Worker(URL.createObjectURL(blob)); - worker.addEventListener('message', msg => { - const outputCtx = document.getElementById("canvas").getContext('2d'); - outputCtx.drawImage(msg.data, 0, 0); - document.documentElement.classList.remove("reftest-wait"); - }); - worker.postMessage(null); -</script> -</html> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.y-only-expected.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.y-only-expected.html deleted file mode 100644 index d00eec6b57..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.y-only-expected.html +++ /dev/null @@ -1,15 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<title>Canvas test: 2d.filter.layers.gaussianBlur.y-only</title> -<h1>2d.filter.layers.gaussianBlur.y-only</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> - -<svg xmlns="http://www.w3.org/2000/svg" - width="100" height="100" - color-interpolation-filters="sRGB"> - <filter id="blur" x="-50%" y="-50%" width="200%" height="200%"> - <feGaussianBlur stdDeviation="0 4" /> - </filter> - <rect x="25" y="25" width="50" height="50" - fill="teal" filter="url(#blur)" /> -</svg> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.y-only.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.y-only.html deleted file mode 100644 index c9bc85d699..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.y-only.html +++ /dev/null @@ -1,24 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<link rel="match" href="2d.filter.layers.gaussianBlur.y-only-expected.html"> -<title>Canvas test: 2d.filter.layers.gaussianBlur.y-only</title> -<h1>2d.filter.layers.gaussianBlur.y-only</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script> - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.beginLayer({filter: { - name: 'gaussianBlur', - stdDeviation: [0, 4], - }}); - ctx.fillRect(25, 25, 50, 50); - ctx.endLayer(); - - const outputCanvas = document.getElementById("canvas"); - outputCanvas.getContext('2d').drawImage(canvas, 0, 0); -</script> diff --git a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.y-only.w.html b/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.y-only.w.html deleted file mode 100644 index 5deb96c255..0000000000 --- a/testing/web-platform/tests/html/canvas/offscreen/filters/2d.filter.layers.gaussianBlur.y-only.w.html +++ /dev/null @@ -1,38 +0,0 @@ -<!DOCTYPE html> -<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. --> -<html class="reftest-wait"> -<link rel="match" href="2d.filter.layers.gaussianBlur.y-only-expected.html"> -<title>Canvas test: 2d.filter.layers.gaussianBlur.y-only</title> -<h1>2d.filter.layers.gaussianBlur.y-only</h1> -<p class="desc">Test CanvasFilter() with gaussianBlur.</p> -<canvas id="canvas" width="100" height="100"> - <p class="fallback">FAIL (fallback content)</p> -</canvas> -<script id='myWorker' type='text/worker'> - self.onmessage = function(e) { - const canvas = new OffscreenCanvas(100, 100); - const ctx = canvas.getContext('2d'); - - ctx.fillStyle = 'teal'; - ctx.beginLayer({filter: { - name: 'gaussianBlur', - stdDeviation: [0, 4], - }}); - ctx.fillRect(25, 25, 50, 50); - ctx.endLayer(); - - const bitmap = canvas.transferToImageBitmap(); - self.postMessage(bitmap, bitmap); - }; -</script> -<script> - const blob = new Blob([document.getElementById('myWorker').textContent]); - const worker = new Worker(URL.createObjectURL(blob)); - worker.addEventListener('message', msg => { - const outputCtx = document.getElementById("canvas").getContext('2d'); - outputCtx.drawImage(msg.data, 0, 0); - document.documentElement.classList.remove("reftest-wait"); - }); - worker.postMessage(null); -</script> -</html> |