Improve filtering quality of images downsampled in 2d canvas

LayoutTests/fast/canvas/downsample-quality.html

+<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.
+// Both circles should look identical.
+
+if (window.testRunner) {
+        testRunner.dumpAsTextWithPixelResults();
+        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>