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> |
+ |