1 files changed, 58 insertions, 0 deletions
diff --git a/accessible/tests/mochitest/elm/test_canvas.html b/accessible/tests/mochitest/elm/test_canvas.html
new file mode 100644
index 0000000000..b4b7438003
--- /dev/null
+++ b/accessible/tests/mochitest/elm/test_canvas.html
@@ -0,0 +1,58 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>Accessible boundaries for hit regions</title>
+  <link rel="stylesheet" type="text/css"
+        href="chrome://mochikit/content/tests/SimpleTest/test.css" />
+
+  <script type="application/javascript"
+          src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
+  <script type="application/javascript"
+          src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script>
+
+  <script type="application/javascript"
+          src="../common.js"></script>
+  <script type="application/javascript"
+          src="../role.js"></script>
+  <script type="application/javascript"
+          src="../layout.js"></script>
+
+  <script type="application/javascript">
+    var kX = 10, kY = 10, kWidth = 150, kHeight = 100;
+    function doTest()
+    {
+      var canv = document.getElementById("c");
+      var context = canv.getContext('2d');
+      var element = document.getElementById("showA");
+      context.beginPath();
+      context.rect(kX, kY, kWidth, kHeight);
+      context.addHitRegion({control: element});
+
+      var input = getAccessible("showA");
+      var [cnvX, cnvY, cnvWidth, cnvHeight] = getBoundsForDOMElm(canv);
+      var [accX, accY, accWidth, accHeight] = getBounds(input);
+
+      var [x, y, w, h] = CSSToDevicePixels(window, kX, kY, kWidth, kHeight);
+      is(accX, cnvX + x, "wrong accX");
+      is(accY, cnvY + y, "wrong accY");
+      is(accWidth, w, "wrong accWidth");
+      is(accHeight, h, "wrong accHeight");
+
+      SimpleTest.finish();
+    }
+
+    SimpleTest.waitForExplicitFinish();
+    addA11yLoadEvent(function() {
+      SpecialPowers.pushPrefEnv({"set": [['canvas.hitregions.enabled', true]]}, doTest);
+    });
+
+    </script>
+</head>
+<body>
+
+  <canvas id="c">
+    <input id="showA" type="checkbox"><label for="showA"> Show As </label>
+  </canvas>
+
+</body>
+</html>