webgl-layout-on-out-of-band-resize.html

<!DOCTYPE html>
<head>
<style>
body {
  width: 100%;
  height: 100vh;
}
canvas {
  object-fit: contain;
  width: 100%;
  height: 100%;
  display:  block;
}
</style>
</head>
<body>
<canvas></canvas>

<script>
// Regression test for crbug.com/1343205

if (window.testRunner) {
  testRunner.waitUntilDone();
}

requestAnimationFrame(() => {
  const canvas = document.querySelector("canvas");
  const gl = canvas.getContext("webgl");

  canvas.setAttribute("width", "100");
  canvas.setAttribute("height", "200");

  setTimeout(() => {
    canvas.setAttribute("width", "200");
    canvas.setAttribute("height", "100");
    requestAnimationFrame(() => {
      gl.clearColor(0, 0, 0.5, 1.0);
      gl.clear(gl.COLOR_BUFFER_BIT);
      if (window.testRunner) {
        testRunner.notifyDone();
      }
    });
  }, 0);
});
</script>
</body>

chromium/third_party/blink/web_tests/fast/canvas/webgl/webgl-layout-on-out-of-band-resize.html