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

Side by Side Diff: third_party/WebKit/LayoutTests/accessibility/bounds-calc.html

Issue 2372823002: Fix a case where the accessible bounding box of an inline text box was wrong. (Closed)
Patch Set: Created 4 years, 2 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 unified diff | Download patch
OLDNEW
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
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
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>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698