blob: 2cc22361369db7760cfe2ef08b0eb5aa35f5d253 [file] [log] [blame]
<canvas id="c1" width="100" height="100"></canvas>
<canvas id="c2" width="100" height="100"></canvas>
<script>
// This test should show two side-by-side thin circle outlines
// with good visual quality, i.e. no aliasing from image downsampling.
if (window.testRunner)
testRunner.waitUntilDone();
var offscreenCanvas = document.createElement('canvas');
offscreenCanvas.width = 500;
offscreenCanvas.height = 500;
var offscreenContext = offscreenCanvas.getContext('2d');
offscreenContext.beginPath()
offscreenContext.arc(250, 250, 200, 0, 2 * Math.PI, false);
offscreenContext.lineWidth = 3;
offscreenContext.stroke();
var dstCtx = document.getElementById('c1').getContext('2d');
dstCtx.drawImage(offscreenCanvas, 0, 0, 500, 500, 0, 0, 100, 100);
var srcImage = new Image();
srcImage.src = offscreenCanvas.toDataURL();
srcImage.onload = function() {
dstCtx = document.getElementById('c2').getContext('2d');
dstCtx.drawImage(srcImage, 0, 0, 500, 500, 0, 0, 100, 100);
testRunner.notifyDone();
}
</script>