fire-selectionchange-event-on-pressing-backspace.html (2644B)
1 <!doctype HTML> 2 <script src="/resources/testharness.js"></script> 3 <script src="/resources/testharnessreport.js"></script> 4 <script src="/resources/testdriver.js"></script> 5 <script src="/resources/testdriver-vendor.js"></script> 6 <script src="/resources/testdriver-actions.js"></script> 7 8 <body> 9 <div contenteditable="true" id="target"></div> 10 <script> 11 promise_test(async () => { 12 let selectionChangeCount = 0; 13 const target = document.getElementById("target"); 14 target.innerHTML = '<p>wor<i id="caret">l</i>d</p>'; 15 document.addEventListener("selectionchange", () => { 16 ++selectionChangeCount; 17 }); 18 19 await new test_driver.click(document.querySelector('#caret')); // wor|ld 20 await new Promise(resolve => step_timeout(resolve, 500)); 21 assert_equals(selectionChangeCount, 1, "Selection change count should match"); 22 // Simulate the backspace key press to remove 'r' 23 await new test_driver.send_keys(target, "\uE003"); 24 // Waits a short time to allow any events to be processed. 25 await new Promise(resolve => step_timeout(resolve, 500)); 26 27 const expectedHTML = '<p>wo<i id="caret">l</i>d</p>'; 28 assert_equals(target.innerHTML, expectedHTML, "target.innerHTML should match"); 29 assert_equals(selectionChangeCount, 2, "Selection change count should match"); 30 }, "Selectionchange event is fired after removing the character"); 31 32 promise_test(async () => { 33 let selectionChangeCount = 0; 34 const target = document.getElementById("target"); 35 target.innerHTML = '<p>wor<i id="caret">l</i>d</p>'; 36 37 await new test_driver.click(document.querySelector('#caret')); //wor|ld 38 await new test_driver.Actions() 39 .keyDown('\uE008') // Shift 40 .keyDown('\uE012') // Arrow Left 41 .keyUp('\uE012') 42 .keyDown('\uE012') // Arrow Left 43 .keyUp('\uE012') 44 .keyUp('\uE008') 45 .send(); 46 await new Promise(resolve => step_timeout(resolve, 500)); 47 document.addEventListener("selectionchange", () => { 48 ++selectionChangeCount; 49 }); 50 // Simulate the backspace key press to remove 'or' 51 await new test_driver.send_keys(target, "\uE003"); 52 // Waits a short time to allow any events to be processed. 53 await new Promise(resolve => step_timeout(resolve, 500)); 54 55 const expectedHTML = '<p>w<i id="caret">l</i>d</p>'; 56 assert_equals(target.innerHTML, expectedHTML, "target.innerHTML should match"); 57 assert_equals(selectionChangeCount, 1, "Selection change count should match"); 58 }, "Selectionchange event is fired after removing the range"); 59 </script> 60 </body>