| OLD | NEW |
| (Empty) | |
| 1 <!DOCTYPE html> |
| 2 <script src="../resources/testharness.js"></script> |
| 3 <script src="../resources/testharnessreport.js"></script> |
| 4 |
| 5 <div id="main" role="main"> |
| 6 |
| 7 <p style="width: 3em; border: 1px solid #000;"> |
| 8 a-b-c-d-e-f-g-h-i-j-k-l-m-n-o-p-q-r-s-t-u-v-w-x-y-z |
| 9 </p> |
| 10 |
| 11 </div> |
| 12 <div id="console"></div> |
| 13 |
| 14 <script> |
| 15 test(function() |
| 16 { |
| 17 // Create a range selecting more and more characters of text until |
| 18 // the bounding rect has a nonzero width, indicating we got the first |
| 19 // printing character. |
| 20 var text = document.querySelector('p').firstChild; |
| 21 var range = document.createRange(); |
| 22 range.setStart(text, 0); |
| 23 var i = 0; |
| 24 var bounds; |
| 25 do { |
| 26 range.setEnd(text, i); |
| 27 bounds = range.getBoundingClientRect(); |
| 28 i++; |
| 29 } while (bounds.width == 0); |
| 30 |
| 31 // Keep extending the range until the height increases, indicating we |
| 32 // got more than one line of text. |
| 33 var startCharIndex = i - 2; |
| 34 var oneLineHeight = bounds.height; |
| 35 do { |
| 36 range.setEnd(text, i); |
| 37 bounds = range.getBoundingClientRect(); |
| 38 i++; |
| 39 } while (bounds.height == oneLineHeight); |
| 40 var endCharIndex = i - 2; |
| 41 |
| 42 // Now we can create a range for exactly the first line of text. |
| 43 range.setStart(text, startCharIndex); |
| 44 range.setEnd(text, endCharIndex); |
| 45 var firstLineBounds = range.getBoundingClientRect(); |
| 46 |
| 47 // Also create a range for the second character of the second line of te
xt. |
| 48 range.setStart(text, endCharIndex + 1); |
| 49 range.setEnd(text, endCharIndex + 2); |
| 50 var secondLineBounds = range.getBoundingClientRect(); |
| 51 |
| 52 // Click to place the cursor at the end of the first line. |
| 53 eventSender.mouseMoveTo(firstLineBounds.right, firstLineBounds.top + 5); |
| 54 eventSender.mouseDown(); |
| 55 eventSender.mouseUp(); |
| 56 |
| 57 // Ensure the selection is at the right place. |
| 58 var sel = window.getSelection(); |
| 59 assert_equals(sel.anchorNode, text); |
| 60 assert_equals(sel.anchorOffset, endCharIndex); |
| 61 |
| 62 // Ensure the accessible selection is at the same place in the |
| 63 // accessibility tree, with UPSTREAM affinity. |
| 64 var axRoot = accessibilityController.rootElement; |
| 65 assert_equals(axRoot.selectionAnchorObject.role, "AXRole: AXStaticText")
; |
| 66 assert_equals(axRoot.selectionAnchorObject.name, "a-b-c-d-e-f-g-h-i-j-k-
l-m-n-o-p-q-r-s-t-u-v-w-x-y-z"); |
| 67 assert_equals(axRoot.selectionAnchorOffset, endCharIndex - startCharInde
x); |
| 68 assert_equals(axRoot.selectionAnchorAffinity, "upstream"); |
| 69 |
| 70 // Click to place the cursor at the beginning of the next line. |
| 71 eventSender.mouseMoveTo(firstLineBounds.left, secondLineBounds.top + 5); |
| 72 eventSender.mouseDown(); |
| 73 eventSender.mouseUp(); |
| 74 |
| 75 // Ensure the selection is at the right place. |
| 76 var sel = window.getSelection(); |
| 77 assert_equals(sel.anchorNode, text); |
| 78 assert_equals(sel.anchorOffset, endCharIndex); |
| 79 |
| 80 // Ensure the accessible selection is at the same place in the |
| 81 // accessibility tree, with DOWNSTREAM affinity. |
| 82 assert_equals(axRoot.selectionAnchorObject.role, "AXRole: AXStaticText")
; |
| 83 assert_equals(axRoot.selectionAnchorObject.name, "a-b-c-d-e-f-g-h-i-j-k-
l-m-n-o-p-q-r-s-t-u-v-w-x-y-z"); |
| 84 assert_equals(axRoot.selectionAnchorOffset, endCharIndex - startCharInde
x); |
| 85 assert_equals(axRoot.selectionAnchorAffinity, "downstream"); |
| 86 }, "Test upstream and downstream affinity of text selection."); |
| 87 </script> |
| OLD | NEW |