| <!DOCTYPE HTML> |
| <style> |
| .wrap span { |
| white-space: pre-wrap; |
| } |
| </style> |
| <div class="wrap"> |
| <span id="initial" contenteditable="true"> abcd </span>111<span id="before" contenteditable="true"> efgh </span>222<br><span id="after" contenteditable="true"> ijkl </span>333<span id="next" contenteditable="true"> mnop </span>444<span id="last" contenteditable="true"> qrst </span> |
| </div> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script src="/resources/testdriver.js"></script> |
| <script src="/resources/testdriver-vendor.js"></script> |
| <script src="/resources/testdriver-actions.js"></script> |
| <script> |
| const KEY_CODE_MAP = { |
| 'ArrowLeft': '\uE012', |
| 'ArrowUp': '\uE013', |
| 'ArrowRight': '\uE014', |
| 'ArrowDown': '\uE015', |
| 'Tab': '\uE004', |
| 'S': '\u0053', |
| }; |
| |
| function keyPress(target, key) { |
| const code = KEY_CODE_MAP[key]; |
| return test_driver.send_keys(target, code); |
| } |
| |
| function deletebr() { |
| let el; |
| el = document.querySelector('br'); |
| if (el) { |
| el.remove(); |
| } |
| } |
| |
| // Delete the <br> element so that we get a single line |
| deletebr(); |
| |
| const s = getSelection(); |
| promise_test(async t => { |
| initial.focus(); |
| let node = initial.firstChild; |
| assert_equals(s.anchorNode, node, "Focus must be at the span with 'abcd'"); |
| assert_equals(s.anchorOffset, 0, "Caret must be at the start of the 'abcd' text"); |
| |
| await keyPress(initial, "Tab"); |
| node = before.firstChild |
| assert_equals(s.anchorNode, node, "Caret moved to span with 'efgh'"); |
| assert_equals(s.anchorOffset, 0, "Caret must be at the start of the 'efgh' text"); |
| |
| await keyPress(before, "Tab"); |
| node = after.firstChild |
| assert_equals(s.anchorNode, node, "Focus must be at the span with 'ijkl'"); |
| assert_equals(s.anchorOffset, 0, "Caret must be at the start of the 'efgh' text"); |
| |
| await keyPress(after, "Tab"); |
| node = next.firstChild |
| assert_equals(s.anchorNode, node, "Focus must be at the span with 'mnop'"); |
| assert_equals(s.anchorOffset, 0, "Caret must be at the start of the 'efgh' text"); |
| |
| }, "Navigate after deleting <br>"); |
| |
| promise_test(async t => { |
| initial.focus(); |
| await keyPress(initial, "Tab"); |
| await keyPress(before, "Tab"); |
| await keyPress(after, "Tab"); |
| await keyPress(next, "ArrowRight"); |
| await keyPress(next, "ArrowRight"); |
| await keyPress(next, "ArrowRight"); |
| |
| await keyPress(next, "S"); |
| assert_equals(next.firstChild.textContent, " mnSop ", "Inserting a 'S' char betwen 'n' and 'o'"); |
| }, "Insert text after deleting <br>") |
| |
| </script> |
