OffscreenCanvas-opaque-background-compositing.html

<!DOCTYPE html>
<style>
#myCanvas {
  width: 100%;
  height: 100%;
  background-color: rgb(241, 241, 241);
}
</style>
<canvas id="myCanvas"></canvas>
<script>
if (window.testRunner) {
  testRunner.waitUntilDone();
}

var myCanvas = document.getElementById("myCanvas");
myCanvas.setAttribute("width", 400);
myCanvas.setAttribute("height", 400);
var offscreenCanvas = myCanvas.transferControlToOffscreen();
var offscreen2d = offscreenCanvas.getContext("2d");
offscreen2d.clearRect(0, 0, 400, 400);
offscreen2d.fillStyle = "green";
offscreen2d.fillRect(0, 0, 200, 200);

requestAnimationFrame(() => {
  requestAnimationFrame(() => {
    if (window.testRunner) {
      testRunner.notifyDone();
    }
  });
});

</script>

chromium/third_party/blink/web_tests/virtual/display-compositor-pixel-dump/fast/canvas/display-compositor-pixel-dump/OffscreenCanvas-opaque-background-compositing.html