<!DOCTYPE html>
<html>
<head>
<meta name="fuzzy" content="maxDifference=63; totalPixels=400" />
</head>
<body>
<canvas id="offscreen" width="200" height="200" style="border: 1px solid black;"></canvas>
<script>
const canvas = document.getElementById('offscreen');

const offscreenCanvas = canvas.transferControlToOffscreen();
const offscreenContext = offscreenCanvas.getContext('2d');


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

requestAnimationFrame(function() {
    const square = new Path2D();
    square.rect(50, 50, 100, 100);
    offscreenContext.fillStyle = 'green';
    offscreenContext.fill(square);
    offscreenContext.commit();

    requestAnimationFrame(function() {
        if (window.testRunner)
            testRunner.notifyDone();
    });
});
</script>
</body>
</html>
