[FIX] web_editor: inconsistent behaviour of the font size selection

Before this commit:

Selecting some text and changing its size will never allow you to select 13 and
selecting default will make the text bigger than the surrounding text.
Example in project: the default size is 13px (the editor parses that info and
display 13px as the font-size), but if you want to set any text to that value
you can't. Users could set any text to that value by selecting
"default" font-size instead of 13

After this commit:

"default" sets to "font-size: medium", which is often not correct. It should
instead, do a "font-size: inherit" so that it's the default for the current
context. Hence, removed that medium font-size rule and let the cascade do it.

Task-3095887

closes odoo/odoo#109835

X-original-commit: 9878579f62b493958bb6a98e2cdc466bfc2954d8
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
This commit is contained in:
vishal padhiyar
2023-01-13 17:33:17 +01:00
committed by Hiral Bhavsar
parent cea588b1ed
commit a3d20bd96d
3 changed files with 16 additions and 2 deletions
@@ -1048,7 +1048,7 @@ export const formatSelection = (editor, formatName, {applyStyle, formatProps} =
tag.remove();
formatSpec.addStyle(getOrCreateSpan(selectedTextNode, inlineAncestors), formatProps);
}
} else {
} else if (formatName !== 'fontSize' || formatProps.size !== undefined) {
formatSpec.addStyle(getOrCreateSpan(selectedTextNode, inlineAncestors), formatProps);
}
}
@@ -745,6 +745,20 @@ describe('Format', () => {
contentAfter: '<p style="font-size: 10px">b[c]d</p>',
});
});
it('should change the font-size to default', async () => {
await testEditor(BasicEditor, {
contentBefore: '<p>[ab]</p>',
stepFunction: setFontSize(),
contentAfter: '<p>[ab]</p>',
});
});
it('should change the font-size to default removing the existing style with no empty span at the end', async () => {
await testEditor(BasicEditor, {
contentBefore: '<p><span style="font-size: 36px;">[abc]</span></p>',
stepFunction: setFontSize(),
contentAfter: '<p>[abc]</p>',
});
});
});
it('should add style to a span parent of an inline', async () => {
+1 -1
View File
@@ -84,7 +84,7 @@
<span id="fontSizeCurrentValue"></span>
</button>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="#" data-call="setFontSize" data-arg1="medium">default</a></li>
<li><a class="dropdown-item" href="#" data-call="setFontSize">default</a></li>
<li><a class="dropdown-item" href="#" data-call="setFontSize" data-arg1="8px">8</a></li>
<li><a class="dropdown-item" href="#" data-call="setFontSize" data-arg1="9px">9</a></li>
<li><a class="dropdown-item" href="#" data-call="setFontSize" data-arg1="10px">10</a></li>