Add test for clear.
Depends on D171020
Differential Revision: https://phabricator.services.mozilla.com/D171025
bugzilla-url: https://bugzilla.mozilla.org/show_bug.cgi?id=1816775
gecko-commit: 4cf858f7a3d6c5c3dea15c8d7eae099965234363
gecko-reviewers: lsalzman
diff --git a/html/canvas/element/compositing/2d.composite.canvas.clear.html b/html/canvas/element/compositing/2d.composite.canvas.clear.html
new file mode 100644
index 0000000..4068559
--- /dev/null
+++ b/html/canvas/element/compositing/2d.composite.canvas.clear.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
+<title>Canvas test: 2d.composite.canvas.clear</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/html/canvas/resources/canvas-tests.js"></script>
+<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css">
+<body class="show_output">
+
+<h1>2d.composite.canvas.clear</h1>
+<p class="desc"></p>
+
+
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="2d.composite.canvas.clear.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("");
+_addTest(function(canvas, ctx) {
+
+
+var canvas2 = document.createElement('canvas');
+canvas2.width = canvas.width;
+canvas2.height = canvas.height;
+var ctx2 = canvas2.getContext('2d');
+ctx2.drawImage(document.getElementById('yellow75.png'), 0, 0);
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'clear';
+ctx.drawImage(canvas2, 0, 0);
+_assertPixelApprox(canvas, 50,25, 0,0,0,0, 5);
+
+
+});
+</script>
+<img src="/images/yellow75.png" id="yellow75.png" class="resource">
+
diff --git a/html/canvas/element/compositing/2d.composite.canvas.clear.png b/html/canvas/element/compositing/2d.composite.canvas.clear.png
new file mode 100644
index 0000000..eeedd0f
--- /dev/null
+++ b/html/canvas/element/compositing/2d.composite.canvas.clear.png
Binary files differ
diff --git a/html/canvas/element/compositing/2d.composite.clip.clear.html b/html/canvas/element/compositing/2d.composite.clip.clear.html
new file mode 100644
index 0000000..1757870
--- /dev/null
+++ b/html/canvas/element/compositing/2d.composite.clip.clear.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
+<title>Canvas test: 2d.composite.clip.clear</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/html/canvas/resources/canvas-tests.js"></script>
+<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css">
+<body class="show_output">
+
+<h1>2d.composite.clip.clear</h1>
+<p class="desc">fill() does not affect pixels outside the clip region.</p>
+
+
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="/images/green-100x50.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("fill() does not affect pixels outside the clip region.");
+_addTest(function(canvas, ctx) {
+
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'clear';
+ctx.rect(-20, -20, 10, 10);
+ctx.clip();
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+_assertPixel(canvas, 25,25, 0,255,0,255);
+_assertPixel(canvas, 75,25, 0,255,0,255);
+
+
+});
+</script>
+
diff --git a/html/canvas/element/compositing/2d.composite.image.clear.html b/html/canvas/element/compositing/2d.composite.image.clear.html
new file mode 100644
index 0000000..b9ab69b
--- /dev/null
+++ b/html/canvas/element/compositing/2d.composite.image.clear.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
+<title>Canvas test: 2d.composite.image.clear</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/html/canvas/resources/canvas-tests.js"></script>
+<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css">
+<body class="show_output">
+
+<h1>2d.composite.image.clear</h1>
+<p class="desc"></p>
+
+
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="2d.composite.image.clear.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("");
+_addTest(function(canvas, ctx) {
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'clear';
+ctx.drawImage(document.getElementById('yellow75.png'), 0, 0);
+_assertPixelApprox(canvas, 50,25, 0,0,0,0, 5);
+
+
+});
+</script>
+<img src="/images/yellow75.png" id="yellow75.png" class="resource">
+
diff --git a/html/canvas/element/compositing/2d.composite.image.clear.png b/html/canvas/element/compositing/2d.composite.image.clear.png
new file mode 100644
index 0000000..eeedd0f
--- /dev/null
+++ b/html/canvas/element/compositing/2d.composite.image.clear.png
Binary files differ
diff --git a/html/canvas/element/compositing/2d.composite.solid.clear.html b/html/canvas/element/compositing/2d.composite.solid.clear.html
new file mode 100644
index 0000000..e270df3
--- /dev/null
+++ b/html/canvas/element/compositing/2d.composite.solid.clear.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
+<title>Canvas test: 2d.composite.solid.clear</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/html/canvas/resources/canvas-tests.js"></script>
+<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css">
+<body class="show_output">
+
+<h1>2d.composite.solid.clear</h1>
+<p class="desc"></p>
+
+
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="2d.composite.solid.clear.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("");
+_addTest(function(canvas, ctx) {
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'clear';
+ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+_assertPixelApprox(canvas, 50,25, 0,0,0,0, 5);
+
+
+});
+</script>
+
diff --git a/html/canvas/element/compositing/2d.composite.solid.clear.png b/html/canvas/element/compositing/2d.composite.solid.clear.png
new file mode 100644
index 0000000..eeedd0f
--- /dev/null
+++ b/html/canvas/element/compositing/2d.composite.solid.clear.png
Binary files differ
diff --git a/html/canvas/element/compositing/2d.composite.transparent.clear.html b/html/canvas/element/compositing/2d.composite.transparent.clear.html
new file mode 100644
index 0000000..606d925
--- /dev/null
+++ b/html/canvas/element/compositing/2d.composite.transparent.clear.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
+<title>Canvas test: 2d.composite.transparent.clear</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/html/canvas/resources/canvas-tests.js"></script>
+<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css">
+<body class="show_output">
+
+<h1>2d.composite.transparent.clear</h1>
+<p class="desc"></p>
+
+
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+<p class="output expectedtext">Expected output:<p><img src="2d.composite.transparent.clear.png" class="output expected" id="expected" alt="">
+<ul id="d"></ul>
+<script>
+var t = async_test("");
+_addTest(function(canvas, ctx) {
+
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'clear';
+ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
+ctx.fillRect(0, 0, 100, 50);
+_assertPixelApprox(canvas, 50,25, 0,0,0,0, 5);
+
+
+});
+</script>
+
diff --git a/html/canvas/element/compositing/2d.composite.transparent.clear.png b/html/canvas/element/compositing/2d.composite.transparent.clear.png
new file mode 100644
index 0000000..eeedd0f
--- /dev/null
+++ b/html/canvas/element/compositing/2d.composite.transparent.clear.png
Binary files differ
diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.clear.html b/html/canvas/offscreen/compositing/2d.composite.canvas.clear.html
new file mode 100644
index 0000000..0dad085
--- /dev/null
+++ b/html/canvas/offscreen/compositing/2d.composite.canvas.clear.html
@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
+<title>OffscreenCanvas test: 2d.composite.canvas.clear</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/html/canvas/resources/canvas-tests.js"></script>
+
+<h1>2d.composite.canvas.clear</h1>
+<p class="desc"></p>
+
+
+<script>
+var t = async_test("");
+var t_pass = t.done.bind(t);
+var t_fail = t.step_func(function(reason) {
+ throw reason;
+});
+t.step(function() {
+
+var canvas = new OffscreenCanvas(100, 50);
+var ctx = canvas.getContext('2d');
+
+
+var offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height);
+var ctx2 = offscreenCanvas2.getContext('2d');
+var promise = new Promise(function(resolve, reject) {
+ var xhr = new XMLHttpRequest();
+ xhr.open("GET", '/images/yellow75.png');
+ xhr.responseType = 'blob';
+ xhr.send();
+ xhr.onload = function() {
+ resolve(xhr.response);
+ };
+});
+promise.then(function(response) {
+ createImageBitmap(response).then(bitmap => {
+ ctx2.drawImage(bitmap, 0, 0);
+ ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ ctx.fillRect(0, 0, 100, 50);
+ ctx.globalCompositeOperation = 'clear';
+ ctx.drawImage(offscreenCanvas2, 0, 0);
+ _assertPixelApprox(canvas, 50,25, 0,0,0,0, 5);
+ }, t_fail);
+}).then(t_pass, t_fail);
+
+});
+</script>
diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.clear.worker.js b/html/canvas/offscreen/compositing/2d.composite.canvas.clear.worker.js
new file mode 100644
index 0000000..a06cbdc
--- /dev/null
+++ b/html/canvas/offscreen/compositing/2d.composite.canvas.clear.worker.js
@@ -0,0 +1,43 @@
+// DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py.
+// OffscreenCanvas test in a worker:2d.composite.canvas.clear
+// Description:
+// Note:
+
+importScripts("/resources/testharness.js");
+importScripts("/html/canvas/resources/canvas-tests.js");
+
+var t = async_test("");
+var t_pass = t.done.bind(t);
+var t_fail = t.step_func(function(reason) {
+ throw reason;
+});
+t.step(function() {
+
+var canvas = new OffscreenCanvas(100, 50);
+var ctx = canvas.getContext('2d');
+
+
+var offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height);
+var ctx2 = offscreenCanvas2.getContext('2d');
+var promise = new Promise(function(resolve, reject) {
+ var xhr = new XMLHttpRequest();
+ xhr.open("GET", '/images/yellow75.png');
+ xhr.responseType = 'blob';
+ xhr.send();
+ xhr.onload = function() {
+ resolve(xhr.response);
+ };
+});
+promise.then(function(response) {
+ createImageBitmap(response).then(bitmap => {
+ ctx2.drawImage(bitmap, 0, 0);
+ ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ ctx.fillRect(0, 0, 100, 50);
+ ctx.globalCompositeOperation = 'clear';
+ ctx.drawImage(offscreenCanvas2, 0, 0);
+ _assertPixelApprox(canvas, 50,25, 0,0,0,0, 5);
+ }, t_fail);
+}).then(t_pass, t_fail);
+
+});
+done();
diff --git a/html/canvas/offscreen/compositing/2d.composite.clip.clear.html b/html/canvas/offscreen/compositing/2d.composite.clip.clear.html
new file mode 100644
index 0000000..842bcf1
--- /dev/null
+++ b/html/canvas/offscreen/compositing/2d.composite.clip.clear.html
@@ -0,0 +1,36 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
+<title>OffscreenCanvas test: 2d.composite.clip.clear</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/html/canvas/resources/canvas-tests.js"></script>
+
+<h1>2d.composite.clip.clear</h1>
+<p class="desc">fill() does not affect pixels outside the clip region.</p>
+
+
+<script>
+var t = async_test("fill() does not affect pixels outside the clip region.");
+var t_pass = t.done.bind(t);
+var t_fail = t.step_func(function(reason) {
+ throw reason;
+});
+t.step(function() {
+
+var canvas = new OffscreenCanvas(100, 50);
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'clear';
+ctx.rect(-20, -20, 10, 10);
+ctx.clip();
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+_assertPixel(canvas, 25,25, 0,255,0,255);
+_assertPixel(canvas, 75,25, 0,255,0,255);
+t.done();
+
+});
+</script>
diff --git a/html/canvas/offscreen/compositing/2d.composite.clip.clear.worker.js b/html/canvas/offscreen/compositing/2d.composite.clip.clear.worker.js
new file mode 100644
index 0000000..7365ecc
--- /dev/null
+++ b/html/canvas/offscreen/compositing/2d.composite.clip.clear.worker.js
@@ -0,0 +1,32 @@
+// DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py.
+// OffscreenCanvas test in a worker:2d.composite.clip.clear
+// Description:fill() does not affect pixels outside the clip region.
+// Note:
+
+importScripts("/resources/testharness.js");
+importScripts("/html/canvas/resources/canvas-tests.js");
+
+var t = async_test("fill() does not affect pixels outside the clip region.");
+var t_pass = t.done.bind(t);
+var t_fail = t.step_func(function(reason) {
+ throw reason;
+});
+t.step(function() {
+
+var canvas = new OffscreenCanvas(100, 50);
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = '#0f0';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'clear';
+ctx.rect(-20, -20, 10, 10);
+ctx.clip();
+ctx.fillStyle = '#f00';
+ctx.fillRect(0, 0, 50, 50);
+_assertPixel(canvas, 25,25, 0,255,0,255);
+_assertPixel(canvas, 75,25, 0,255,0,255);
+t.done();
+
+});
+done();
diff --git a/html/canvas/offscreen/compositing/2d.composite.image.clear.html b/html/canvas/offscreen/compositing/2d.composite.image.clear.html
new file mode 100644
index 0000000..5858e8f
--- /dev/null
+++ b/html/canvas/offscreen/compositing/2d.composite.image.clear.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
+<title>OffscreenCanvas test: 2d.composite.image.clear</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/html/canvas/resources/canvas-tests.js"></script>
+
+<h1>2d.composite.image.clear</h1>
+<p class="desc"></p>
+
+
+<script>
+var t = async_test("");
+var t_pass = t.done.bind(t);
+var t_fail = t.step_func(function(reason) {
+ throw reason;
+});
+t.step(function() {
+
+var canvas = new OffscreenCanvas(100, 50);
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'clear';
+var promise = new Promise(function(resolve, reject) {
+ var xhr = new XMLHttpRequest();
+ xhr.open("GET", '/images/yellow75.png');
+ xhr.responseType = 'blob';
+ xhr.send();
+ xhr.onload = function() {
+ resolve(xhr.response);
+ };
+});
+promise.then(function(response) {
+ createImageBitmap(response).then(bitmap => {
+ ctx.drawImage(bitmap, 0, 0);
+ _assertPixelApprox(canvas, 50,25, 0,0,0,0, 5);
+ }, t_fail);
+}).then(t_pass, t_fail);
+
+});
+</script>
diff --git a/html/canvas/offscreen/compositing/2d.composite.image.clear.worker.js b/html/canvas/offscreen/compositing/2d.composite.image.clear.worker.js
new file mode 100644
index 0000000..1376547
--- /dev/null
+++ b/html/canvas/offscreen/compositing/2d.composite.image.clear.worker.js
@@ -0,0 +1,40 @@
+// DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py.
+// OffscreenCanvas test in a worker:2d.composite.image.clear
+// Description:
+// Note:
+
+importScripts("/resources/testharness.js");
+importScripts("/html/canvas/resources/canvas-tests.js");
+
+var t = async_test("");
+var t_pass = t.done.bind(t);
+var t_fail = t.step_func(function(reason) {
+ throw reason;
+});
+t.step(function() {
+
+var canvas = new OffscreenCanvas(100, 50);
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'clear';
+var promise = new Promise(function(resolve, reject) {
+ var xhr = new XMLHttpRequest();
+ xhr.open("GET", '/images/yellow75.png');
+ xhr.responseType = 'blob';
+ xhr.send();
+ xhr.onload = function() {
+ resolve(xhr.response);
+ };
+});
+promise.then(function(response) {
+ createImageBitmap(response).then(bitmap => {
+ ctx.drawImage(bitmap, 0, 0);
+ _assertPixelApprox(canvas, 50,25, 0,0,0,0, 5);
+ }, t_fail);
+}).then(t_pass, t_fail);
+
+});
+done();
diff --git a/html/canvas/offscreen/compositing/2d.composite.solid.clear.html b/html/canvas/offscreen/compositing/2d.composite.solid.clear.html
new file mode 100644
index 0000000..a06565d
--- /dev/null
+++ b/html/canvas/offscreen/compositing/2d.composite.solid.clear.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
+<title>OffscreenCanvas test: 2d.composite.solid.clear</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/html/canvas/resources/canvas-tests.js"></script>
+
+<h1>2d.composite.solid.clear</h1>
+<p class="desc"></p>
+
+
+<script>
+var t = async_test("");
+var t_pass = t.done.bind(t);
+var t_fail = t.step_func(function(reason) {
+ throw reason;
+});
+t.step(function() {
+
+var canvas = new OffscreenCanvas(100, 50);
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'clear';
+ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+_assertPixelApprox(canvas, 50,25, 0,0,0,0, 5);
+t.done();
+
+});
+</script>
diff --git a/html/canvas/offscreen/compositing/2d.composite.solid.clear.worker.js b/html/canvas/offscreen/compositing/2d.composite.solid.clear.worker.js
new file mode 100644
index 0000000..983a3b0
--- /dev/null
+++ b/html/canvas/offscreen/compositing/2d.composite.solid.clear.worker.js
@@ -0,0 +1,29 @@
+// DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py.
+// OffscreenCanvas test in a worker:2d.composite.solid.clear
+// Description:
+// Note:
+
+importScripts("/resources/testharness.js");
+importScripts("/html/canvas/resources/canvas-tests.js");
+
+var t = async_test("");
+var t_pass = t.done.bind(t);
+var t_fail = t.step_func(function(reason) {
+ throw reason;
+});
+t.step(function() {
+
+var canvas = new OffscreenCanvas(100, 50);
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'clear';
+ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
+ctx.fillRect(0, 0, 100, 50);
+_assertPixelApprox(canvas, 50,25, 0,0,0,0, 5);
+t.done();
+
+});
+done();
diff --git a/html/canvas/offscreen/compositing/2d.composite.transparent.clear.html b/html/canvas/offscreen/compositing/2d.composite.transparent.clear.html
new file mode 100644
index 0000000..91ba094
--- /dev/null
+++ b/html/canvas/offscreen/compositing/2d.composite.transparent.clear.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
+<title>OffscreenCanvas test: 2d.composite.transparent.clear</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/html/canvas/resources/canvas-tests.js"></script>
+
+<h1>2d.composite.transparent.clear</h1>
+<p class="desc"></p>
+
+
+<script>
+var t = async_test("");
+var t_pass = t.done.bind(t);
+var t_fail = t.step_func(function(reason) {
+ throw reason;
+});
+t.step(function() {
+
+var canvas = new OffscreenCanvas(100, 50);
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'clear';
+ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
+ctx.fillRect(0, 0, 100, 50);
+_assertPixelApprox(canvas, 50,25, 0,0,0,0, 5);
+t.done();
+
+});
+</script>
diff --git a/html/canvas/offscreen/compositing/2d.composite.transparent.clear.worker.js b/html/canvas/offscreen/compositing/2d.composite.transparent.clear.worker.js
new file mode 100644
index 0000000..6624bbc
--- /dev/null
+++ b/html/canvas/offscreen/compositing/2d.composite.transparent.clear.worker.js
@@ -0,0 +1,29 @@
+// DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py.
+// OffscreenCanvas test in a worker:2d.composite.transparent.clear
+// Description:
+// Note:
+
+importScripts("/resources/testharness.js");
+importScripts("/html/canvas/resources/canvas-tests.js");
+
+var t = async_test("");
+var t_pass = t.done.bind(t);
+var t_fail = t.step_func(function(reason) {
+ throw reason;
+});
+t.step(function() {
+
+var canvas = new OffscreenCanvas(100, 50);
+var ctx = canvas.getContext('2d');
+
+
+ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
+ctx.fillRect(0, 0, 100, 50);
+ctx.globalCompositeOperation = 'clear';
+ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
+ctx.fillRect(0, 0, 100, 50);
+_assertPixelApprox(canvas, 50,25, 0,0,0,0, 5);
+t.done();
+
+});
+done();
diff --git a/html/canvas/tools/yaml/element/meta.yaml b/html/canvas/tools/yaml/element/meta.yaml
index ea78fe3..e8c4250 100644
--- a/html/canvas/tools/yaml/element/meta.yaml
+++ b/html/canvas/tools/yaml/element/meta.yaml
@@ -133,6 +133,7 @@
('xor', '1-aB', '1-aA'),
('copy', '1', '0'),
('lighter', '1', '1'),
+ ('clear', '0', '0'),
]
# The ones that change the output when src = (0,0,0,0):
diff --git a/html/canvas/tools/yaml/offscreen/meta.yaml b/html/canvas/tools/yaml/offscreen/meta.yaml
index aa850d4..43a67d5 100644
--- a/html/canvas/tools/yaml/offscreen/meta.yaml
+++ b/html/canvas/tools/yaml/offscreen/meta.yaml
@@ -69,6 +69,7 @@
('xor', '1-aB', '1-aA'),
('copy', '1', '0'),
('lighter', '1', '1'),
+ ('clear', '0', '0'),
]
# The ones that change the output when src = (0,0,0,0):
