[FIX] web_editor: properly restore cursor in setTag

Commit [1] introduces an approach to preserve the cursor in `setTag` when new
node is inserted. It used `setStart` at `firstLeaf` of `startContainer` and used
offset of the `startContainer` similarly for `endContainer` which is incorrect
and would throw traceback regarding no child at that offset.
This commit fix it by getting the correct startContainer and endContainer when
new node is created.

[1]: d04e32c

task-3245819

X-original-commit: d9095d277e4dbfa318ff6ddd2692dbb3c71e4775
Part-of: odoo/odoo#151752
This commit is contained in:
Deependra Solanki
2024-02-01 09:49:54 +00:00
parent 38506df2a1
commit 51e4ac9e09
2 changed files with 20 additions and 6 deletions
@@ -49,8 +49,6 @@ import {
isVisibleTextNode,
getCursorDirection,
resetOuids,
firstLeaf,
lastLeaf,
FONT_SIZE_CLASSES,
TEXT_STYLE_CLASSES,
} from '../utils/utils.js';
@@ -333,7 +331,9 @@ export const editorCommands = {
!descendants(block).some(descendant => selectedBlocks.includes(descendant)) &&
block.isContentEditable
));
const [startContainer, startOffset, endContainer, endOffset] = [firstLeaf(range.startContainer), range.startOffset, lastLeaf(range.endContainer), range.endOffset];
let { startContainer, startOffset, endContainer, endOffset } = range;
const startContainerChild = startContainer.firstChild;
const endContainerChild = endContainer.lastChild;
for (const block of deepestSelectedBlocks) {
if (
['P', 'PRE', 'H1', 'H2', 'H3', 'H4', 'H5', 'H6', 'LI', 'BLOCKQUOTE'].includes(
@@ -372,10 +372,17 @@ export const editorCommands = {
children.forEach(child => newBlock.appendChild(child));
}
}
const isContextBlock = container => ['TD', 'DIV', 'LI'].includes(container.nodeName);
if (!startContainer.isConnected || isContextBlock(startContainer)) {
startContainer = startContainerChild.parentNode;
}
if (!endContainer.isConnected || isContextBlock(endContainer)) {
endContainer = endContainerChild.parentNode;
}
const newRange = new Range();
newRange.setStart(startContainer,startOffset);
newRange.setEnd(endContainer,endOffset);
getDeepRange(editor.editable, { range: newRange, select: true, });
newRange.setStart(startContainer, startOffset);
newRange.setEnd(endContainer, endOffset);
getDeepRange(editor.editable, { range: newRange, select: true });
editor.historyStep();
},
@@ -1199,6 +1199,13 @@ describe('setTagName', () => {
contentAfter: '<table><tbody><tr><td><pre>[]a</pre></td><td><pre>b</pre></td><td><pre>c</pre></td></tr></tbody></table>',
});
});
it('should turn a paragraph into pre preserving the cursor position', async () => {
await testEditor(BasicEditor, {
contentBefore: '<p>abcd<br>[]<br></p>',
stepFunction: editor => editor.execCommand('setTag', 'pre'),
contentAfter: '<pre>abcd<br>[]<br></pre>',
});
});
});
describe('to blockquote', () => {
it('should turn a blockquote into a paragraph', async () => {