[FIX] web_editor: should be able to remove nested quote blocks (i.e. in a table)

Before this commit:

When a new element is added in a nested form i.e. inside a table <td>[]</td>
or inside a nested list, it is not deleted on immediate backspace.

After this commit:

When a new element is added in a nested form i.e. inside a table <td>[]</td>
or inside a nested list, it is now deleted on immediate backspace.

task-3339625

closes odoo/odoo#138382

X-original-commit: 263b8b4e2ff622f25dedef078e7d99c94c8f04b3
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
This commit is contained in:
Odoo
2023-10-11 18:03:30 +00:00
committed by maad-odoo
parent ffa1979f7d
commit 119771caa7
2 changed files with 37 additions and 2 deletions
@@ -49,6 +49,8 @@ import {
isVisibleTextNode,
getCursorDirection,
resetOuids,
firstLeaf,
lastLeaf,
} from '../utils/utils.js';
const TEXT_CLASSES_REGEX = /\btext-[^\s]*\b/;
@@ -322,13 +324,13 @@ export const editorCommands = {
// Change tags
setTag(editor, tagName) {
const restoreCursor = preserveCursor(editor.document);
const range = getDeepRange(editor.editable, { correctTripleClick: true });
const selectedBlocks = [...new Set(getTraversedNodes(editor.editable, range).map(closestBlock))];
const deepestSelectedBlocks = selectedBlocks.filter(block => (
!descendants(block).some(descendant => selectedBlocks.includes(descendant)) &&
block.isContentEditable
));
const [startContainer, startOffset, endContainer, endOffset] = [firstLeaf(range.startContainer), range.startOffset, lastLeaf(range.endContainer), range.endOffset];
for (const block of deepestSelectedBlocks) {
if (
['P', 'PRE', 'H1', 'H2', 'H3', 'H4', 'H5', 'H6', 'LI', 'BLOCKQUOTE'].includes(
@@ -350,7 +352,10 @@ export const editorCommands = {
children.forEach(child => newBlock.appendChild(child));
}
}
restoreCursor();
const newRange = new Range();
newRange.setStart(startContainer,startOffset);
newRange.setEnd(endContainer,endOffset);
getDeepRange(editor.editable, { range: newRange, select: true, });
editor.historyStep();
},
@@ -2357,6 +2357,36 @@ X[]
});
});
});
describe('Nested Elements', () => {
it('should delete a h1 inside a td immediately after insertion', async () => {
await testEditor(BasicEditor, {
contentBefore: '<table><tbody><tr><td>[]<br></td><td><br></td><td><br></td></tr><tr><td><br></td><td><br></td><td><br></td></tr><tr><td><br></td><td><br></td><td><br></td></tr></tbody></table>',
stepFunction: async editor => {
await insertText(editor,'/');
await insertText(editor, 'Heading');
triggerEvent(editor.editable,'keyup');
triggerEvent(editor.editable,'keydown', {key: 'Enter'});
await nextTick();
await deleteBackward(editor);
},
contentAfter: '<table><tbody><tr><td><p>[]<br></p></td><td><br></td><td><br></td></tr><tr><td><br></td><td><br></td><td><br></td></tr><tr><td><br></td><td><br></td><td><br></td></tr></tbody></table>',
});
});
it('should delete a h1 inside a nested list immediately after insertion', async () => {
await testEditor(BasicEditor, {
contentBefore: '<ul><li>abc</li><li class="oe-nested"><ul><li>[]<br></li></ul></li></ul>',
stepFunction: async editor => {
await insertText(editor,'/');
await insertText(editor, 'Heading');
triggerEvent(editor.editable,'keyup');
triggerEvent(editor.editable,'keydown', {key: 'Enter'});
await deleteBackward(editor);
await deleteBackward(editor);
},
contentAfter: '<ul><li>abc[]</li></ul>',
});
});
})
describe('Merging different types of elements', () => {
it('should merge a paragraph with text into a paragraph with text', async () => {
await testEditor(BasicEditor, {