OffscreenCanvas-Bitmaprenderer-toBlob-worker.html

<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 canvasTransferControlWorker
  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);
    pngImageWorker.onload = () => {
      if (window.testRunner) {
        testRunner.notifyDone();
      }
    };
  });

  createImageBitmap(htmlCanvas).then(function(bmap){
    worker.postMessage([bmap], [bmap]);
  });

</script>
</html>
chromium/third_party/blink/web_tests/fast/canvas/OffscreenCanvas-Bitmaprenderer-toBlob-worker.html
