| <!DOCTYPE html> |
| <html> |
| <body> |
| <canvas id='output' width='100' height='100'></canvas> |
| <script id='worker' type='text/worker'> |
| var ofc = new OffscreenCanvas(100, 100); |
| var ctx = ofc.getContext("2d"); |
| draw(false); |
| requestAnimationFrame(() => { |
| requestAnimationFrame(() => { |
| draw(true); |
| }); |
| }); |
| |
| function draw(send) { |
| ctx.clearRect(0, 0, 100, 100); |
| ctx.font = "50px Ahem"; |
| ctx.textBaseline = "top"; |
| ctx.fillStyle = "red"; |
| ctx.fillText("X", 0, 0); |
| |
| if (!send) return; |
| |
| var im = ofc.transferToImageBitmap(); |
| self.postMessage(im, [im]); |
| } |
| </script> |
| |
| <script> |
| if (window.testRunner) { |
| testRunner.waitUntilDone(); |
| } |
| var blob = new Blob([document.getElementById('worker').textContent]); |
| var worker = new Worker(URL.createObjectURL(blob)); |
| |
| worker.addEventListener('message', ev => { |
| var im = ev.data; |
| var ctx = document.getElementById("output").getContext("bitmaprenderer"); |
| ctx.transferFromImageBitmap(im); |
| if (window.testRunner) { |
| testRunner.notifyDone(); |
| } |
| }); |
| |
| </script> |
| </body> |
| </html> |
