2025-03-18 19:28:35 +01:00
|
|
|
|
<!DOCTYPE html>
|
2025-01-07 16:51:16 +01:00
|
|
|
|
<script src="../include.js"></script>
|
2025-04-29 13:20:15 +02:00
|
|
|
|
<div id="a" contenteditable="true">foobar</div>
|
|
|
|
|
|
<div id="b" contenteditable="true">a </div>
|
|
|
|
|
|
<div id="c" contenteditable="true">a b</div>
|
|
|
|
|
|
<div id="d" contenteditable="true">a b</div>
|
|
|
|
|
|
<div id="e" contenteditable="true">a b</div>
|
|
|
|
|
|
<div id="f" contenteditable="true">a b</div>
|
|
|
|
|
|
<div id="g" contenteditable="true"> b</div>
|
2025-08-14 15:25:19 -04:00
|
|
|
|
<div id="h" contenteditable="true">foo👩🏼❤️👨🏻bar</div>
|
2025-01-07 16:51:16 +01:00
|
|
|
|
<script>
|
|
|
|
|
|
test(() => {
|
2025-04-29 13:20:15 +02:00
|
|
|
|
const testForwardDelete = function(divId, position) {
|
|
|
|
|
|
println(`--- ${divId} ---`);
|
|
|
|
|
|
const divElm = document.querySelector(`div#${divId}`);
|
|
|
|
|
|
println(`Before: ${divElm.innerHTML}`);
|
2025-01-07 16:51:16 +01:00
|
|
|
|
|
2025-04-29 13:20:15 +02:00
|
|
|
|
// Place cursor
|
|
|
|
|
|
const node = divElm.childNodes[0];
|
|
|
|
|
|
getSelection().setBaseAndExtent(node, position, node, position);
|
2025-01-07 16:51:16 +01:00
|
|
|
|
|
2025-04-29 13:20:15 +02:00
|
|
|
|
// Press delete
|
|
|
|
|
|
document.execCommand('forwardDelete');
|
2025-01-07 16:51:16 +01:00
|
|
|
|
|
2025-04-29 13:20:15 +02:00
|
|
|
|
println(`After: ${divElm.innerHTML}`);
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
testForwardDelete('a', 3);
|
|
|
|
|
|
testForwardDelete('b', 1);
|
|
|
|
|
|
testForwardDelete('c', 1);
|
|
|
|
|
|
testForwardDelete('d', 1);
|
|
|
|
|
|
testForwardDelete('e', 1);
|
|
|
|
|
|
testForwardDelete('f', 1);
|
|
|
|
|
|
testForwardDelete('g', 0);
|
2025-08-14 15:25:19 -04:00
|
|
|
|
testForwardDelete('h', 3);
|
2025-01-07 16:51:16 +01:00
|
|
|
|
});
|
|
|
|
|
|
</script>
|
