canvas-drawImage-bleed.html | Explore in Territory

<!DOCTYPE HTML>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script>
function drawAndTestCanvas(srcCanvas, dstWidth, dstHeight, x, y, dw, dh, shouldBeGreen)
{
    var dstCanvas = document.createElement('canvas');
    dstCanvas.width = dstWidth;
    dstCanvas.height = dstHeight;
    var dstCtx = dstCanvas.getContext('2d');
    dstCtx.fillStyle = '#00FF00';
    dstCtx.fillRect(0, 0, dstWidth, dstHeight);
    dstCtx.drawImage(srcCanvas, 5, 5, 10, 10, x, y, dw, dh);
    var isOnePixelNotGreen = false;
    for (var i = 0; i < dstWidth; i++) {
        for (var j = 0; j < dstHeight; j++) {
            var d = dstCtx.getImageData(i, j, 1, 1).data;
            if (shouldBeGreen && (d[0] != 0 || d[1] != 255 || d[2] != 0 || d[3] != 255)) {
                assert_true(false);
                return;
            }
            if (!shouldBeGreen && (d[0] != 0 || d[1] != 255 || d[2] != 0 || d[3] != 255)) {
                isOnePixelNotGreen = true;
                break;
            }
        }
        if (isOnePixelNotGreen)
            break;
    }
    if (!shouldBeGreen)
        assert_true(isOnePixelNotGreen);
}

test(function() {
    var srcCanvas = document.createElement('canvas');
    srcCanvas.width = 20;
    srcCanvas.height = 20;
    var srcCtx = srcCanvas.getContext('2d');
    srcCtx.fillStyle = '#FF0000';
    srcCtx.fillRect(0, 0, 20, 20);
    srcCtx.fillStyle = '#00FF00';
    srcCtx.fillRect(5, 5, 10, 10);

    drawAndTestCanvas(srcCanvas, 20, 20, 5, 5, 10, 10, true); // no scaling, no bleeding
    drawAndTestCanvas(srcCanvas, 40, 40, 10, 10, 20, 20, false); // scaling, bleeding
}, 'drawImage should sample outside of src rect when scaling');
</script>
chromium/third_party/blink/web_tests/fast/canvas/canvas-drawImage-bleed.html
