| Index: LayoutTests/fast/canvas/canvas-hit-regions-basic-test.html
|
| diff --git a/LayoutTests/fast/canvas/canvas-hit-regions-basic-test.html b/LayoutTests/fast/canvas/canvas-hit-regions-basic-test.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..4d8179ed4d3091345ec58743d56b5aaf4449e954
|
| --- /dev/null
|
| +++ b/LayoutTests/fast/canvas/canvas-hit-regions-basic-test.html
|
| @@ -0,0 +1,98 @@
|
| +<!DOCTYPE html>
|
| +<html>
|
| +<head>
|
| + <title>Canvas Hit Regions: basic test</title>
|
| + <script src="../../resources/js-test.js"></script>
|
| +</head>
|
| +<body>
|
| +<canvas id="canvas" width="400" height="400">
|
| + <button id="face"></button>
|
| + <button id="eyes"></button>
|
| +</canvas>
|
| +<script>
|
| +
|
| + var canvas = document.getElementById("canvas");
|
| + var context = canvas.getContext("2d");
|
| +
|
| + function clickCanvas(x, y)
|
| + {
|
| + if (!window.eventSender)
|
| + return "This test requires eventSender";
|
| +
|
| + var result = null;
|
| + function listener(event)
|
| + {
|
| + result = event.region;
|
| + }
|
| +
|
| + var rect = canvas.getBoundingClientRect();
|
| + canvas.addEventListener("click", listener, false);
|
| + eventSender.mouseMoveTo(rect.left + x, rect.top + y);
|
| + eventSender.mouseDown();
|
| + eventSender.mouseUp();
|
| + canvas.removeEventListener("click", listener, false);
|
| +
|
| + return result;
|
| + }
|
| +
|
| + context.fillStyle = "pink";
|
| + context.arc(200, 175, 150, 0, Math.PI * 2, true);
|
| + context.fill();
|
| + context.addHitRegion({ id : "face", control : document.getElementById("face") });
|
| +
|
| + context.beginPath();
|
| + context.fillStyle = "black";
|
| + context.globalAlpha = .5;
|
| + context.moveTo(200, 165);
|
| + context.lineTo(240, 205);
|
| + context.lineTo(160, 205);
|
| + context.closePath();
|
| + context.fill();
|
| + context.addHitRegion({ id : "nose" });
|
| +
|
| + context.beginPath();
|
| + context.fillStyle = "red";
|
| + context.rect(125, 240, 150, 20);
|
| + context.fill();
|
| + context.addHitRegion({ id : "mouth" });
|
| +
|
| + context.beginPath();
|
| + context.globalAlpha = 1;
|
| + context.fillStyle = "blue";
|
| + context.arc(150, 125, 25, 0, Math.PI * 2, true);
|
| + context.arc(250, 125, 25, 0, Math.PI * 2, true);
|
| + context.fill();
|
| + context.addHitRegion({ id: "eye", control : document.getElementById("eyes") });
|
| +
|
| + debug("Hit detection and mouse event tests");
|
| + shouldBe("clickCanvas(100, 100)", "'face'");
|
| + shouldBe("clickCanvas(200, 200)", "'nose'");
|
| + shouldBe("clickCanvas(127, 242)", "'mouth'");
|
| + shouldBe("clickCanvas(150, 125)", "'eye'");
|
| + shouldBe("clickCanvas(250, 125)", "'eye'");
|
| + shouldBe("clickCanvas(200, 125)", "'face'");
|
| + shouldBe("clickCanvas(20, 10)", "null");
|
| + debug("");
|
| +
|
| + debug("NotSupportedError exception tests");
|
| + shouldThrow("context.addHitRegion()");
|
| + shouldThrow("context.addHitRegion({ id : '' })");
|
| + shouldThrow("context.addHitRegion({ id : null })");
|
| + shouldThrow("context.addHitRegion({ id : undefined })");
|
| + shouldThrow("context.addHitRegion({ control : {} })");
|
| + shouldThrow("context.addHitRegion({ control : null })");
|
| + shouldThrow("context.addHitRegion({ control : undefined })");
|
| + shouldThrow("context.addHitRegion({ id : '', control : {} })");
|
| + shouldThrow("context.addHitRegion({ id : null, control : {} })");
|
| + shouldThrow("context.addHitRegion({ id : undefined, control : {} })");
|
| + shouldThrow("context.addHitRegion({ id : '', control : null })");
|
| + shouldThrow("context.addHitRegion({ id : null, control : null })");
|
| + shouldThrow("context.addHitRegion({ id : undefined, control : null })");
|
| + shouldThrow("context.addHitRegion({ id : '', control : undefined })");
|
| + shouldThrow("context.addHitRegion({ id : null, control : undefined })");
|
| + shouldThrow("context.addHitRegion({ id : undefined, control : undefined })");
|
| + debug("");
|
| +
|
| +</script>
|
| +</body>
|
| +</html>
|
|
|