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

Unified Diff: LayoutTests/fast/canvas/canvas-hit-regions-transform-test.html

Issue 352793006: context.addHitRegion() is not working when using transform operation. (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: state stack 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 side-by-side diff with in-line comments
Download patch
« no previous file with comments | « no previous file | LayoutTests/fast/canvas/canvas-hit-regions-transform-test-expected.txt » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: LayoutTests/fast/canvas/canvas-hit-regions-transform-test.html
diff --git a/LayoutTests/fast/canvas/canvas-hit-regions-transform-test.html b/LayoutTests/fast/canvas/canvas-hit-regions-transform-test.html
new file mode 100644
index 0000000000000000000000000000000000000000..e1030aa703eee11dc3c8e6bc0b60cadf0c9db89b
--- /dev/null
+++ b/LayoutTests/fast/canvas/canvas-hit-regions-transform-test.html
@@ -0,0 +1,194 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>Canvas Hit Regions: transform test</title>
+ <script src="../../resources/js-test.js"></script>
+</head>
+<body>
+<canvas id="canvas" width="400" height="400"></canvas>
+<script>
+
+ var canvas = document.getElementById("canvas");
+ var context = canvas.getContext("2d");
+ var testSet = [];
+
+ function clickCanvas(x, y)
+ {
+ if (!window.eventSender)
+ return "This test requires eventSender";
+
+ var result = null;
+ function listener(event)
+ {
+ canvas.removeEventListener("click", listener, false);
+ result = event.region;
+ }
+
+ var rect = canvas.getBoundingClientRect();
+ canvas.addEventListener("click", listener, false);
+ eventSender.mouseMoveTo(rect.left + x, rect.top + y);
+ eventSender.mouseDown();
+ eventSender.mouseUp();
+
+ return result;
+ }
+
+ function clickTests(message, tests)
+ {
+ testSet.push({
+ type : "debug",
+ message : message
+ });
+
+ for (var i = 0; i < tests.length; i++)
+ testSet.push({
+ type : "shouldBe",
+ actual : clickCanvas(tests[i].x, tests[i].y),
+ expected : tests[i].expected
+ });
+
+ testSet.push({
+ type : "debug",
+ message : ""
+ });
+ }
+
+ function createHitRegion(pathMethod)
+ {
+ context.removeHitRegion("hit");
+ context.beginPath();
+ context.save();
+ pathMethod();
+ context.restore();
+ context.addHitRegion({
+ id : "hit"
+ });
+ }
+
+ function drawStar()
+ {
+ context.beginPath();
+ context.moveTo(0, -50);
+ context.lineTo(-15, -10);
+ context.lineTo(-50, -10);
+ context.lineTo(-15, 10);
+ context.lineTo(-35, 50);
+ context.lineTo(0, 20);
+ context.lineTo(35, 50);
+ context.lineTo(15, 10);
+ context.lineTo(50, -10);
+ context.lineTo(15, -10);
+ context.lineTo(0, -50);
+ }
+
+ // Rectangle with context.translate()
+ createHitRegion(function() {
+ context.translate(20, 20);
+ context.rect(0, 0, 50, 50);
+ });
+ clickTests("Rectangle with context.translate():", [
+ { x : 1, y : 1, expected : null },
+ { x : 31, y : 21, expected : "hit" },
+ { x : 51, y : 51, expected : "hit" },
+ { x : 10, y : 5, expected : null },
+ { x : 61, y : 61, expected : "hit" }
+ ]);
+
+ // Rectangle with context.rotate()
+ createHitRegion(function() {
+ context.rotate(Math.PI * 0.25); // 45 degrees
+ context.rect(0, 0, 50, 50);
+ });
+ clickTests("Rectangle with context.rotate():", [
+ { x : 20, y : 5, expected : null },
+ { x : 0, y : 25, expected : "hit" },
+ { x : 49, y : 49, expected : null },
+ { x : 0, y : 51, expected : "hit" },
+ ]);
+
+ // Rectangle with context.scale()
+ createHitRegion(function() {
+ context.scale(2, 2);
+ context.rect(0, 0, 50, 50);
+ });
+ clickTests("Rectangle with context.scale():", [
+ { x : 1, y : 1, expected : "hit" },
+ { x : 49, y : 49, expected : "hit" },
+ { x : 51, y : 51, expected : "hit" },
+ { x : 99, y : 99, expected : "hit" },
+ ]);
+
+ // Non rectangle (star) with context.translate()
+ createHitRegion(function() {
+ context.translate(50, 50);
+ drawStar();
+ });
+ clickTests("Non rectangle (star) with context.translate():", [
+ { x : 26, y : 23, expected : null },
+ { x : 82, y : 65, expected : null },
+ { x : 51, y : 21, expected : "hit" },
+ { x : 74, y : 49, expected : "hit" },
+ { x : 49, y : 88, expected : null },
+ { x : 13, y : 65, expected : null },
+ { x : 66, y : 76, expected : "hit" },
+ { x : 76, y : 23, expected : null },
+ { x : 38, y : 76, expected : "hit" },
+ { x : 28, y : 47, expected : "hit" },
+ ]);
+
+ // Non rectangle (star) with context.rotate()
+ createHitRegion(function() {
+ context.translate(50, 50);
+ context.rotate(Math.PI * 0.25);
+ drawStar();
+ });
+ clickTests("Non rectangle (star) with context.rotate():", [
+ { x : 26, y : 23, expected : "hit" },
+ { x : 82, y : 65, expected : null },
+ { x : 51, y : 21, expected : null },
+ { x : 74, y : 49, expected : null },
+ { x : 49, y : 88, expected : null },
+ { x : 13, y : 65, expected : null },
+ { x : 66, y : 76, expected : null },
+ { x : 76, y : 23, expected : "hit" },
+ { x : 38, y : 76, expected : "hit" },
+ { x : 28, y : 47, expected : null },
+ ]);
+
+ // Non rectangle (star) with context.scale()
+ createHitRegion(function() {
+ context.translate(25, 25);
+ context.scale(0.5, 0.5);
+ drawStar();
+ });
+ clickTests("Non rectangle (star) with context.scale():", [
+ { x : 28, y : 13, expected : "hit" },
+ { x : 38, y : 24, expected : "hit" },
+ { x : 34, y : 38, expected : "hit" },
+ { x : 13, y : 12, expected : null },
+ { x : 36, y : 12, expected : null },
+ { x : 40, y : 33, expected : null },
+ { x : 9, y : 31, expected : null },
+ { x : 18, y : 41, expected : "hit" },
+ { x : 12, y : 25, expected : "hit" },
+ { x : 25, y : 42, expected : null },
+ ]);
+
+ for (var i = 0; i < testSet.length; i++) {
+ var test = testSet[i];
+
+ if (test.type == "debug") {
+ debug(test.message);
+ }
+ else if (test.type == "shouldBe") {
+ window.region = test.expected;
+ if (test.expected == null)
+ shouldBe("region", String(test.actual));
+ else
+ shouldBe("region", "'" + test.actual + "'");
+ }
+ }
+
+</script>
+</body>
+</html>
« no previous file with comments | « no previous file | LayoutTests/fast/canvas/canvas-hit-regions-transform-test-expected.txt » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698