| <html> |
| <br> <img id="pngBlobWorker"/> |
| |
| <script id="worker" type="text/worker"> |
| self.onmessage = function(msg) { |
| var bmap = msg.data[0]; |
| |
| var canBlob = new OffscreenCanvas(60,60); |
| var ctxBlob = canBlob.getContext("bitmaprenderer"); |
| ctxBlob.transferFromImageBitmap(bmap); |
| canBlob.convertToBlob().then(function(b) { |
| self.postMessage(b); |
| }); |
| } |
| </script> |
| |
| <script> |
| if (window.testRunner) { |
| testRunner.waitUntilDone(); |
| } |
| // source content as canvas |
| var htmlCanvas = document.createElement('canvas'); |
| htmlCanvas.width = 60; |
| htmlCanvas.height = 60; |
| var htmlCanvasCtx = htmlCanvas.getContext("2d"); |
| htmlCanvasCtx.fillStyle = "blue"; |
| htmlCanvasCtx.fillRect(0, 0, 15, 60); |
| htmlCanvasCtx.fillStyle = "red"; |
| htmlCanvasCtx.fillRect(15, 0, 45, 30); |
| htmlCanvasCtx.fillStyle = "green"; |
| htmlCanvasCtx.fillRect(15, 30, 45, 30); |
| |
| // Fill canvasToBlobWorker and canvasTrasnferControlWorker |
| var blob = new Blob([document.getElementById("worker").textContent]); |
| var worker = new Worker(URL.createObjectURL(blob)); |
| |
| var pngImageWorker = document.getElementById("pngBlobWorker"); |
| |
| worker.addEventListener('message', ev => { |
| pngImageWorker.src = URL.createObjectURL(ev.data); |
| if (window.testRunner) { |
| requestAnimationFrame(() => { |
| testRunner.notifyDone(); |
| }); |
| } |
| }); |
| |
| createImageBitmap(htmlCanvas).then(function(bmap){ |
| worker.postMessage([bmap], [bmap]); |
| }); |
| |
| </script> |
| </html> |