pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[FIX] web_editor: checkbox direction does not switched for nested checklist

Browse Source 
Before this commit:
When creating a nested checklist within another checklist and subsequently
changing the direction of the parent list, the direction of the parent element
would reverse alongside the pseudo element. However, in the case of nested
checklists, only the content's direction would change, while the pseudo
element's direction remained unaffected.

Afte this commit:
When altering the direction of the parent checklist's content, both the content
itself and the associated pseudo element's direction is changed alongwith the
nested checklist.

task-3461806

closes odoo/odoo#152890

X-original-commit: f46e1f0c5b00f2e289feef5e35f3fea6fb477104
Signed-off-by: Geelen Sébastien (sge) <sge@odoo.com>
This commit is contained in:
maad-odoo
2024-02-07 11:05:09 +00:00
parent 31c248b730
commit 9b40507c01
3 changed files with 100 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/web_editor/static/src/js/editor/odoo-editor/src/commands/commands.js
+5 -1
View File
@@ -403,7 +403,11 @@ export const editorCommands = {
const changedElements = [];
const defaultDirection = editor.options.direction;
const shouldApplyStyle = !isSelectionFormat(editor.editable, 'switchDirection');
for (const block of new Set(selectedTextNodes.map(textNode => closestElement(textNode, 'ul,ol') || closestBlock(textNode)))) {
let blocks = new Set(selectedTextNodes.map(textNode => closestElement(textNode, 'ul,ol') || closestBlock(textNode)));
blocks.forEach(block => {
blocks = [...blocks, ...block.querySelectorAll('ul,ol')];
})
for (const block of blocks) {
if (!shouldApplyStyle) {
block.removeAttribute('dir');
} else {
addons/web_editor/static/src/js/editor/odoo-editor/test/spec/list.test.js
+91
View File
@@ -16,6 +16,7 @@ import {
toggleUnorderedList,
triggerEvent,
unformat,
switchDirection
} from '../utils.js';
describe('List', () => {
@@ -8434,4 +8435,94 @@ describe('List', () => {
});
});
});
describe('switchDirection', () => {
describe('switch direction form left to right', () => {
it('should properly switch the direction of the single level list (ltr).', async () => {
await testEditor(BasicEditor, {
contentBefore: `<ul><li>a</li><li>b[]</li><li>c</li></ul>`,
stepFunction: switchDirection,
contentAfter: `<ul dir="rtl"><li>a</li><li>b[]</li><li>c</li></ul>`,
});
await testEditor(BasicEditor, {
contentBefore: `<ol><li>a</li><li>b[]</li><li>c</li></ol>`,
stepFunction: switchDirection,
contentAfter: `<ol dir="rtl"><li>a</li><li>b[]</li><li>c</li></ol>`,
});
await testEditor(BasicEditor, {
removeCheckIds: true,
contentBefore: `<ul class="o_checklist"><li>a</li><li>b[]</li><li>c</li></ul>`,
stepFunction: switchDirection,
contentAfter: `<ul class="o_checklist" dir="rtl"><li>a</li><li>b[]</li><li>c</li></ul>`,
});
});
it('should properly switch the direction of nested list (ltr).', async () => {
await testEditor(BasicEditor, {
contentBefore: `<ul><li>a[]</li><li class="oe-nested"><ul><li>b</li><li>c</li></ul></li><li>d</li></ul>`,
stepFunction: switchDirection,
contentAfter: `<ul dir="rtl"><li>a[]</li><li class="oe-nested"><ul dir="rtl"><li>b</li><li>c</li></ul></li><li>d</li></ul>`,
});
await testEditor(BasicEditor, {
contentBefore: `<ol><li>a[]</li><li class="oe-nested"><ol><li>b</li><li>c</li></ol></li><li>d</li></ol>`,
stepFunction: switchDirection,
contentAfter: `<ol dir="rtl"><li>a[]</li><li class="oe-nested"><ol dir="rtl"><li>b</li><li>c</li></ol></li><li>d</li></ol>`,
});
await testEditor(BasicEditor, {
removeCheckIds: true,
contentBefore: `<ul class="o_checklist"><li>a[]</li><li class="oe-nested"><ul class="o_checklist"><li>b</li><li>c</li></ul></li><li>d</li></ul>`,
stepFunction: switchDirection,
contentAfter: `<ul class="o_checklist" dir="rtl"><li>a[]</li><li class="oe-nested"><ul class="o_checklist" dir="rtl"><li>b</li><li>c</li></ul></li><li>d</li></ul>`,
});
await testEditor(BasicEditor, {
removeCheckIds: true,
contentBefore: `<ul><li>a[]</li><li class="oe-nested"><ul class="o_checklist"><li>b</li><li class="oe-nested"><ol><li>g</li><li>e</li></ol></li><li>c</li></ul></li><li>d</li></ul>`,
stepFunction: switchDirection,
contentAfter: `<ul dir="rtl"><li>a[]</li><li class="oe-nested"><ul class="o_checklist" dir="rtl"><li>b</li><li class="oe-nested"><ol dir="rtl"><li>g</li><li>e</li></ol></li><li>c</li></ul></li><li>d</li></ul>`,
});
});
});
describe('switch direction form right to left', () => {
it('should properly switch the direction of the single level list (rtl).', async () => {
await testEditor(BasicEditor, {
contentBefore: `<ul dir="rtl"><li>a</li><li>b[]</li><li>c</li></ul>`,
stepFunction: switchDirection,
contentAfter: `<ul><li>a</li><li>b[]</li><li>c</li></ul>`,
});
await testEditor(BasicEditor, {
contentBefore: `<ol dir="rtl"><li>a</li><li>b[]</li><li>c</li></ol>`,
stepFunction: switchDirection,
contentAfter: `<ol><li>a</li><li>b[]</li><li>c</li></ol>`,
});
await testEditor(BasicEditor, {
removeCheckIds: true,
contentBefore: `<ul class="o_checklist" dir="rtl"><li>a</li><li>b[]</li><li>c</li></ul>`,
stepFunction: switchDirection,
contentAfter: `<ul class="o_checklist"><li>a</li><li>b[]</li><li>c</li></ul>`,
});
});
it('should properly switch the direction of nested list (rtl).', async () => {
await testEditor(BasicEditor, {
contentBefore: `<ul dir="rtl"><li>a[]</li><li class="oe-nested"><ul dir="rtl"><li>b</li><li>c</li></ul></li><li>d</li></ul>`,
stepFunction: switchDirection,
contentAfter: `<ul><li>a[]</li><li class="oe-nested"><ul><li>b</li><li>c</li></ul></li><li>d</li></ul>`,
});
await testEditor(BasicEditor, {
contentBefore: `<ol dir="rtl"><li>a[]</li><li class="oe-nested"><ol dir="rtl"><li>b</li><li>c</li></ol></li><li>d</li></ol>`,
stepFunction: switchDirection,
contentAfter: `<ol><li>a[]</li><li class="oe-nested"><ol><li>b</li><li>c</li></ol></li><li>d</li></ol>`,
});
await testEditor(BasicEditor, {
removeCheckIds: true,
contentBefore: `<ul class="o_checklist" dir="rtl"><li>a[]</li><li class="oe-nested"><ul class="o_checklist" dir="rtl"><li>b</li><li>c</li></ul></li><li>d</li></ul>`,
stepFunction: switchDirection,
contentAfter: `<ul class="o_checklist"><li>a[]</li><li class="oe-nested"><ul class="o_checklist"><li>b</li><li>c</li></ul></li><li>d</li></ul>`,
});
await testEditor(BasicEditor, {
removeCheckIds: true,
contentBefore: `<ul dir="rtl"><li>a[]</li><li class="oe-nested"><ul class="o_checklist" dir="rtl"><li>b</li><li class="oe-nested"><ol dir="rtl"><li>g</li><li>e</li></ol></li><li>c</li></ul></li><li>d</li></ul>`,
stepFunction: switchDirection,
contentAfter: `<ul><li>a[]</li><li class="oe-nested"><ul class="o_checklist"><li>b</li><li class="oe-nested"><ol><li>g</li><li>e</li></ol></li><li>c</li></ul></li><li>d</li></ul>`,
});
});
});
});
});
addons/web_editor/static/src/js/editor/odoo-editor/test/utils.js
+4
View File
@@ -521,6 +521,10 @@ export async function insertParagraphBreak(editor) {
editor.execCommand('oEnter');
}
export async function switchDirection(editor) {
editor.execCommand('switchDirection');
}
export async function insertLineBreak(editor) {
editor.execCommand('oShiftEnter');
}