| var numToBlobCalls = 9; |
| var numToDataURLCalls = 3; |
| var testImages = []; |
| var canvasCtxs = []; |
| |
| // Create an original canvas with content |
| var canvas = document.createElement("canvas"); |
| var ctx = canvas.getContext("2d"); |
| ctx.fillStyle = "#EE21AF"; |
| ctx.fillRect(0, 0, 250, 150); |
| |
| function testIfAllImagesAreCorrect(asyncTest) |
| { |
| // All resultant images should be the same as both async and main threads use the same image encoder |
| var imageMatched = true; |
| var firstImageData = canvasCtxs[0].getImageData(0, 0, 250, 150).data; |
| for (var i = 1; i < (numToBlobCalls + numToDataURLCalls); i++) |
| { |
| var nextImageData = canvasCtxs[i].getImageData(0, 0, 250, 150).data; |
| for (var k = 0; k < firstImageData.length; k++) |
| { |
| if (firstImageData[k]!=nextImageData[k]) |
| { |
| imageMatched = false; |
| break; |
| } |
| } |
| if (!imageMatched) |
| break; |
| } |
| asyncTest.step(() => { |
| assert_true(imageMatched, 'Images match'); |
| }); |
| } |
| |
| var counter = numToBlobCalls + numToDataURLCalls; |
| function onCanvasDrawCompleted(asyncTest) |
| { |
| counter = counter - 1; |
| if (counter == 0) { |
| testIfAllImagesAreCorrect(asyncTest); |
| asyncTest.done(); |
| } |
| } |
| |
| function createTestCase(i, asyncTest) |
| { |
| var canvas_test = document.createElement("canvas"); |
| var ctx_test = canvas_test.getContext("2d"); |
| canvasCtxs[i] = ctx_test; |
| |
| // Drawing canvas onto itself will force allocation of the backing store |
| // and prevent getImageData from switching out of gpu-acceleration when |
| // running this test under virtual/gpu |
| canvasCtxs[i].drawImage(canvas_test, 0, 0); |
| |
| var newImg = new Image(); |
| newImg.onload = function() { |
| ctx_test.drawImage(newImg, 0, 0, 250, 150); |
| onCanvasDrawCompleted(asyncTest); |
| } |
| testImages[i] = newImg; |
| } |
| |
| function createAllTestCases(asyncTest) { |
| for (var i = 0; i < (numToBlobCalls + numToDataURLCalls); i++) |
| createTestCase(i, asyncTest); |
| } |