Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(215)

Side by Side Diff: LayoutTests/fast/canvas/canvas-hit-regions-basic-test.html

Issue 300223009: Implement basic parts of hit regions on canvas2d. (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: exclude clipping region part Created 6 years, 6 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
(Empty)
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <title>Canvas Hit Regions: basic test</title>
5 <script src="../../resources/js-test.js"></script>
6 </head>
7 <body>
8 <canvas id="canvas" width="400" height="400">
9 <button id="face"></button>
10 <button id="eyes"></button>
11 </canvas>
12 <script>
13
14 var canvas = document.getElementById("canvas");
15 var context = canvas.getContext("2d");
16
17 function clickCanvas(x, y)
18 {
19 if (!window.eventSender)
20 return "This test requires eventSender";
21
22 var result = null;
23 function listener(event)
24 {
25 result = event.region;
26 }
27
28 var rect = canvas.getBoundingClientRect();
29 canvas.addEventListener("click", listener, false);
30 eventSender.mouseMoveTo(rect.left + x, rect.top + y);
31 eventSender.mouseDown();
32 eventSender.mouseUp();
33 canvas.removeEventListener("click", listener, false);
34
35 return result;
36 }
37
38 context.fillStyle = "pink";
39 context.arc(200, 175, 150, 0, Math.PI * 2, true);
40 context.fill();
41 context.addHitRegion({ id : "face", control : document.getElementById("face") });
42
43 context.beginPath();
44 context.fillStyle = "black";
45 context.globalAlpha = .5;
46 context.moveTo(200, 165);
47 context.lineTo(240, 205);
48 context.lineTo(160, 205);
49 context.closePath();
50 context.fill();
51 context.addHitRegion({ id : "nose" });
52
53 context.beginPath();
54 context.fillStyle = "red";
55 context.rect(125, 240, 150, 20);
56 context.fill();
57 context.addHitRegion({ id : "mouth" });
58
59 context.beginPath();
60 context.globalAlpha = 1;
61 context.fillStyle = "blue";
62 context.arc(150, 125, 25, 0, Math.PI * 2, true);
63 context.arc(250, 125, 25, 0, Math.PI * 2, true);
64 context.fill();
65 context.addHitRegion({ id: "eye", control : document.getElementById("eyes") }) ;
66
67 debug("Hit detection and mouse event tests");
68 shouldBe("clickCanvas(100, 100)", "'face'");
69 shouldBe("clickCanvas(200, 200)", "'nose'");
70 shouldBe("clickCanvas(127, 242)", "'mouth'");
71 shouldBe("clickCanvas(150, 125)", "'eye'");
72 shouldBe("clickCanvas(250, 125)", "'eye'");
73 shouldBe("clickCanvas(200, 125)", "'face'");
74 shouldBe("clickCanvas(20, 10)", "null");
75 debug("");
76
77 debug("NotSupportedError exception tests");
78 shouldThrow("context.addHitRegion()");
79 shouldThrow("context.addHitRegion({ id : '' })");
80 shouldThrow("context.addHitRegion({ id : null })");
81 shouldThrow("context.addHitRegion({ id : undefined })");
82 shouldThrow("context.addHitRegion({ control : {} })");
83 shouldThrow("context.addHitRegion({ control : null })");
84 shouldThrow("context.addHitRegion({ control : undefined })");
85 shouldThrow("context.addHitRegion({ id : '', control : {} })");
86 shouldThrow("context.addHitRegion({ id : null, control : {} })");
87 shouldThrow("context.addHitRegion({ id : undefined, control : {} })");
88 shouldThrow("context.addHitRegion({ id : '', control : null })");
89 shouldThrow("context.addHitRegion({ id : null, control : null })");
90 shouldThrow("context.addHitRegion({ id : undefined, control : null })");
91 shouldThrow("context.addHitRegion({ id : '', control : undefined })");
92 shouldThrow("context.addHitRegion({ id : null, control : undefined })");
93 shouldThrow("context.addHitRegion({ id : undefined, control : undefined })");
94 debug("");
95
96 </script>
97 </body>
98 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698