OLD | NEW |
(Empty) | |
| 1 <!DOCTYPE html> |
| 2 <html> |
| 3 <head> |
| 4 <script src="../resources/js-test.js"></script> |
| 5 </head> |
| 6 <body> |
| 7 |
| 8 <div id="contenteditable-textbox" role="textbox" contenteditable="true"> |
| 9 <div id="contenteditable-line1">Line 1</div> |
| 10 <textarea id="contenteditable-line2" rows="1" cols="40">Line 2</textarea> |
| 11 </div> |
| 12 |
| 13 <div id="contenteditable-div" contenteditable> |
| 14 <p id="paragraph1">Line 1<br>Line 2</p> |
| 15 <p id="paragraph2">Line 3</p> |
| 16 </div> |
| 17 |
| 18 <p id="description"></p> |
| 19 <div id="console"></div> |
| 20 |
| 21 <script> |
| 22 description("This tests that caret position is reported correctly for co
ntenteditable elements."); |
| 23 |
| 24 if (window.accessibilityController) { |
| 25 var selection = window.getSelection(); |
| 26 var selectionRange = document.createRange(); |
| 27 |
| 28 var textbox = document.getElementById("contenteditable-textbox"); |
| 29 textbox.focus(); |
| 30 var textboxAccessible = |
| 31 accessibilityController.accessibleElementById( |
| 32 'contenteditable-textbox'); |
| 33 |
| 34 shouldBeZero("textboxAccessible.selectionStart"); |
| 35 shouldBeZero("textboxAccessible.selectionEnd"); |
| 36 |
| 37 var line1 = document.getElementById("contenteditable-line1"); |
| 38 selectionRange.setStart(line1.firstChild, 1); |
| 39 selectionRange.setEnd(line1.firstChild, 1); |
| 40 selection.removeAllRanges(); |
| 41 selection.addRange(selectionRange); |
| 42 shouldBeEqualToNumber("textboxAccessible.selectionStart", 1); |
| 43 shouldBeEqualToNumber("textboxAccessible.selectionEnd", 1); |
| 44 |
| 45 var line2 = document.getElementById("contenteditable-line2"); |
| 46 line2.focus(); |
| 47 // The selection should have been removed from the line1 div. |
| 48 shouldBeZero("textboxAccessible.selectionStart"); |
| 49 shouldBeZero("textboxAccessible.selectionEnd"); |
| 50 |
| 51 var line2Accessible = accessibilityController.focusedElement; |
| 52 shouldBeZero("line2Accessible.selectionStart"); |
| 53 shouldBeZero("line2Accessible.selectionEnd"); |
| 54 line2.setSelectionRange(3, 3); |
| 55 shouldBeEqualToNumber("line2Accessible.selectionStart", 3); |
| 56 shouldBeEqualToNumber("line2Accessible.selectionEnd", 3); |
| 57 |
| 58 var contenteditable = document.getElementById('contenteditable-div')
; |
| 59 contenteditable.focus(); |
| 60 var line1 = document.getElementById('paragraph1').firstChild; |
| 61 var line2 = document.getElementById('paragraph1').lastChild; |
| 62 var line3 = document.getElementById('paragraph2').firstChild; |
| 63 var contenteditableLines = [ line1, line2, line3 ]; |
| 64 var contenteditableAccessible = |
| 65 accessibilityController.accessibleElementById( |
| 66 'contenteditable-div'); |
| 67 |
| 68 for (var lineNumber = 0; lineNumber < 3; ++lineNumber) { |
| 69 // Place the caret at the end of each line. |
| 70 var caretPosition = lineNumber * 7 + 6; |
| 71 // Paragraphs should have an extra blank line between them. |
| 72 if (lineNumber == 2) |
| 73 caretPosition += 1; |
| 74 |
| 75 selectionRange.setStart(contenteditableLines[lineNumber], 6); |
| 76 selectionRange.setEnd(contenteditableLines[lineNumber], 6); |
| 77 selection.removeAllRanges(); |
| 78 selection.addRange(selectionRange); |
| 79 |
| 80 shouldBeEqualToNumber("contenteditableAccessible.selectionStart"
, |
| 81 caretPosition); |
| 82 shouldBeEqualToNumber("contenteditableAccessible.selectionEnd", |
| 83 caretPosition); |
| 84 } |
| 85 |
| 86 } |
| 87 </script> |
| 88 |
| 89 </body> |
| 90 </html> |
OLD | NEW |