LayoutTests/fast/canvas/canvas-save-restore-with-path.js

description("This test ensures that paths are correctly handled over save/restore boundaries");

function dataToArray(data) {
    var result = new Array(data.length)
    for (var i = 0; i < data.length; i++)
        result[i] = data[i];
    return result;
}

function getPixel(x, y) {
    var data = context.getImageData(x,y,1,1);
    if (!data) // getImageData failed, which should never happen
        return [-1,-1,-1,-1];
    return dataToArray(data.data);
}

function pixelShouldBe(x, y, colour) {
    shouldBe("getPixel(" + [x, y] +")", "["+colour+"]");
}

var canvas = document.createElement("canvas");
canvas.width = 100;
canvas.height = 100;

var context = canvas.getContext("2d");
context.fillStyle = "red";
context.fillRect(0,0,100,100);
context.fillStyle = "green";

// Test translate
context.beginPath();
context.save();
context.translate(100, 100);
context.rect(-100, -100, 50, 50);
context.restore();
context.fill();
pixelShouldBe(25, 25, [0, 128, 0, 255]);

// Test scale
context.beginPath();
context.save();
context.scale(2, 2);
context.rect(25, 0,25,25);
context.restore();
context.fill();
pixelShouldBe(75, 25, [0, 128, 0, 255]);
pixelShouldBe(75, 75, [255, 0, 0, 255]);

// Test rotate
context.beginPath();
context.save();
context.rotate(90/180 * Math.PI);
context.rect(50, -50, 50, 50);
context.restore();
context.fill();
pixelShouldBe(25, 75, [0, 128, 0, 255]);
pixelShouldBe(75, 75, [255, 0, 0, 255]);

// Test transform
context.beginPath();
context.save();
context.transform(1, 0, 0, 1, 50, 50);
context.rect(0, 0, 50, 50);
context.restore();
context.fill();
pixelShouldBe(75, 75, [0, 128, 0, 255]);