From d8fcfd10e4708cf245fc4e5165ded438f3634d4a Mon Sep 17 00:00:00 2001 From: Jean-Philippe Gravel Date: Mon, 27 Jan 2025 12:30:56 -0800 Subject: [PATCH] Use the same variable names in offscreen and element 2d.composite tests The canvas element 2d.composite WPT tests are naming auxiliary canvases "canvas2", whereas the offscreen equivalent tests are naming them "offscreenCanvas2". Updating the offscreen tests to use the same name as the element tests will allow a follow-up CL to merge the two implementations to use a common shared test body. Bug: 40207206 Change-Id: Ib0c7335d41c9d77d1aca95b19518d4a8d0a877dd Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6192522 Commit-Queue: Jean-Philippe Gravel Reviewed-by: Andres Ricardo Perez Cr-Commit-Position: refs/heads/main@{#1411816} --- .../compositing/2d.composite.canvas.clear.html | 6 +++--- .../compositing/2d.composite.canvas.clear.worker.js | 6 +++--- .../compositing/2d.composite.canvas.copy.html | 6 +++--- .../compositing/2d.composite.canvas.copy.worker.js | 6 +++--- .../2d.composite.canvas.destination-atop.html | 6 +++--- .../2d.composite.canvas.destination-atop.worker.js | 6 +++--- .../2d.composite.canvas.destination-in.html | 6 +++--- .../2d.composite.canvas.destination-in.worker.js | 6 +++--- .../2d.composite.canvas.destination-out.html | 6 +++--- .../2d.composite.canvas.destination-out.worker.js | 6 +++--- .../2d.composite.canvas.destination-over.html | 6 +++--- .../2d.composite.canvas.destination-over.worker.js | 6 +++--- .../compositing/2d.composite.canvas.lighter.html | 6 +++--- .../compositing/2d.composite.canvas.lighter.worker.js | 6 +++--- .../compositing/2d.composite.canvas.source-atop.html | 6 +++--- .../2d.composite.canvas.source-atop.worker.js | 6 +++--- .../compositing/2d.composite.canvas.source-in.html | 6 +++--- .../2d.composite.canvas.source-in.worker.js | 6 +++--- .../compositing/2d.composite.canvas.source-out.html | 6 +++--- .../2d.composite.canvas.source-out.worker.js | 6 +++--- .../compositing/2d.composite.canvas.source-over.html | 6 +++--- .../2d.composite.canvas.source-over.worker.js | 6 +++--- .../offscreen/compositing/2d.composite.canvas.xor.html | 6 +++--- .../compositing/2d.composite.canvas.xor.worker.js | 6 +++--- .../2d.composite.uncovered.nocontext.copy.html | 4 ++-- .../2d.composite.uncovered.nocontext.copy.worker.js | 4 ++-- ...composite.uncovered.nocontext.destination-atop.html | 4 ++-- ...site.uncovered.nocontext.destination-atop.worker.js | 4 ++-- ...d.composite.uncovered.nocontext.destination-in.html | 4 ++-- ...posite.uncovered.nocontext.destination-in.worker.js | 4 ++-- .../2d.composite.uncovered.nocontext.source-in.html | 4 ++-- ...d.composite.uncovered.nocontext.source-in.worker.js | 4 ++-- .../2d.composite.uncovered.nocontext.source-out.html | 4 ++-- ....composite.uncovered.nocontext.source-out.worker.js | 4 ++-- html/canvas/tools/yaml/offscreen/meta.yaml | 10 +++++----- 35 files changed, 97 insertions(+), 97 deletions(-) diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.clear.html b/html/canvas/offscreen/compositing/2d.composite.canvas.clear.html index ba919272057b96..4e81c6a8264573 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.clear.html +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.clear.html @@ -19,13 +19,13 @@

2d.composite.canvas.clear

ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'clear'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 0,0,0,0, 5); }, ""); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.clear.worker.js b/html/canvas/offscreen/compositing/2d.composite.canvas.clear.worker.js index b2883874750dfb..3f17857e4ceb54 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.clear.worker.js +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.clear.worker.js @@ -13,13 +13,13 @@ promise_test(async t => { ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'clear'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 0,0,0,0, 5); }, ""); done(); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.copy.html b/html/canvas/offscreen/compositing/2d.composite.canvas.copy.html index ebaad553d6e43f..249db0fe80265c 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.copy.html +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.copy.html @@ -19,13 +19,13 @@

2d.composite.canvas.copy

ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'copy'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 255,255,0,191, 5); }, ""); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.copy.worker.js b/html/canvas/offscreen/compositing/2d.composite.canvas.copy.worker.js index 4a996330cd4e90..75c504990bad59 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.copy.worker.js +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.copy.worker.js @@ -13,13 +13,13 @@ promise_test(async t => { ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'copy'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 255,255,0,191, 5); }, ""); done(); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.destination-atop.html b/html/canvas/offscreen/compositing/2d.composite.canvas.destination-atop.html index c99eb32bc23bad..f10d00c5723c82 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.destination-atop.html +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.destination-atop.html @@ -19,13 +19,13 @@

2d.composite.canvas.destination-atop

ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'destination-atop'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 128,255,128,191, 5); }, ""); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.destination-atop.worker.js b/html/canvas/offscreen/compositing/2d.composite.canvas.destination-atop.worker.js index 0ce8fc7ff1adc0..fcdd5efe7df59d 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.destination-atop.worker.js +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.destination-atop.worker.js @@ -13,13 +13,13 @@ promise_test(async t => { ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'destination-atop'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 128,255,128,191, 5); }, ""); done(); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.destination-in.html b/html/canvas/offscreen/compositing/2d.composite.canvas.destination-in.html index 11b45c8378c77e..f0bcba1fe90733 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.destination-in.html +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.destination-in.html @@ -19,13 +19,13 @@

2d.composite.canvas.destination-in

ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'destination-in'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 0,255,255,96, 5); }, ""); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.destination-in.worker.js b/html/canvas/offscreen/compositing/2d.composite.canvas.destination-in.worker.js index 63214c4a42947b..5d507461ecfce7 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.destination-in.worker.js +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.destination-in.worker.js @@ -13,13 +13,13 @@ promise_test(async t => { ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'destination-in'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 0,255,255,96, 5); }, ""); done(); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.destination-out.html b/html/canvas/offscreen/compositing/2d.composite.canvas.destination-out.html index 6315a78a78891b..f4bb383e0fbe3e 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.destination-out.html +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.destination-out.html @@ -19,13 +19,13 @@

2d.composite.canvas.destination-out

ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'destination-out'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 0,255,255,32, 5); }, ""); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.destination-out.worker.js b/html/canvas/offscreen/compositing/2d.composite.canvas.destination-out.worker.js index ae3c550b360068..7958eccfac3bd6 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.destination-out.worker.js +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.destination-out.worker.js @@ -13,13 +13,13 @@ promise_test(async t => { ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'destination-out'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 0,255,255,32, 5); }, ""); done(); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.destination-over.html b/html/canvas/offscreen/compositing/2d.composite.canvas.destination-over.html index 4c76fc48badab9..eb5fb1edc6b9f6 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.destination-over.html +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.destination-over.html @@ -19,13 +19,13 @@

2d.composite.canvas.destination-over

ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'destination-over'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 109,255,146,223, 5); }, ""); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.destination-over.worker.js b/html/canvas/offscreen/compositing/2d.composite.canvas.destination-over.worker.js index 452b95c6648d21..aea0df09c35466 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.destination-over.worker.js +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.destination-over.worker.js @@ -13,13 +13,13 @@ promise_test(async t => { ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'destination-over'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 109,255,146,223, 5); }, ""); done(); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.lighter.html b/html/canvas/offscreen/compositing/2d.composite.canvas.lighter.html index 5c6563f5eb9dca..131631b42a31e0 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.lighter.html +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.lighter.html @@ -19,13 +19,13 @@

2d.composite.canvas.lighter

ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'lighter'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 191,255,128,255, 5); }, ""); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.lighter.worker.js b/html/canvas/offscreen/compositing/2d.composite.canvas.lighter.worker.js index b8d755f6db9257..0ec46bf886daec 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.lighter.worker.js +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.lighter.worker.js @@ -13,13 +13,13 @@ promise_test(async t => { ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'lighter'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 191,255,128,255, 5); }, ""); done(); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.source-atop.html b/html/canvas/offscreen/compositing/2d.composite.canvas.source-atop.html index 0cd164e30ae1ff..88f80622b4ccb8 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.source-atop.html +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.source-atop.html @@ -19,13 +19,13 @@

2d.composite.canvas.source-atop

ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'source-atop'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 191,255,64,128, 5); }, ""); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.source-atop.worker.js b/html/canvas/offscreen/compositing/2d.composite.canvas.source-atop.worker.js index 015ac35c66068b..197660894fdecf 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.source-atop.worker.js +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.source-atop.worker.js @@ -13,13 +13,13 @@ promise_test(async t => { ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'source-atop'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 191,255,64,128, 5); }, ""); done(); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.source-in.html b/html/canvas/offscreen/compositing/2d.composite.canvas.source-in.html index 079a0fbef37d89..3959fe8d6026b7 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.source-in.html +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.source-in.html @@ -19,13 +19,13 @@

2d.composite.canvas.source-in

ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'source-in'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 255,255,0,96, 5); }, ""); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.source-in.worker.js b/html/canvas/offscreen/compositing/2d.composite.canvas.source-in.worker.js index dc73c4d81428cb..293b9c12415bde 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.source-in.worker.js +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.source-in.worker.js @@ -13,13 +13,13 @@ promise_test(async t => { ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'source-in'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 255,255,0,96, 5); }, ""); done(); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.source-out.html b/html/canvas/offscreen/compositing/2d.composite.canvas.source-out.html index 822ac018225467..d4b355a9bf9178 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.source-out.html +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.source-out.html @@ -19,13 +19,13 @@

2d.composite.canvas.source-out

ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'source-out'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 255,255,0,96, 5); }, ""); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.source-out.worker.js b/html/canvas/offscreen/compositing/2d.composite.canvas.source-out.worker.js index 0897f08fab90a9..49ff15abf88712 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.source-out.worker.js +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.source-out.worker.js @@ -13,13 +13,13 @@ promise_test(async t => { ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'source-out'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 255,255,0,96, 5); }, ""); done(); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.source-over.html b/html/canvas/offscreen/compositing/2d.composite.canvas.source-over.html index 6d828e8b0cd81a..b1ba16a4de22cc 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.source-over.html +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.source-over.html @@ -19,13 +19,13 @@

2d.composite.canvas.source-over

ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'source-over'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 219,255,36,223, 5); }, ""); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.source-over.worker.js b/html/canvas/offscreen/compositing/2d.composite.canvas.source-over.worker.js index 34a53a39582c76..9f2d549d8f009f 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.source-over.worker.js +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.source-over.worker.js @@ -13,13 +13,13 @@ promise_test(async t => { ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'source-over'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 219,255,36,223, 5); }, ""); done(); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.xor.html b/html/canvas/offscreen/compositing/2d.composite.canvas.xor.html index 708c40e47e6e40..185de6bdeeeda7 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.xor.html +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.xor.html @@ -19,13 +19,13 @@

2d.composite.canvas.xor

ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'xor'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 191,255,64,128, 5); }, ""); diff --git a/html/canvas/offscreen/compositing/2d.composite.canvas.xor.worker.js b/html/canvas/offscreen/compositing/2d.composite.canvas.xor.worker.js index 721cef641a6ce9..4e70cf2b881dc0 100644 --- a/html/canvas/offscreen/compositing/2d.composite.canvas.xor.worker.js +++ b/html/canvas/offscreen/compositing/2d.composite.canvas.xor.worker.js @@ -13,13 +13,13 @@ promise_test(async t => { ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'xor'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 191,255,64,128, 5); }, ""); done(); diff --git a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.copy.html b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.copy.html index 50243ce401d2e2..4fcb1eeacda824 100644 --- a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.copy.html +++ b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.copy.html @@ -24,8 +24,8 @@

2d.composite.uncovered.nocontext.copy

ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'copy'; - var offscreenCanvas2 = new OffscreenCanvas(100, 50); - ctx.drawImage(offscreenCanvas2, 0, 0); + var canvas2 = new OffscreenCanvas(100, 50); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 0,0,0,0, 5); t.done(); diff --git a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.copy.worker.js b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.copy.worker.js index 1f285eae4c0dab..d46473250bb77d 100644 --- a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.copy.worker.js +++ b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.copy.worker.js @@ -19,8 +19,8 @@ t.step(function() { ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'copy'; - var offscreenCanvas2 = new OffscreenCanvas(100, 50); - ctx.drawImage(offscreenCanvas2, 0, 0); + var canvas2 = new OffscreenCanvas(100, 50); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 0,0,0,0, 5); t.done(); }); diff --git a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.destination-atop.html b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.destination-atop.html index 0c4e8cbf3e2c86..eaf8d101393e2b 100644 --- a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.destination-atop.html +++ b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.destination-atop.html @@ -24,8 +24,8 @@

2d.composite.uncovered.nocontext.destination-atop

ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'destination-atop'; - var offscreenCanvas2 = new OffscreenCanvas(100, 50); - ctx.drawImage(offscreenCanvas2, 0, 0); + var canvas2 = new OffscreenCanvas(100, 50); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 0,0,0,0, 5); t.done(); diff --git a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.destination-atop.worker.js b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.destination-atop.worker.js index a9beb0f27edefe..aab311b760ddde 100644 --- a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.destination-atop.worker.js +++ b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.destination-atop.worker.js @@ -19,8 +19,8 @@ t.step(function() { ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'destination-atop'; - var offscreenCanvas2 = new OffscreenCanvas(100, 50); - ctx.drawImage(offscreenCanvas2, 0, 0); + var canvas2 = new OffscreenCanvas(100, 50); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 0,0,0,0, 5); t.done(); }); diff --git a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.destination-in.html b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.destination-in.html index 0258ed830ba09b..cdbc4765a0bc14 100644 --- a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.destination-in.html +++ b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.destination-in.html @@ -24,8 +24,8 @@

2d.composite.uncovered.nocontext.destination-in

ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'destination-in'; - var offscreenCanvas2 = new OffscreenCanvas(100, 50); - ctx.drawImage(offscreenCanvas2, 0, 0); + var canvas2 = new OffscreenCanvas(100, 50); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 0,0,0,0, 5); t.done(); diff --git a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.destination-in.worker.js b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.destination-in.worker.js index e146e2e91ad94e..a587621a4a3040 100644 --- a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.destination-in.worker.js +++ b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.destination-in.worker.js @@ -19,8 +19,8 @@ t.step(function() { ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'destination-in'; - var offscreenCanvas2 = new OffscreenCanvas(100, 50); - ctx.drawImage(offscreenCanvas2, 0, 0); + var canvas2 = new OffscreenCanvas(100, 50); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 0,0,0,0, 5); t.done(); }); diff --git a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.source-in.html b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.source-in.html index 1f081e433a2b9f..fd3f62add8b23f 100644 --- a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.source-in.html +++ b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.source-in.html @@ -24,8 +24,8 @@

2d.composite.uncovered.nocontext.source-in

ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'source-in'; - var offscreenCanvas2 = new OffscreenCanvas(100, 50); - ctx.drawImage(offscreenCanvas2, 0, 0); + var canvas2 = new OffscreenCanvas(100, 50); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 0,0,0,0, 5); t.done(); diff --git a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.source-in.worker.js b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.source-in.worker.js index cce4b54bd5fedc..4b95ce9c5a30c3 100644 --- a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.source-in.worker.js +++ b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.source-in.worker.js @@ -19,8 +19,8 @@ t.step(function() { ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'source-in'; - var offscreenCanvas2 = new OffscreenCanvas(100, 50); - ctx.drawImage(offscreenCanvas2, 0, 0); + var canvas2 = new OffscreenCanvas(100, 50); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 0,0,0,0, 5); t.done(); }); diff --git a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.source-out.html b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.source-out.html index 93fdb52bded2ae..5b3761a6c10112 100644 --- a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.source-out.html +++ b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.source-out.html @@ -24,8 +24,8 @@

2d.composite.uncovered.nocontext.source-out

ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'source-out'; - var offscreenCanvas2 = new OffscreenCanvas(100, 50); - ctx.drawImage(offscreenCanvas2, 0, 0); + var canvas2 = new OffscreenCanvas(100, 50); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 0,0,0,0, 5); t.done(); diff --git a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.source-out.worker.js b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.source-out.worker.js index 501a84f7e7b264..2cf242d22ed2ff 100644 --- a/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.source-out.worker.js +++ b/html/canvas/offscreen/compositing/2d.composite.uncovered.nocontext.source-out.worker.js @@ -19,8 +19,8 @@ t.step(function() { ctx.fillStyle = 'rgba(0, 255, 255, 0.5)'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = 'source-out'; - var offscreenCanvas2 = new OffscreenCanvas(100, 50); - ctx.drawImage(offscreenCanvas2, 0, 0); + var canvas2 = new OffscreenCanvas(100, 50); + ctx.drawImage(canvas2, 0, 0); _assertPixelApprox(canvas, 50,25, 0,0,0,0, 5); t.done(); }); diff --git a/html/canvas/tools/yaml/offscreen/meta.yaml b/html/canvas/tools/yaml/offscreen/meta.yaml index 6d74cdb18a87da..13118113ed0f91 100644 --- a/html/canvas/tools/yaml/offscreen/meta.yaml +++ b/html/canvas/tools/yaml/offscreen/meta.yaml @@ -102,13 +102,13 @@ ctx.fillStyle = 'rgba%s'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = '%s'; - const offscreenCanvas2 = new OffscreenCanvas(canvas.width, canvas.height); - const ctx2 = offscreenCanvas2.getContext('2d'); + const canvas2 = new OffscreenCanvas(canvas.width, canvas.height); + const ctx2 = canvas2.getContext('2d'); const response = await fetch('/images/yellow75.png') const blob = await response.blob(); const bitmap = await createImageBitmap(blob); ctx2.drawImage(bitmap, 0, 0); - ctx.drawImage(offscreenCanvas2, 0, 0); + ctx.drawImage(canvas2, 0, 0); @assert pixel 50,25 ==~ %s +/- 5; """ % (dest, op, to_test(expected)), } ) @@ -166,8 +166,8 @@ ctx.fillStyle = 'rgba%s'; ctx.fillRect(0, 0, 100, 50); ctx.globalCompositeOperation = '%s'; - var offscreenCanvas2 = new OffscreenCanvas(100, 50); - ctx.drawImage(offscreenCanvas2, 0, 0); + var canvas2 = new OffscreenCanvas(100, 50); + ctx.drawImage(canvas2, 0, 0); @assert pixel 50,25 ==~ %s +/- 5; t.done(); """ % (dest, op, to_test(expected0)),