Chromium Code Reviews Chromium Code Reviews
Issue 300223009:
Implement basic parts of hit regions on canvas2d. (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master| OLD | NEW |
|---|---|
| (Empty) | |
| 1 <!DOCTYPE HTML> | |
| 2 <head> | |
| 3 <title>Canvas Hit Regions: accessibility test</title> | |
| 4 <script src="../../resources/js-test.js"></script> | |
| 5 </head> | |
| 6 <body> | |
| 7 <canvas id="canvas"> | |
| 8 <button id="button1"></button> | |
| 9 <div id="container1"> | |
| 10 <button id="button2"></button> | |
| 11 <button id="button3"></button> | |
| 12 </div> | |
| 13 <div id="container2"> | |
| 14 <div id="container3"> | |
| 15 <button id="button4"></button> | |
| 16 <button id="button5"></button> | |
| 17 </div> | |
| 18 <button id="button6"></button> | |
| 19 </div> | |
| 20 </canvas> | |
| 21 <script> | |
| 22 | |
| 23 var canvas = document.getElementById("canvas"); | |
| 24 var context = canvas.getContext("2d"); | |
| 25 | |
| 26 function drawRectAndAddHitRegion(control, x, y, width, height) { | |
| 27 if (window.accessibilityController) | |
| 28 window["ax" + control] = accessibilityController.accessibleElementById(con trol); | |
| 29 | |
| 30 context.beginPath(); | |
| 31 context.rect(x, y, width, height); | |
| 32 context.fill(); | |
| 33 context.addHitRegion({ | |
| 34 id : control, | |
| 35 control : document.getElementById(control) | |
| 36 }); | |
| 37 } | |
| 38 | |
| 39 function testAccessibilityRect(control, x, y, width, height) { | |
| 40 | |
| 41 if (window.accessibilityController && !window["ax" + control]) | |
| 42 window["ax" + control] = accessibilityController.accessibleElementById(con trol); | |
| 43 | |
| 44 shouldBe("ax" + control + ".x", x.toString()); | |
| 45 shouldBe("ax" + control + ".y", y.toString()); | |
| 46 shouldBe("ax" + control + ".width", width.toString()); | |
| 47 shouldBe("ax" + control + ".height", height.toString()); | |
| 48 } | |
| 49 | |
| 50 drawRectAndAddHitRegion("button1", 0, 0, 200, 200); | |
| 51 drawRectAndAddHitRegion("button2", 0, 0, 100, 50); | |
| 52 drawRectAndAddHitRegion("button3", 40, 20, 50, 70); | |
| 53 drawRectAndAddHitRegion("button4", 0, 0, 100, 50); | |
| 54 drawRectAndAddHitRegion("button5", 40, 20, 50, 70); | |
| 55 drawRectAndAddHitRegion("button6", 20, 10, 140, 30); | |
| 56 drawRectAndAddHitRegion("button7", 0, 0, 200, 200); | |
| 57 | |
| 58 debug("Just one button tests."); | |
| 59 testAccessibilityRect("button1", 8, 8, 200, 200); | |
| 60 debug(""); | |
| 61 | |
| 62 debug("The container1 has two buttons."); | |
| 63 testAccessibilityRect("button2", 8, 8, 100, 50); | |
| 64 testAccessibilityRect("button3", 48, 28, 50, 70); | |
| 65 testAccessibilityRect("container1", 8, 8, 100, 90); | |
| 66 debug(""); | |
| 67 | |
| 68 debug("Remove the button2 from the container1."); | |
| 69 document.getElementById("container1").removeChild(document.getElementById("but ton2")); | |
| 70 testAccessibilityRect("container1", 48, 28, 50, 70); | |
| 71 debug(""); | |
| 72 | |
| 73 debug("Two depth containers tests."); | |
|
dmazzoni
2014/06/09 07:27:26
nit: I'd phrase this as "Depth-two container tests
zino
2014/06/10 10:09:34
Done.
| |
| 74 testAccessibilityRect("button4", 8, 8, 100, 50); | |
| 75 testAccessibilityRect("button5", 48, 28, 50, 70); | |
| 76 testAccessibilityRect("button6", 28, 18, 140, 30); | |
| 77 testAccessibilityRect("container2", 8, 8, 160, 90); | |
| 78 testAccessibilityRect("container3", 8, 8, 100, 90); | |
| 79 debug(""); | |
| 80 | |
| 81 </script> | |
| 82 </body> | |
| 83 </html> | |
| OLD | NEW |
