92 lines
2.6 KiB
HTML
92 lines
2.6 KiB
HTML
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
|
|
<html>
|
|
<head>
|
|
<script src="../../resources/js-test-pre.js"></script>
|
|
</head>
|
|
<body>
|
|
<script>
|
|
description("Series of tests to ensure correct behaviour of canvas.strokeRect()");
|
|
var ctx = document.createElement('canvas').getContext('2d');
|
|
|
|
// stroke rect with solid green
|
|
debug("Test canvas.strokeRect() with solid green.");
|
|
ctx.beginPath();
|
|
ctx.strokeStyle = 'green';
|
|
ctx.lineWidth = 100;
|
|
ctx.strokeRect(50, 0, 100, 100);
|
|
|
|
var imageData = ctx.getImageData(1, 1, 98, 98);
|
|
var imgdata = imageData.data;
|
|
shouldBe("imgdata[4]", "0");
|
|
shouldBe("imgdata[5]", "128");
|
|
shouldBe("imgdata[6]", "0");
|
|
|
|
ctx.clearRect(0, 0, 100, 100);
|
|
|
|
// stroke rect with a pattern
|
|
debug("Test canvas.strokeRect() with a pattern.");
|
|
var canvas2 = document.createElement('canvas');
|
|
canvas2.width = 100;
|
|
canvas2.height = 100;
|
|
var ctx2 = canvas2.getContext('2d');
|
|
ctx2.fillStyle = 'green';
|
|
ctx2.fillRect(0, 0, 100, 100);
|
|
var pattern = ctx.createPattern(canvas2, 'repeat');
|
|
ctx.strokeStyle = 'pattern';
|
|
ctx.lineWidth = 100;
|
|
ctx.strokeRect(50, 0, 100, 100);
|
|
|
|
imageData = ctx.getImageData(1, 1, 98, 98);
|
|
imgdata = imageData.data;
|
|
shouldBe("imgdata[4]", "0");
|
|
shouldBe("imgdata[5]", "128");
|
|
shouldBe("imgdata[6]", "0");
|
|
|
|
ctx.clearRect(0, 0, 100, 100);
|
|
|
|
// stroke rect with gradient
|
|
debug("Test canvas.strokeRect() with a gradient.");
|
|
var gradient = ctx.createLinearGradient(0, 0, 0, 100);
|
|
gradient.addColorStop(0, "green");
|
|
gradient.addColorStop(1, "green");
|
|
ctx.strokeStyle = 'gradient';
|
|
ctx.lineWidth = 100;
|
|
ctx.strokeRect(50, 0, 100, 100);
|
|
|
|
imageData = ctx.getImageData(1, 1, 98, 98);
|
|
imgdata = imageData.data;
|
|
shouldBe("imgdata[4]", "0");
|
|
shouldBe("imgdata[5]", "128");
|
|
shouldBe("imgdata[6]", "0");
|
|
|
|
ctx.clearRect(0, 0, 100, 100);
|
|
|
|
// stroke rect with height = width = 0 and lineWidth = 2.
|
|
debug("Test canvas.strokeRect() with height = width = 0 and lineWidth = 2.");
|
|
ctx.strokeStyle = 'red';
|
|
ctx.lineWidth = 2;
|
|
ctx.strokeRect(0, 0, 0, 0);
|
|
imageData = ctx.getImageData(0, 0, 1, 1);
|
|
imgdata = imageData.data;
|
|
shouldBe("imgdata[0]", "0");
|
|
shouldBe("imgdata[1]", "0");
|
|
shouldBe("imgdata[2]", "0");
|
|
|
|
// stroke rect with height = width = 0, lineWidth = 2, and shadow.
|
|
debug("Test canvas.strokeRect() with height = width = 0, lineWidth = 2, and shadow.");
|
|
ctx.shadowOffsetX = 5;
|
|
ctx.shadowOffsetY = 5;
|
|
ctx.shadowColor = 'blue';
|
|
ctx.strokeStyle = 'red';
|
|
ctx.lineWidth = 2;
|
|
ctx.strokeRect(0, 0, 0, 0);
|
|
imageData = ctx.getImageData(0, 0, 1, 1);
|
|
imgdata = imageData.data;
|
|
shouldBe("imgdata[0]", "0");
|
|
shouldBe("imgdata[1]", "0");
|
|
shouldBe("imgdata[2]", "0");
|
|
</script>
|
|
<script src="../../resources/js-test-post.js"></script>
|
|
</body>
|
|
</html>
|