LibWeb: Implement the "italic" editing command

This commit is contained in:
Jelle Raaijmakers 2025-01-08 16:24:38 +01:00 committed by Andreas Kling
commit ae12f7036b
Notes: github-actions[bot] 2025-01-10 22:36:38 +00:00
4 changed files with 63 additions and 0 deletions

View file

@ -0,0 +1,34 @@
<script src="../include.js"></script>
<div contenteditable="true">foobar</div>
<script>
test(() => {
const range = document.createRange();
getSelection().addRange(range);
const divElm = document.querySelector('div');
const printableSelection = () => {
let activeRange = getSelection().getRangeAt(0);
return `${activeRange.startContainer.nodeName} ${activeRange.startOffset} ${activeRange.endContainer.nodeName} ${activeRange.endOffset}`;
};
const report = () => println(`Div contents: "${divElm.innerHTML}" state: ${document.queryCommandState('italic')} selection: ${printableSelection()}`);
report();
// Make 'bar' italic
range.setStart(divElm.childNodes[0], 3);
range.setEnd(divElm.childNodes[0], 6);
document.execCommand('italic');
report();
// Make 'foo' italic
range.setStart(divElm.childNodes[0], 0);
range.setEnd(divElm.childNodes[0], 3);
document.execCommand('italic');
report();
// Deitalicize 'bar'
range.setStart(divElm.childNodes[0].childNodes[1], 0);
range.setEnd(divElm.childNodes[0].childNodes[1], 3);
document.execCommand('italic');
report();
});
</script>