OLD | NEW |
| (Empty) |
1 description("Test the behavior of isPointInStroke in Canvas"); | |
2 var ctx = document.createElement('canvas').getContext('2d'); | |
3 | |
4 document.body.appendChild(ctx.canvas); | |
5 | |
6 ctx.strokeStyle = '#0ff'; | |
7 | |
8 // Create new path. | |
9 ctx.beginPath(); | |
10 ctx.rect(20,20,100,100); | |
11 | |
12 debug("Initial behavior: lineWith = 1.0") | |
13 shouldBeTrue("ctx.isPointInStroke(20,20)"); | |
14 shouldBeTrue("ctx.isPointInStroke(120,20)"); | |
15 shouldBeTrue("ctx.isPointInStroke(20,120)"); | |
16 shouldBeTrue("ctx.isPointInStroke(120,120)"); | |
17 shouldBeTrue("ctx.isPointInStroke(70,20)"); | |
18 shouldBeTrue("ctx.isPointInStroke(20,70)"); | |
19 shouldBeTrue("ctx.isPointInStroke(120,70)"); | |
20 shouldBeTrue("ctx.isPointInStroke(70,120)"); | |
21 shouldBeFalse("ctx.isPointInStroke(22,22)"); | |
22 shouldBeFalse("ctx.isPointInStroke(118,22)"); | |
23 shouldBeFalse("ctx.isPointInStroke(22,118)"); | |
24 shouldBeFalse("ctx.isPointInStroke(118,118)"); | |
25 shouldBeFalse("ctx.isPointInStroke(70,18)"); | |
26 shouldBeFalse("ctx.isPointInStroke(122,70)"); | |
27 shouldBeFalse("ctx.isPointInStroke(70,122)"); | |
28 shouldBeFalse("ctx.isPointInStroke(18,70)"); | |
29 debug(""); | |
30 | |
31 debug("Set lineWith = 10.0"); | |
32 ctx.lineWidth = 10; | |
33 shouldBeTrue("ctx.isPointInStroke(22,22)"); | |
34 shouldBeTrue("ctx.isPointInStroke(118,22)"); | |
35 shouldBeTrue("ctx.isPointInStroke(22,118)"); | |
36 shouldBeTrue("ctx.isPointInStroke(118,118)"); | |
37 shouldBeTrue("ctx.isPointInStroke(70,18)"); | |
38 shouldBeTrue("ctx.isPointInStroke(122,70)"); | |
39 shouldBeTrue("ctx.isPointInStroke(70,122)"); | |
40 shouldBeTrue("ctx.isPointInStroke(18,70)"); | |
41 shouldBeFalse("ctx.isPointInStroke(26,70)"); | |
42 shouldBeFalse("ctx.isPointInStroke(70,26)"); | |
43 shouldBeFalse("ctx.isPointInStroke(70,114)"); | |
44 shouldBeFalse("ctx.isPointInStroke(114,70)"); | |
45 debug(""); | |
46 | |
47 debug("Check lineJoin = 'bevel'"); | |
48 ctx.beginPath(); | |
49 ctx.moveTo(10,10); | |
50 ctx.lineTo(110,20); | |
51 ctx.lineTo(10,30); | |
52 ctx.lineJoin = "bevel"; | |
53 shouldBeFalse("ctx.isPointInStroke(113,20)"); | |
54 debug(""); | |
55 | |
56 debug("Check lineJoin = 'miter'"); | |
57 ctx.miterLimit = 40.0; | |
58 ctx.lineJoin = "miter"; | |
59 shouldBeTrue("ctx.isPointInStroke(113,20)"); | |
60 debug(""); | |
61 | |
62 debug("Check miterLimit = 2.0"); | |
63 ctx.miterLimit = 2.0; | |
64 shouldBeFalse("ctx.isPointInStroke(113,20)"); | |
65 debug(""); | |
66 | |
67 debug("Check lineCap = 'butt'"); | |
68 ctx.beginPath(); | |
69 ctx.moveTo(10,10); | |
70 ctx.lineTo(110,10); | |
71 ctx.lineCap = "butt"; | |
72 shouldBeFalse("ctx.isPointInStroke(112,10)"); | |
73 debug(""); | |
74 | |
75 debug("Check lineCap = 'round'"); | |
76 ctx.lineCap = "round"; | |
77 shouldBeTrue("ctx.isPointInStroke(112,10)"); | |
78 shouldBeFalse("ctx.isPointInStroke(117,10)"); | |
79 debug(""); | |
80 | |
81 debug("Check lineCap = 'square'"); | |
82 ctx.lineCap = "square"; | |
83 shouldBeTrue("ctx.isPointInStroke(112,10)"); | |
84 shouldBeFalse("ctx.isPointInStroke(117,10)"); | |
85 debug(""); | |
86 | |
87 debug("Check setLineDash([10,10])"); | |
88 ctx.lineCap = "butt"; | |
89 ctx.setLineDash([10,10]); | |
90 shouldBeTrue("ctx.isPointInStroke(15,10)"); | |
91 shouldBeFalse("ctx.isPointInStroke(25,10)"); | |
92 shouldBeTrue("ctx.isPointInStroke(35,10)"); | |
93 debug(""); | |
94 | |
95 debug("Check dashOffset = 10"); | |
96 ctx.lineDashOffset = 10; | |
97 shouldBeFalse("ctx.isPointInStroke(15,10)"); | |
98 shouldBeTrue("ctx.isPointInStroke(25,10)"); | |
99 shouldBeFalse("ctx.isPointInStroke(35,10)"); | |
100 | |
101 debug("Check extremely large scale") | |
102 ctx.save(); | |
103 ctx.scale(Number.MAX_VALUE, Number.MAX_VALUE); | |
104 ctx.beginPath(); | |
105 ctx.moveTo(-10, -10); | |
106 ctx.lineTo(10, 10); | |
107 shouldBeTrue("ctx.isPointInStroke(0, 0)"); | |
108 ctx.restore(); | |
109 | |
110 debug("Check with non-invertible ctm.") | |
111 ctx.save(); | |
112 ctx.scale(0, 0); | |
113 ctx.beginPath(); | |
114 ctx.moveTo(-10, -10); | |
115 ctx.lineTo(10, 10); | |
116 shouldBeFalse("ctx.isPointInStroke(0, 0)"); | |
117 ctx.restore(); | |
OLD | NEW |