| OLD | NEW |
| (Empty) |
| 1 description("This tests canvas full arc fill with nonzero winding rule. Eight gr
een concentric thick circumferences should be displayed."); | |
| 2 | |
| 3 var canvas = document.createElement('canvas'); | |
| 4 document.body.appendChild(canvas) | |
| 5 canvas.setAttribute('width', '300'); | |
| 6 canvas.setAttribute('height', '150'); | |
| 7 var ctx = canvas.getContext('2d'); | |
| 8 | |
| 9 var r; | |
| 10 var anticlockwise = true; | |
| 11 ctx.beginPath(); | |
| 12 for (r = 200; r >= 10; r -= 10) { | |
| 13 ctx.moveTo(150 + r, 75); | |
| 14 // Test that anticlockwise is both optional and defaults to false. | |
| 15 if (anticlockwise) { | |
| 16 ctx.ellipse(150, 75, r, r * 1.2, 0, 0, Math.PI * 2, anticlockwise); | |
| 17 } else { | |
| 18 ctx.ellipse(150, 75, r, r * 1.2, 0, 0, Math.PI * 2); | |
| 19 } | |
| 20 ctx.closePath(); | |
| 21 anticlockwise = !anticlockwise; | |
| 22 } | |
| 23 ctx.fillStyle = 'rgba(0, 255, 0, 1)'; | |
| 24 ctx.strokeStyle = 'rgba(0, 255, 0, 1)'; | |
| 25 ctx.fill(); | |
| 26 ctx.stroke(); | |
| 27 | |
| 28 var imageData = ctx.getImageData(297, 75, 1, 1); | |
| 29 var data = imageData.data; | |
| 30 shouldBe("data[1]", "0"); | |
| 31 | |
| 32 imageData = ctx.getImageData(295, 144, 1, 1); | |
| 33 data = imageData.data; | |
| 34 shouldBe("data[1]", "255"); | |
| 35 | |
| 36 imageData = ctx.getImageData(272, 144, 1, 1); | |
| 37 data = imageData.data; | |
| 38 shouldBe("data[1]", "255"); | |
| 39 | |
| 40 imageData = ctx.getImageData(262, 144, 1, 1); | |
| 41 data = imageData.data; | |
| 42 shouldBe("data[1]", "0"); | |
| 43 | |
| 44 imageData = ctx.getImageData(239, 144, 1, 1); | |
| 45 data = imageData.data; | |
| 46 shouldBe("data[1]", "0"); | |
| 47 | |
| 48 imageData = ctx.getImageData(228, 144, 1, 1); | |
| 49 data = imageData.data; | |
| 50 shouldBe("data[1]", "255"); | |
| OLD | NEW |