summaryrefslogtreecommitdiffstats
path: root/dom/canvas/test/test_bitmaprenderer.html
diff options
context:
space:
mode:
authorMatt A. Tobin <mattatobin@localhost.localdomain>2018-02-02 04:16:08 -0500
committerMatt A. Tobin <mattatobin@localhost.localdomain>2018-02-02 04:16:08 -0500
commit5f8de423f190bbb79a62f804151bc24824fa32d8 (patch)
tree10027f336435511475e392454359edea8e25895d /dom/canvas/test/test_bitmaprenderer.html
parent49ee0794b5d912db1f95dce6eb52d781dc210db5 (diff)
downloadUXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.gz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.lz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.xz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.zip
Add m-esr52 at 52.6.0
Diffstat (limited to 'dom/canvas/test/test_bitmaprenderer.html')
-rw-r--r--dom/canvas/test/test_bitmaprenderer.html172
1 files changed, 172 insertions, 0 deletions
diff --git a/dom/canvas/test/test_bitmaprenderer.html b/dom/canvas/test/test_bitmaprenderer.html
new file mode 100644
index 000000000..4c76fae9b
--- /dev/null
+++ b/dom/canvas/test/test_bitmaprenderer.html
@@ -0,0 +1,172 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+<title>WebGL in OffscreenCanvas</title>
+<script src="/tests/SimpleTest/SimpleTest.js"></script>
+<script src="/tests/SimpleTest/WindowSnapshot.js"></script>
+<link rel="stylesheet" href="/tests/SimpleTest/test.css">
+</head>
+<body>
+<script type="text/js-worker">
+function ok(expect, msg) {
+ postMessage({"type": "status", status: !!expect, msg: msg});
+}
+
+onmessage = function(event) {
+ var bitmap = event.data.bitmap;
+ ok(!!bitmap, "Get the ImageBitmap from the main script.");
+
+ var offscreenCanvas = new OffscreenCanvas(64, 64);
+ var ctx = offscreenCanvas.getContext('bitmaprenderer');
+ ok(!!ctx, "Get bitmaprenderer context on worker.");
+
+ ctx.transferFromImageBitmap(bitmap);
+ var resultBitmap = offscreenCanvas.transferToImageBitmap();
+ postMessage({"type": "bitmap", bitmap: resultBitmap}, [resultBitmap]);
+}
+</script>
+<script>
+
+SimpleTest.waitForExplicitFinish();
+
+function createCanvas(width, height) {
+ var htmlCanvas = document.createElement('canvas');
+ htmlCanvas.width = width;
+ htmlCanvas.height = height;
+ document.body.appendChild(htmlCanvas);
+ return htmlCanvas;
+}
+
+function runTest(canvasWidth, canvasHeight, nextTest) {
+ var canvas1 = createCanvas(canvasWidth, canvasHeight);
+ var ctx = canvas1.getContext("2d");
+ ctx.fillStyle = "#00FF00";
+ ctx.fillRect(0, 0, canvasWidth, canvasHeight);
+
+ var canvasRef = createCanvas(90, 90);
+ var ctx = canvasRef.getContext("2d");
+ // Clear with black transparent first
+ ctx.fillStyle = "rgba(0, 0, 0, 0)";
+ ctx.fillRect(0, 0, 90, 90);
+
+ ctx.fillStyle = "#00FF00";
+ ctx.fillRect(0, 0, canvasWidth, canvasHeight);
+
+ createImageBitmap(canvas1).then(function(bmp) {
+ document.body.removeChild(canvas1);
+
+ var canvas2 = createCanvas(90, 90);
+ var ctx2 = canvas2.getContext("bitmaprenderer");
+ ctx2.transferFromImageBitmap(bmp);
+
+ ok(canvasRef.toDataURL() == canvas2.toDataURL(), "toDataURL should return same result.");
+
+ // Exam render result
+ canvasRef.style.display = "none";
+ canvas2.style.display = "block";
+ var snapshot = snapshotWindow(window);
+
+ canvasRef.style.display = "block";
+ canvas2.style.display = "none";
+ var snapshotRef = snapshotWindow(window);
+
+ // bitmaprenderers use an ImageLayer whereas a normal 2d canvas uses a canvas layer. This
+ // can result in some anti-aliasing differences on the edge. We consider slight AA differences
+ // to be reasonable when using different codepaths so fuzz a little bit.
+ var fuzz = { numDifferentPixels: 0,
+ maxDifference: 0 };
+ if (SpecialPowers.Services.appinfo.widgetToolkit == "android") {
+ fuzz.maxDifference = 2;
+ fuzz.numDifferentPixels = 131;
+ }
+ var results = compareSnapshots(snapshot, snapshotRef, true, fuzz);
+ ok(results[0], "Screenshots should be the same");
+
+ document.body.removeChild(canvasRef);
+ document.body.removeChild(canvas2);
+
+ nextTest();
+ });
+}
+
+function scaleTest() {
+ var canvas1 = createCanvas(64, 64);
+ var ctx = canvas1.getContext("2d");
+ ctx.fillStyle = "#00FF00";
+ ctx.fillRect(0, 0, 64, 64);
+
+ var canvas2 = createCanvas(64, 64);
+ var ctx2 = canvas2.getContext("2d");
+ ctx2.fillStyle = "#00FF00";
+ ctx2.fillRect(0, 0, 64, 64);
+
+ var p1 = createImageBitmap(canvas1);
+ var p2 = createImageBitmap(canvas2);
+ Promise.all([p1, p2]).then(function(bitmaps) {
+ document.body.removeChild(canvas1);
+ document.body.removeChild(canvas2);
+
+ // Create a large canvas then shrink.
+ var canvas3 = createCanvas(128, 128);
+ var ctx3 = canvas3.getContext("bitmaprenderer");
+ ctx3.transferFromImageBitmap(bitmaps[0]);
+ var snapshotLargeRef = snapshotWindow(window);
+
+ canvas3.width = 32;
+ canvas3.height = 32;
+ var snapshotSmall = snapshotWindow(window);
+ document.body.removeChild(canvas3);
+
+ // Create a small canvas then grow.
+ var canvas4 = createCanvas(32, 32);
+ var ctx4 = canvas4.getContext("bitmaprenderer");
+ ctx4.transferFromImageBitmap(bitmaps[1]);
+ var snapshotSmallRef = snapshotWindow(window);
+
+ canvas4.width = 128;
+ canvas4.height = 128;
+ var snapshotLarge = snapshotWindow(window);
+ document.body.removeChild(canvas4);
+
+ var resultsLarge = compareSnapshots(snapshotLarge, snapshotLargeRef, true);
+ ok(resultsLarge[0], "Screenshots should be the same");
+
+ var resultsSmall = compareSnapshots(snapshotSmall, snapshotSmallRef, true);
+ ok(resultsSmall[0], "Screenshots should be the same");
+ runTestOnWorker();
+ });
+}
+
+function runTestOnWorker() {
+ var canvas1 = createCanvas(64, 64);
+ var ctx = canvas1.getContext("2d");
+ ctx.fillStyle = "#00FF00";
+ ctx.fillRect(0, 0, 64, 64);
+
+ var blob = new Blob(Array.prototype.map.call(document.querySelectorAll("script[type=\"text\/js-worker\"]"), function (oScript) { return oScript.textContent; }),{type: "text/javascript"});
+
+ var worker = new Worker(window.URL.createObjectURL(blob));
+
+ createImageBitmap(canvas1).then(function(bmp) {
+ worker.postMessage({bitmap: bmp}, [bmp]);
+ worker.onmessage = function(event) {
+ if (event.data.type == "status") {
+ ok(event.data.status, event.data.msg);
+ } else if (event.data.type == "bitmap") {
+ var canvas2 = createCanvas(64, 64);
+ var ctx2 = canvas2.getContext('bitmaprenderer');
+ ctx2.transferFromImageBitmap(event.data.bitmap);
+ ok(canvas1.toDataURL() == canvas2.toDataURL(), 'toDataURL should be the same');
+ SimpleTest.finish();
+ }
+ }
+ });
+}
+
+SpecialPowers.pushPrefEnv({'set': [
+ ['gfx.offscreencanvas.enabled', true],
+]}, runTest.bind(this, 64, 64, runTest.bind(this, 128, 128, scaleTest)));
+
+</script>
+</body>
+</html>
generated by cgit v1.2.3 (git 2.25.1) at 2024-12-04 20:14:27 +0000