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 ff2fa97e151..d9a636a391e 100644 --- a/addons/web_editor/static/src/js/wysiwyg/widgets/link.js +++ b/addons/web_editor/static/src/js/wysiwyg/widgets/link.js @@ -84,9 +84,14 @@ const Link = Widget.extend({ $node = $node.parent(); } const linkNode = this.$link[0] || this.data.range.cloneContents(); - const linkText = linkNode.innerHTML || linkNode.textContent; + const linkText = linkNode.textContent; this.data.content = linkText.replace(/[ \t\r\n]+/g, ' '); this.data.originalText = this.data.content; + if (linkNode instanceof DocumentFragment) { + this.data.originalHTML = $('').append(linkNode).html(); + } else { + this.data.originalHTML = linkNode.innerHTML; + } this.data.url = this.$link.attr('href') || ''; } else { this.data.content = this.data.content ? this.data.content.replace(/[ \t\r\n]+/g, ' ') : ''; @@ -199,17 +204,7 @@ const Link = Widget.extend({ if (!this.$link.attr('target')) { this.$link[0].removeAttribute('target'); } - if (this._setLinkContent && (data.content !== this.data.originalText || data.url !== this.data.url)) { - const content = (data.content && data.content.length) ? data.content : data.url; - // If there is a this.data.originalText, it means that we selected - // the text and we could not change the content through the text - // input.html() is needed in case we selected rich html content. - if (this.data.originalText) { - this.$link.html(content); - } else { - this.$link.text(content); - } - } + this._updateLinkContent(this.$link, data); }, /** * Return the link element to edit. Create one from selection if none was @@ -459,6 +454,25 @@ const Link = Widget.extend({ * @param {boolean} [active] */ _setSelectOption: function ($option, active) {}, + /** + * Update the link content. + * + * @private + * @param {JQuery} $link + * @param {object} linkInfos + * @param {boolean} force + */ + _updateLinkContent($link, linkInfos, { force = false } = {}) { + if (force || (this._setLinkContent && (linkInfos.content !== this.data.originalText || linkInfos.url !== this.data.url))) { + if (linkInfos.content === this.data.originalText) { + $link.html(this.data.originalHTML); + } else if (linkInfos.content && linkInfos.content.length) { + $link.text(linkInfos.content); + } else { + $link.text(linkInfos.url); + } + } + }, /** * @abstract * @private diff --git a/addons/web_editor/static/src/js/wysiwyg/widgets/link_dialog.js b/addons/web_editor/static/src/js/wysiwyg/widgets/link_dialog.js index e9eacae0168..3f9b5db156f 100644 --- a/addons/web_editor/static/src/js/wysiwyg/widgets/link_dialog.js +++ b/addons/web_editor/static/src/js/wysiwyg/widgets/link_dialog.js @@ -74,7 +74,10 @@ const _DialogLinkWidget = Link.extend({ href: data.url && data.url.length ? data.url : '#', class: `${data.classes.replace(/float-\w+/, '')} o_btn_preview`, }; - this.$("#link-preview").attr(attrs).html((data.content && data.content.length) ? data.content : data.url); + + const $linkPreview = this.$("#link-preview"); + $linkPreview.attr(attrs); + this._updateLinkContent($linkPreview, data, { force: true }); }, /** * @override diff --git a/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js b/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js index 9d2477662b6..f3cfec6fe1a 100644 --- a/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js +++ b/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js @@ -948,7 +948,9 @@ const Wysiwyg = Widget.extend({ const linkDialog = new weWidgets.LinkDialog(this, { forceNewWindow: this.options.linkForceNewWindow, wysiwyg: this, - }, this.$editable[0], {}, undefined, options.link); + }, this.$editable[0], { + needLabel: true, + }, undefined, options.link); const restoreSelection = preserveCursor(this.odooEditor.document); linkDialog.open(); linkDialog.on('save', this, data => {