diff --git a/addons/web_editor/static/src/js/backend.js b/addons/web_editor/static/src/js/backend.js index 964ececa06b..1c5feb7a7d4 100644 --- a/addons/web_editor/static/src/js/backend.js +++ b/addons/web_editor/static/src/js/backend.js @@ -146,7 +146,7 @@ var FieldTextHtmlSimple = widget.extend({ this.$content.html(this.text_to_html(value)); if (this.get("effective_readonly")) { this.resize(); - } else { + } else if (this.options['style-inline']) { transcoder.style_to_class(this.$content); } if (this.$content.is(document.activeElement)) { diff --git a/addons/web_editor/static/src/js/transcoder.js b/addons/web_editor/static/src/js/transcoder.js index a5cf20575d4..aff3b3210f6 100644 --- a/addons/web_editor/static/src/js/transcoder.js +++ b/addons/web_editor/static/src/js/transcoder.js @@ -182,14 +182,34 @@ var img_to_font = function ($editable) { }); }; +/* + * Utility function to apply function over descendants elements + * + * This is needed until the following issue of jQuery is solved: + * https://github.com./jquery/sizzle/issues/403 + * + * @param {Element} node The root Element node + * @param {Function} func The function applied over descendants + */ +var applyOverDescendants = function (node, func) { + node = node.firstChild; + while (node) { + if (node.nodeType === 1) { + func(node); + applyOverDescendants(node, func); + } + node = node.nextSibling; + } +}; + // convert class into inline style to send by mail var class_to_style = function ($editable) { if (!rulesCache.length) { getMatchedCSSRules($editable[0]); } - $editable.find('*').each(function () { - var $target = $(this); - var css = getMatchedCSSRules(this); + applyOverDescendants($editable[0], function (node) { + var $target = $(node); + var css = getMatchedCSSRules(node); var style = $target.attr("style") || ""; _.each(css, function (v,k) { if (!(new RegExp('(^|;)\s*' + k).test(style))) { @@ -209,9 +229,9 @@ var style_to_class = function ($editable) { var $c = $('').appendTo("body"); - $editable.find('*').each(function () { - var $target = $(this); - var css = getMatchedCSSRules(this); + applyOverDescendants($editable[0], function (node) { + var $target = $(node); + var css = getMatchedCSSRules(node); var style = ""; _.each(css, function (v,k) { if (!(new RegExp('(^|;)\s*' + k).test(style))) {