Chromium Code Reviews| Index: LayoutTests/fast/canvas/canvas-arc-circumference.html |
| diff --git a/LayoutTests/fast/canvas/canvas-arc-circumference.html b/LayoutTests/fast/canvas/canvas-arc-circumference.html |
| new file mode 100644 |
| index 0000000000000000000000000000000000000000..b462a98024991797bc459acd30e3cd31c8b39709 |
| --- /dev/null |
| +++ b/LayoutTests/fast/canvas/canvas-arc-circumference.html |
| @@ -0,0 +1,209 @@ |
| +<!DOCTYPE html> |
| +<html> |
| +<head></head> |
| +<body> |
| +<canvas id="mycanvas" width="400" height="200"></canvas> |
| +<script src="../js/resources/js-test-pre.js"></script> |
| +<script> |
| +description("This tests checks that arc can draw correct circumferences with lineTo."); |
| +var canvas = document.getElementById('mycanvas'); |
| +var ctx = canvas.getContext('2d'); |
| + |
| +ctx.lineWidth = 7; |
| +ctx.fillStyle = 'rgb(255, 255, 255)'; |
| +ctx.strokeStyle = 'rgb(0, 0, 0)'; |
| +ctx.fillRect(0, 0, canvas.width, canvas.height); |
| + |
| +var imageData = ctx.getImageData(1, 1, 1, 1); |
| +shouldBe("imageData.data[1]", "255"); |
| + |
| +debug("Check clockwise circumference."); |
| +debug(" 1. sweepAngle == 2PI"); |
| +ctx.save(); |
| +ctx.beginPath(); |
| +ctx.moveTo(0, 10); |
| +ctx.arc(60, 50, 30, -Math.PI, Math.PI, false); |
|
alph
2013/07/10 13:06:29
How about drawing e.g. 100 arcs in a loop to form
dshwang
2013/07/10 13:36:42
good idea! I'll do it. I hope that making bitmaps
|
| +ctx.lineTo(0, 90); |
| +ctx.stroke(); |
| +ctx.restore(); |
| + |
| +imageData = ctx.getImageData(14, 29, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(16, 68, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(40, 26, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(80, 28, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(80, 72, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(40, 74, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| + |
| +debug(" 2. sweepAngle == PI"); |
| +ctx.translate(100, 0); |
| +ctx.save(); |
| +ctx.beginPath(); |
| +ctx.moveTo(0, 10); |
| +ctx.arc(60, 50, 30, -Math.PI, 0, false); |
| +ctx.lineTo(0, 90); |
| +ctx.stroke(); |
| +ctx.restore(); |
| + |
| +imageData = ctx.getImageData(114, 29, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(174, 56, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(140, 26, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(180, 28, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(180, 72, 1, 1); |
| +shouldBe("imageData.data[1]", "255"); |
| +imageData = ctx.getImageData(152, 79, 1, 1); |
| +shouldBe("imageData.data[1]", "255"); |
| + |
| +debug(" 3. sweepAngle > 2PI"); |
| +ctx.translate(100, 0); |
| +ctx.save(); |
| +ctx.beginPath(); |
| +ctx.moveTo(0, 10); |
| +ctx.arc(60, 50, 30, -Math.PI, Math.PI * 2.5, false); |
| +ctx.lineTo(0, 90); |
| +ctx.stroke(); |
| +ctx.restore(); |
| + |
| +imageData = ctx.getImageData(214, 29, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(240, 83, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(240, 26, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(280, 28, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(280, 72, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(240, 74, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| + |
| +debug(" 4. sweepAngle < 0"); |
| +ctx.translate(100, 0); |
| +ctx.save(); |
| +ctx.beginPath(); |
| +ctx.moveTo(0, 10); |
| +ctx.arc(60, 50, 30, Math.PI * 1.5, -Math.PI, false); |
| +ctx.lineTo(0, 90); |
| +ctx.stroke(); |
| +ctx.restore(); |
| + |
| +imageData = ctx.getImageData(336, 16, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(316, 68, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(340, 26, 1, 1); |
| +shouldBe("imageData.data[1]", "255"); |
| +imageData = ctx.getImageData(380, 28, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(380, 72, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(340, 74, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| + |
| +debug("Check anticlockwise circumference."); |
| +debug(" 1. sweepAngle == 2PI"); |
| +ctx.translate(-300, 100); |
| +ctx.save(); |
| +ctx.beginPath(); |
| +ctx.moveTo(0, 10); |
| +ctx.arc(60, 50, 30, Math.PI, -Math.PI, true); |
| +ctx.lineTo(0, 90); |
| +ctx.stroke(); |
| +ctx.restore(); |
| + |
| +imageData = ctx.getImageData(14, 129, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(16, 168, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(40, 126, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(80, 128, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(80, 172, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(40, 174, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| + |
| +debug(" 2. sweepAngle == PI"); |
| +ctx.translate(100, 0); |
| +ctx.save(); |
| +ctx.beginPath(); |
| +ctx.moveTo(0, 10); |
| +ctx.arc(60, 50, 30, Math.PI, 0, true); |
| +ctx.lineTo(0, 90); |
| +ctx.stroke(); |
| +ctx.restore(); |
| + |
| +imageData = ctx.getImageData(14, 129, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(158, 164, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(140, 126, 1, 1); |
| +shouldBe("imageData.data[1]", "255"); |
| +imageData = ctx.getImageData(180, 128, 1, 1); |
| +shouldBe("imageData.data[1]", "255"); |
| +imageData = ctx.getImageData(180, 172, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(140, 174, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| + |
| +debug(" 3. sweepAngle > 2PI"); |
| +ctx.translate(100, 0); |
| +ctx.save(); |
| +ctx.beginPath(); |
| +ctx.moveTo(0, 10); |
| +ctx.arc(60, 50, 30, Math.PI, Math.PI * -1.5, true); |
| +ctx.lineTo(0, 90); |
| +ctx.stroke(); |
| +ctx.restore(); |
| + |
| +imageData = ctx.getImageData(214, 129, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(240, 183, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(240, 126, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(280, 128, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(280, 172, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(240, 174, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| + |
| +debug(" 4. sweepAngle < 0"); |
| +ctx.translate(100, 0); |
| +ctx.save(); |
| +ctx.beginPath(); |
| +ctx.moveTo(0, 10); |
| +ctx.arc(60, 50, 30, Math.PI * -1.5, Math.PI, true); |
| +ctx.lineTo(0, 90); |
| +ctx.stroke(); |
| +ctx.restore(); |
| + |
| +imageData = ctx.getImageData(314, 129, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(316, 168, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(340, 126, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(380, 128, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(380, 172, 1, 1); |
| +shouldBe("imageData.data[1]", "0"); |
| +imageData = ctx.getImageData(340, 174, 1, 1); |
| +shouldBe("imageData.data[1]", "255"); |
| + |
| +</script> |
| +<script src="../js/resources/js-test-post.js"></script> |
| +</body> |
| +</html> |
| + |