OffscreenCanvas-Bitmaprenderer-toBlob.html

<html>
<br> <img id="pngBlob"/>

<script>
  if (window.testRunner) {
    testRunner.waitUntilDone();
  }
  // source content as canvas
  const htmlCanvas = document.createElement('canvas');
  htmlCanvas.width = 60;
  htmlCanvas.height = 60;
  const 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);

  const canNewOffscreen = new OffscreenCanvas(60,60);
  const ctxNewOffscreen = canNewOffscreen.getContext("bitmaprenderer");
  const canToBlobOffscreen = new OffscreenCanvas(60,60);
  const ctxToBlobOffscreen = canToBlobOffscreen.getContext("bitmaprenderer");
  createImageBitmap(htmlCanvas).then(function(bmap){
    // This offscreen canvas will be used in several tests
    ctxNewOffscreen.transferFromImageBitmap(bmap);

    // Fill canvasToBlob
    const pngImage = document.getElementById("pngBlob");
    canNewOffscreen.convertToBlob().then(function(blob){
      pngImage.src = URL.createObjectURL(blob);
      pngImage.onload = () => {
        if (window.testRunner) {
          testRunner.notifyDone();
        }
      }
    })

  });

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