composited-canvas-toggle-acceleration.html

<!DOCTYPE html>
<p>
  Regression test for crbug.com/1500272.
  Toggles between accelerated and non-accelerated canvas..
</p>
<canvas id="canvas" width="100" height="100"></canvas>
<script>
if (window.testRunner) {
  testRunner.waitUntilDone();
}

const canvas1 = document.getElementById('canvas');
const ctx1 = canvas1.getContext('2d');

ctx1.fillStyle = 'blue';
ctx1.fillRect(0, 0, 16, 16);

const canvas2 = document.createElement('canvas');
const ctx2 = canvas2.getContext('2d');
ctx2.fillStyle = 'green';
ctx2.fillRect(0, 0, 16, 16);
ctx1.drawImage(canvas2, 32, 0);  // Re-enables acceleration.

ctx1.getImageData(0, 0, 100, 10);

requestAnimationFrame(() => {
  ctx1.getImageData(0, 0, 100, 10);  // Disables acceleration.
  ctx1.drawImage(canvas2, 32, 0);  // Re-enables acceleration.

  requestAnimationFrame(() => {
    ctx1.getImageData(0, 0, 100, 10);  // Disables acceleration.
    ctx1.drawImage(canvas2, 64, 0);  // Re-enables acceleration.

    if (window.testRunner) {
      testRunner.notifyDone();
    }
  });
});
</script>

chromium/third_party/blink/web_tests/fast/canvas/composited-canvas-toggle-acceleration.html