Chromium Code Reviews| OLD | NEW |
|---|---|
| 1 <!DOCTYPE HTML> | 1 <!DOCTYPE HTML> |
| 2 <script src="../resources/testharness.js"></script> | 2 <script src="../resources/testharness.js"></script> |
| 3 <script src="../resources/testharnessreport.js"></script> | 3 <script src="../resources/testharnessreport.js"></script> |
| 4 | 4 |
| 5 <!-- | 5 <!-- |
| 6 This is a test of the new (June 2016) bounds calculation code, | 6 This is a test of the new (June 2016) bounds calculation code, |
| 7 in which every node in the accessibility tree specifies its | 7 in which every node in the accessibility tree specifies its |
| 8 bounding box and optional matrix transform relative to an | 8 bounding box and optional matrix transform relative to an |
| 9 ancestor object in the tree. | 9 ancestor object in the tree. |
| 10 | 10 |
| (...skipping 33 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 44 <div id="border" style="border: 10px solid #ccc;">Border</div> | 44 <div id="border" style="border: 10px solid #ccc;">Border</div> |
| 45 <div id="padding" style="padding: 20px;">Padding</div> | 45 <div id="padding" style="padding: 20px;">Padding</div> |
| 46 <div id="margin" style="margin: 30px;">Margin</div> | 46 <div id="margin" style="margin: 30px;">Margin</div> |
| 47 <div id="border_padding_margin" | 47 <div id="border_padding_margin" |
| 48 style="border: 10px solid #eee; padding: 20px; margin: 30px;"> | 48 style="border: 10px solid #eee; padding: 20px; margin: 30px;"> |
| 49 Border Padding Margin | 49 Border Padding Margin |
| 50 </div> | 50 </div> |
| 51 <svg id="svg" width="60" height="60"> | 51 <svg id="svg" width="60" height="60"> |
| 52 <circle role="button" id="svg_circle" r="25" cx="30" cy="30" stroke="blue" stroke-width="1"/> | 52 <circle role="button" id="svg_circle" r="25" cx="30" cy="30" stroke="blue" stroke-width="1"/> |
| 53 </svg> | 53 </svg> |
| 54 <p id="twolines">First line<br>Second line</p> | |
| 54 </div> | 55 </div> |
| 55 | 56 |
| 56 <script> | 57 <script> |
| 57 function assertDOMRectSameAsAXRect(id) { | 58 function assertDOMRectSameAsAXRect(id) { |
| 58 var element = document.getElementById(id); | 59 var element = document.getElementById(id); |
| 59 var bounds = element.getBoundingClientRect(); | 60 var bounds = element.getBoundingClientRect(); |
| 60 var axObject = accessibilityController.accessibleElementById(id); | 61 var axObject = accessibilityController.accessibleElementById(id); |
| 61 | 62 |
| 62 // Due to rounding we won't get identical bounds as getBoundingClientRect(), | 63 // Due to rounding we won't get identical bounds as getBoundingClientRect(), |
| 63 // so allow the test to pass if we're within 1 pixel. The test examples | 64 // so allow the test to pass if we're within 1 pixel. The test examples |
| 64 // deliberately have borders, margins, and padding larger than 1 pixel to | 65 // deliberately have borders, margins, and padding larger than 1 pixel to |
| 65 // ensure that this epsilon is not masking more serious errors. | 66 // ensure that this epsilon is not masking more serious errors. |
| 66 var epsilon = 1; | 67 var epsilon = 1; |
| 67 | 68 |
| 68 assert_approx_equals(axObject.boundsX, bounds.left, epsilon, id + " left"); | 69 assert_approx_equals(axObject.boundsX, bounds.left, epsilon, id + " left"); |
| 69 assert_approx_equals(axObject.boundsY, bounds.top, epsilon, id + " top"); | 70 assert_approx_equals(axObject.boundsY, bounds.top, epsilon, id + " top"); |
| 70 assert_approx_equals(axObject.boundsWidth, bounds.width, epsilon, id + " wid th"); | 71 assert_approx_equals(axObject.boundsWidth, bounds.width, epsilon, id + " wid th"); |
| 71 assert_approx_equals(axObject.boundsHeight, bounds.height, epsilon, id + " h eight"); | 72 assert_approx_equals(axObject.boundsHeight, bounds.height, epsilon, id + " h eight"); |
| 72 } | 73 } |
| 73 | 74 |
| 74 function assertStaticTextChildDOMRectSameAsAXRect(id) { | 75 function assertStaticTextChildDOMRectSameAsAXRect(id, index) { |
| 75 var element = document.getElementById(id); | 76 var element = document.getElementById(id); |
| 76 var axObject = accessibilityController.accessibleElementById(id); | 77 var axObject = accessibilityController.accessibleElementById(id); |
| 77 var text = element.firstChild; | 78 var text = element.firstChild; |
| 78 var axText = axObject.childAtIndex(0); | 79 for (var i = 0; i < index; i++) |
| 79 assert_equals(text.nodeType, Node.TEXT_NODE, id + " firstChild nodeType"); | 80 text = text.nextSibling; |
| 80 assert_equals(axText.role, "AXRole: AXStaticText", id + " AX first child rol e"); | 81 console.log(text.data); |
|
chrishtr
2016/09/26 23:42:51
Remove this.
dmazzoni
2016/09/27 16:07:47
Done
| |
| 82 var axText = axObject.childAtIndex(index); | |
| 83 assert_equals(text.nodeType, Node.TEXT_NODE, id + " child " + index + " node Type"); | |
| 84 assert_equals(axText.role, "AXRole: AXStaticText", id + " AX child " + index + " role"); | |
| 81 var range = document.createRange(); | 85 var range = document.createRange(); |
| 82 range.selectNode(text); | 86 range.selectNode(text); |
| 83 var bounds = range.getBoundingClientRect(); | 87 var bounds = range.getBoundingClientRect(); |
| 84 var axObject = accessibilityController.accessibleElementById(id); | |
| 85 var epsilon = 1; | 88 var epsilon = 1; |
| 86 assert_approx_equals(axText.boundsX, bounds.left, epsilon, id + " left"); | 89 assert_approx_equals(axText.boundsX, bounds.left, epsilon, id + " child " + index + " left"); |
| 87 assert_approx_equals(axText.boundsY, bounds.top, epsilon, id + " left"); | 90 assert_approx_equals(axText.boundsY, bounds.top, epsilon, id + " child " + i ndex + " top"); |
| 88 assert_approx_equals(axText.boundsWidth, bounds.width, epsilon, id + " left" ); | 91 assert_approx_equals(axText.boundsWidth, bounds.width, epsilon, id + " child " + index + " width"); |
| 89 assert_approx_equals(axText.boundsHeight, bounds.height, epsilon, id + " lef t"); | 92 assert_approx_equals(axText.boundsHeight, bounds.height, epsilon, id + " chi ld " + index + " height"); |
| 90 } | 93 } |
| 91 | 94 |
| 92 function assertOffsetContainerIs(id, containerId, opt_expectedResult) { | 95 function assertOffsetContainerIs(id, containerId, opt_expectedResult) { |
| 93 if (opt_expectedResult === undefined) | 96 if (opt_expectedResult === undefined) |
| 94 opt_expectedResult = true; | 97 opt_expectedResult = true; |
| 95 var axObject = accessibilityController.accessibleElementById(id); | 98 var axObject = accessibilityController.accessibleElementById(id); |
| 96 var axContainer = accessibilityController.accessibleElementById(containerId) ; | 99 var axContainer = accessibilityController.accessibleElementById(containerId) ; |
| 97 if (opt_expectedResult) | 100 if (opt_expectedResult) |
| 98 assert_equals(axObject.offsetContainer(), axContainer, id + " offsetCont ainer"); | 101 assert_equals(axObject.offsetContainer(), axContainer, id + " offsetCont ainer"); |
| 99 else | 102 else |
| 100 assert_false(axObject.offsetContainer().isEqual(axContainer), id + " off setContainer (should be false)"); | 103 assert_false(axObject.offsetContainer().isEqual(axContainer), id + " off setContainer (should be false)"); |
| 101 } | 104 } |
| 102 | 105 |
| 103 function assertHasTransform(id, expected) { | 106 function assertHasTransform(id, expected) { |
| 104 var axObject = accessibilityController.accessibleElementById(id); | 107 var axObject = accessibilityController.accessibleElementById(id); |
| 105 assert_equals(axObject.hasNonIdentityTransform(), expected, id + " hasNonIde ntityTransform"); | 108 assert_equals(axObject.hasNonIdentityTransform(), expected, id + " hasNonIde ntityTransform"); |
| 106 } | 109 } |
| 107 | 110 |
| 108 test(function(t) { | 111 test(function(t) { |
| 109 assertDOMRectSameAsAXRect("input"); | 112 assertDOMRectSameAsAXRect("input"); |
| 110 assertDOMRectSameAsAXRect("checkbox"); | 113 assertDOMRectSameAsAXRect("checkbox"); |
| 111 assertDOMRectSameAsAXRect("radio"); | 114 assertDOMRectSameAsAXRect("radio"); |
| 112 assertDOMRectSameAsAXRect("button"); | 115 assertDOMRectSameAsAXRect("button"); |
| 113 assertDOMRectSameAsAXRect("heading"); | 116 assertDOMRectSameAsAXRect("heading"); |
| 114 assertStaticTextChildDOMRectSameAsAXRect("heading"); | 117 assertStaticTextChildDOMRectSameAsAXRect("heading", 0); |
| 115 assertDOMRectSameAsAXRect("para"); | 118 assertDOMRectSameAsAXRect("para"); |
| 116 assertStaticTextChildDOMRectSameAsAXRect("para"); | 119 assertStaticTextChildDOMRectSameAsAXRect("para", 0); |
| 117 assertDOMRectSameAsAXRect("span"); | 120 assertDOMRectSameAsAXRect("span"); |
| 118 assertStaticTextChildDOMRectSameAsAXRect("span"); | 121 assertStaticTextChildDOMRectSameAsAXRect("span", 0); |
| 119 assertDOMRectSameAsAXRect("ul"); | 122 assertDOMRectSameAsAXRect("ul"); |
| 120 assertDOMRectSameAsAXRect("li1"); | 123 assertDOMRectSameAsAXRect("li1"); |
| 121 assertDOMRectSameAsAXRect("li2"); | 124 assertDOMRectSameAsAXRect("li2"); |
| 122 assertDOMRectSameAsAXRect("div"); | 125 assertDOMRectSameAsAXRect("div"); |
| 123 assertStaticTextChildDOMRectSameAsAXRect("div"); | 126 assertStaticTextChildDOMRectSameAsAXRect("div", 0); |
| 124 assertDOMRectSameAsAXRect("border"); | 127 assertDOMRectSameAsAXRect("border"); |
| 125 assertStaticTextChildDOMRectSameAsAXRect("border"); | 128 assertStaticTextChildDOMRectSameAsAXRect("border", 0); |
| 126 assertDOMRectSameAsAXRect("padding"); | 129 assertDOMRectSameAsAXRect("padding"); |
| 127 assertStaticTextChildDOMRectSameAsAXRect("padding"); | 130 assertStaticTextChildDOMRectSameAsAXRect("padding", 0); |
| 128 assertDOMRectSameAsAXRect("margin"); | 131 assertDOMRectSameAsAXRect("margin"); |
| 129 assertStaticTextChildDOMRectSameAsAXRect("margin"); | 132 assertStaticTextChildDOMRectSameAsAXRect("margin", 0); |
| 130 assertDOMRectSameAsAXRect("border_padding_margin"); | 133 assertDOMRectSameAsAXRect("border_padding_margin", 0); |
| 131 assertStaticTextChildDOMRectSameAsAXRect("border_padding_margin"); | 134 assertStaticTextChildDOMRectSameAsAXRect("border_padding_margin", 0); |
| 132 assertDOMRectSameAsAXRect("svg"); | 135 assertDOMRectSameAsAXRect("svg"); |
| 133 assertDOMRectSameAsAXRect("svg_circle"); | 136 assertDOMRectSameAsAXRect("svg_circle"); |
| 137 assertStaticTextChildDOMRectSameAsAXRect("twolines", 0); | |
| 138 assertStaticTextChildDOMRectSameAsAXRect("twolines", 2); | |
| 134 }, "Test computed AX rect for some common objects"); | 139 }, "Test computed AX rect for some common objects"); |
| 135 </script> | 140 </script> |
| 136 | 141 |
| 137 <div id="container2" class="container" role="group" | 142 <div id="container2" class="container" role="group" |
| 138 style="position: absolute; left: 400px; top: 20px; border: 3px solid #eee; margin: 5px; padding: 7px;"> | 143 style="position: absolute; left: 400px; top: 20px; border: 3px solid #eee; margin: 5px; padding: 7px;"> |
| 139 <div id="div2">Absolute-positioned</div> | 144 <div id="div2">Absolute-positioned</div> |
| 140 <svg id="svg2" width="60" height="60"> | 145 <svg id="svg2" width="60" height="60"> |
| 141 <circle role="button" id="svg_circle2" r="25" cx="30" cy="30" stroke="bl ue" stroke-width="1"/> | 146 <circle role="button" id="svg_circle2" r="25" cx="30" cy="30" stroke="bl ue" stroke-width="1"/> |
| 142 </svg> | 147 </svg> |
| 143 | 148 |
| (...skipping 114 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... | |
| 258 assertHasTransform("container7", false); | 263 assertHasTransform("container7", false); |
| 259 assertHasTransform("span7", false); | 264 assertHasTransform("span7", false); |
| 260 assertDOMRectSameAsAXRect("span7"); | 265 assertDOMRectSameAsAXRect("span7"); |
| 261 }, "Test spans inside of absolute-positioned container"); | 266 }, "Test spans inside of absolute-positioned container"); |
| 262 </script> | 267 </script> |
| 263 | 268 |
| 264 <script> | 269 <script> |
| 265 if (window.testRunner) | 270 if (window.testRunner) |
| 266 document.body.className = "hideAllContainers"; | 271 document.body.className = "hideAllContainers"; |
| 267 </script> | 272 </script> |
| OLD | NEW |