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

[FIX] web_editor: strange padding when background color is reset

Browse Source 
Before this commit:

On applying background or on remove background color, strange padding
is added on the text.

After this commit:

Now, padding is not added when background is colored is applied or background
color is removed.

task-3237693

closes odoo/odoo#138143

X-original-commit: 29a40a30f3bf7a4a3a205e54fb84e569691d961f
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
This commit is contained in:
Odoo
2023-10-10 09:42:17 +00:00
committed by maad-odoo
parent 01aac8ed9e
commit 7f35c48ef5
3 changed files with 40 additions and 6 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
+3 -3
View File
@@ -51,8 +51,8 @@ import {
resetOuids,
} from '../utils/utils.js';
const TEXT_CLASSES_REGEX = /\btext-[^\s]*\b/g;
const BG_CLASSES_REGEX = /\bbg-[^\s]*\b/g;
const TEXT_CLASSES_REGEX = /\btext-[^\s]*\b/;
const BG_CLASSES_REGEX = /\bbg-[^\s]*\b/;
function align(editor, mode) {
const sel = editor.document.getSelection();
@@ -620,7 +620,7 @@ export const editorCommands = {
const fontsSet = new Set(fonts);
for (const font of fontsSet) {
colorElement(font, color, mode);
if (!hasColor(font, mode) && !font.hasAttribute('style')) {
if ((!hasColor(font, 'color') && !hasColor(font,'backgroundColor')) && (!font.hasAttribute('style') || !color)) {
for (const child of [...font.childNodes]) {
font.parentNode.insertBefore(child, font);
}
addons/web_editor/static/src/js/editor/odoo-editor/test/spec/color.test.js
+36
View File
@@ -106,6 +106,42 @@ describe('applyColor', () => {
`),
});
});
it('should remove font tag after removing font color', async () => {
await testEditor(BasicEditor, {
contentBefore: '<p><font style="color: rgb(255, 0, 0);">[abcabc]</font></p>',
stepFunction: setColor('', 'color'),
contentAfter: '<p>[abcabc]</p>',
});
await testEditor(BasicEditor, {
contentBefore: '<p><font class="text-400">[abcabc]</font></p>',
stepFunction: setColor('', 'color'),
contentAfter: '<p>[abcabc]</p>',
});
});
it('should remove font tag after removing background color applied as style', async () => {
await testEditor(BasicEditor, {
contentBefore: '<p><font style="background-color: rgb(255, 0, 0);">[abcabc]</font></p>',
stepFunction: setColor('', 'backgroundColor'),
contentAfter: '<p>[abcabc]</p>',
});
await testEditor(BasicEditor, {
contentBefore: '<p><font class="bg-200">[abcabc]</font></p>',
stepFunction: setColor('', 'backgroundColor'),
contentAfter: '<p>[abcabc]</p>',
});
});
it('should remove font tag if font-color and background-color both are removed one by one', async () => {
await testEditor(BasicEditor, {
contentBefore: '<p><font style="color: rgb(255, 0, 0);" class="bg-200">[abcabc]</font></p>',
stepFunction: setColor('','backgroundColor') && setColor('','color'),
contentAfter: '<p>[abcabc]</p>',
});
await testEditor(BasicEditor, {
contentBefore: '<p><font style="background-color: rgb(255, 0, 0);" class="text-900">[abcabc]</font></p>',
stepFunction: setColor('','color') && setColor('','backgroundColor'),
contentAfter: '<p>[abcabc]</p>',
});
});
});
describe('rgbToHex', () => {
it('should convert an rgb color to hexadecimal', async () => {
addons/web_editor/static/src/js/wysiwyg/wysiwyg.js
+1 -3
View File
@@ -1880,9 +1880,7 @@ export class Wysiwyg extends Component {
this.odooEditor.historyStash();
}
_processAndApplyColor(colorType, color, previewMode) {
if (!color) {
color = 'inherit';
} else if (!isCSSColor(color) && !weUtils.isColorGradient(color)) {
if (color && !isCSSColor(color) && !weUtils.isColorGradient(color)) {
color = (colorType === "text" ? 'text-' : 'bg-') + color;
}
const coloredElements = this.odooEditor.execCommand('applyColor', color, colorType === 'text' ? 'color' : 'backgroundColor', this.lastMediaClicked);