From 70cafe7cca350cb49a53c39325ee64b4d92b8a72 Mon Sep 17 00:00:00 2001 From: Benjamin Vray Date: Thu, 6 Oct 2022 09:05:47 +0000 Subject: [PATCH] [FIX] web_editor: fix classes removed from selected links Steps to reproduce the bug : - In website (edit mode), add a mega menu in the Header. - Choose the "Cards" template for the mega menu. - Click on a card of the mega menu. - Change the url of link in the editor panel toolbar. - The style of the card is broken. The issue is that when the link of the card is changed, 2 classes are removed from the link ('text-wrap' and 'text-center'). This is from code that removes all classes starting with "text-" and "btn-" when updating the link in the DOM. This commit fixes that by avoiding removing classes that should never be removed there. Note that a previous commit ([1]) had already corrected this but only for the "btn-block" class. This commit fixes the issue in a more generic way. [1]: https://github.com/odoo/odoo/commit/888687b487e95b4bf4fb080118b5eb945c8ab724 opw-2954714 task-3006845 closes odoo/odoo#110186 X-original-commit: 121af26cfee8a227ce5925d3a64a99c5bb63d35f Signed-off-by: Arthur Detroux (ard) --- addons/web_editor/static/src/js/wysiwyg/widgets/link.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/addons/web_editor/static/src/js/wysiwyg/widgets/link.js b/addons/web_editor/static/src/js/wysiwyg/widgets/link.js index 8d291dedff5..54b7028177f 100644 --- a/addons/web_editor/static/src/js/wysiwyg/widgets/link.js +++ b/addons/web_editor/static/src/js/wysiwyg/widgets/link.js @@ -105,13 +105,19 @@ const Link = Widget.extend({ this.data.isNewWindow = this.data.isNewWindow || this.linkEl.target === '_blank'; } + const classesToKeep = [ + 'text-wrap', 'text-nowrap', 'text-start', 'text-center', 'text-end', + 'text-truncate', + ]; + const keptClasses = this.data.iniClassName.split(' ').filter(className => classesToKeep.includes(className)); const allBtnColorPrefixes = /(^|\s+)(bg|text|border)(-[a-z0-9_-]*)?/gi; - const allBtnClassSuffixes = /(^|\s+)btn(?!-block)(-[a-z0-9_-]*)?/gi; + const allBtnClassSuffixes = /(^|\s+)btn(-[a-z0-9_-]*)?/gi; const allBtnShapes = /\s*(rounded-circle|flat)\s*/gi; this.data.className = this.data.iniClassName .replace(allBtnColorPrefixes, ' ') .replace(allBtnClassSuffixes, ' ') .replace(allBtnShapes, ' '); + this.data.className += ' ' + keptClasses.join(' '); // 'o_submit' class will force anchor to be handled as a button in linkdialog. if (/(?:s_website_form_send|o_submit)/.test(this.data.className)) { this.isButton = true;