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