Chromium Code Reviews Chromium Code Reviews
Issue 1971353002:
Add ImageData-related API to OffscreenCanvasRenderingContext2D (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master| Index: third_party/WebKit/LayoutTests/fast/canvas/OffscreenCanvas-2d-imageData-in-worker.html |
| diff --git a/third_party/WebKit/LayoutTests/fast/canvas/OffscreenCanvas-2d-imageData-in-worker.html b/third_party/WebKit/LayoutTests/fast/canvas/OffscreenCanvas-2d-imageData-in-worker.html |
| new file mode 100644 |
| index 0000000000000000000000000000000000000000..dfaff6b847eb600a1fa697f654eae6f4ee69be19 |
| --- /dev/null |
| +++ b/third_party/WebKit/LayoutTests/fast/canvas/OffscreenCanvas-2d-imageData-in-worker.html |
| @@ -0,0 +1,124 @@ |
| +<!DOCTYPE html> |
| +<html> |
| +<body> |
| +<canvas id='output' width='150' height='150'></canvas> |
| +<script src="../../resources/js-test.js"></script> |
| +<script id='myWorker' type='text/worker'> |
| +function getPrefilledImageData() { |
| + var myImageData = new ImageData(10, 10); |
| + var dataArr = myImageData.data; |
| + for (var i = 0; i < dataArr.length; i+=4) { |
| + dataArr[i + 0] = 255; |
| + dataArr[i + 1] = 100; |
| + dataArr[i + 2] = 0; |
| + dataArr[i + 3] = 255; |
| + } |
| + return myImageData; |
| +} |
| +function postMessageToMain(t, c) { |
| + self.postMessage({topic: t, content: c}); |
| +} |
| +self.onmessage = function(e) { |
| + var aCanvas = new OffscreenCanvas(10, 10); |
| + var ctx = aCanvas.getContext('2d'); |
| + |
| + // createImageData(sx, sy) |
| + try { |
| + var blankImageData = ctx.createImageData(10, 10); |
| + postMessageToMain("createImageData(sx, sy)", blankImageData.data[1]); |
| + } catch (err) { |
| + postMessageToMain("createImageData(sx, sy)", err); |
| + } |
| + |
| + // createImageData(ImageData) |
| + try { |
| + var blankImageData = ctx.createImageData(getPrefilledImageData()); |
|
ajuma
2016/05/13 15:13:31
This one isn't really blank, right? Would prefille
xlai (Olivia)
2016/05/13 15:22:28
At first I also thought so. But then when I look a
|
| + postMessageToMain('createImageData(ImageData)', blankImageData.data[1]); |
| + } catch (err) { |
| + postMessageToMain('createImageData(ImageData)', err); |
| + } |
| + |
| + // getImageData(sx, sy, sw, sh) |
| + try { |
| + ctx.fillStyle = "blue"; |
| + ctx.fillRect(2, 0, 3, 1); |
| + var imageDataFromCanvas = ctx.getImageData(2, 0, 3, 1); |
| + postMessageToMain('getImageData(sx, sy, sw, sh)', imageDataFromCanvas.data[2]); |
| + } catch (err) { |
| + postMessageToMain('getImageData(sx, sy, sw, sh)', err); |
| + } |
| + |
| + // putImageData(ImageData, dx, dy) |
| + try { |
| + ctx.putImageData(getPrefilledImageData(), 0, 0); |
| + var imageDataFromCanvas = ctx.getImageData(0, 0, 1, 1); |
| + postMessageToMain("putImageData(ImageData, dx, dy)", imageDataFromCanvas.data[1]); |
| + } catch (err) { |
| + postMessageToMain("putImageData(ImageData, dx, dy)", err); |
| + } |
| + |
| + // putImageData(ImageData, dx, dy, dirtyX, dirtyY, dirtyWidth, dirtyHeight) |
| + ctx.clearRect(0, 0, aCanvas.width, aCanvas.height); |
| + try { |
| + ctx.putImageData(getPrefilledImageData(), 0, 0, 3, 0, 1, 1); |
| + var imageDataFromCanvas = ctx.getImageData(3, 0, 1, 1); |
| + postMessageToMain("putImageData(ImageData, dx, dy, dirtyX, dirtyY, dirtyWidth, dirtyHeight)", imageDataFromCanvas.data[1]); |
| + } catch (err) { |
| + postMessageToMain("putImageData(ImageData, dx, dy, dirtyX, dirtyY, dirtyWidth, dirtyHeight) failed: ", err); |
| + } |
| + |
| + postMessageToMain("", ""); |
| +}; |
| +</script> |
| +<script> |
| +if (window.testRunner) { |
| + testRunner.waitUntilDone(); |
| +} |
| + |
| +var blob = new Blob([document.getElementById('myWorker').textContent]); |
| +var worker = new Worker(URL.createObjectURL(blob)); |
| +worker.addEventListener('message', msg => { |
| + var data = msg.data; |
| + switch (data.topic) { |
| + case "createImageData(sx, sy)": |
| + if (data.content == "0") |
| + testPassed("createImageData(sx, sy) creates blank image correctly"); |
| + else |
| + testFailed("createImageData(ImageData) failed: " + data.content); |
| + break; |
| + case "createImageData(ImageData)": |
| + if (data.content == "0") |
|
ajuma
2016/05/13 15:13:31
Should this be "100" since the ImageData is coming
xlai (Olivia)
2016/05/13 15:22:28
Same reason as above. This function is creating a
|
| + testPassed("createImageData(ImageData) creates blank image correctly"); |
| + else |
| + testFailed("createImageData(ImageData) failed: " + data.content); |
| + break; |
| + case "getImageData(sx, sy, sw, sh)": |
| + if (data.content == "255") |
| + testPassed("getImageData(sx, sy, sw, sh) is successful."); |
| + else |
| + testFailed("getImageData(sx, sy, sw, sh) failed: " + data.content); |
| + break; |
| + case "putImageData(ImageData, dx, dy)": |
| + if (data.content == "100") |
| + testPassed("putImageData(ImageData, dx, dy) is successful."); |
| + else |
| + testFailed("putImageData(ImageData, dx, dy) failed: " + data.content); |
| + break; |
| + case "putImageData(ImageData, dx, dy, dirtyX, dirtyY, dirtyWidth, dirtyHeight)": |
| + if (data.content == "100") |
| + testPassed("putImageData(ImageData, dx, dy, dirtyX, dirtyY, dirtyWidth, dirtyHeight) is successful."); |
| + else |
| + testFailed("putImageData(ImageData, dx, dy, dirtyX, dirtyY, dirtyWidth, dirtyHeight) failed: " + data.content); |
| + break; |
| + default: |
| + if (window.testRunner) { |
| + testRunner.notifyDone(); |
| + } |
| + break; |
| + } |
| +}); |
| +worker.postMessage(""); |
| + |
| +</script> |
| +</body> |
| + |
