From 7fe1731c660daabdf644e5c7f0b0943d9d262511 Mon Sep 17 00:00:00 2001
From: Rodolpho Lima <rcdl@odoo.com>
Date: Fri, 14 Apr 2023 19:40:21 +0200
Subject: [PATCH] [FIX] web_editor: update link content on URL change

If a link's content is equivalent to its URL, two problems can arise
when its URL is changed via the LinkTools:
- The link's content becomes outdated, showing a different URL;
- On LinkTools destroy, the OdooEditor mechanism that updates a link's
href on label(content) change will update the href according to the old
label, effectively reverting the changes in the URL.

This commit avoids such issues by syncing the label with the URL input
field in such cases.

task-3284649

X-original-commit: 8ddcc08c1700151e697ecb3c0c1daec2db9f8fd2
Part-of: odoo/odoo#136278
---
 .../src/js/wysiwyg/widgets/link_tools.js      | 20 +++++++++++++++++++
 1 file changed, 20 insertions(+)

diff --git a/addons/web_editor/static/src/js/wysiwyg/widgets/link_tools.js b/addons/web_editor/static/src/js/wysiwyg/widgets/link_tools.js
index a7fad1a9860..9e4a427f130 100644
--- a/addons/web_editor/static/src/js/wysiwyg/widgets/link_tools.js
+++ b/addons/web_editor/static/src/js/wysiwyg/widgets/link_tools.js
@@ -470,6 +470,7 @@ export class LinkTools extends Link {
     __onURLInput() {
         super.__onURLInput(...arguments);
         this.props.wysiwyg.odooEditor.historyPauseSteps('_onURLInput');
+        this._syncContent();
         this._adaptPreview();
         this.props.wysiwyg.odooEditor.historyUnpauseSteps('_onURLInput');
     }
@@ -490,6 +491,25 @@ export class LinkTools extends Link {
         this._updateLinkContent(this.$link, data, {force: true});
         this._observer.observe(this.props.link, {subtree: true, childList: true, characterData: true});
     }
+    /* If content is equal to previous URL, update it to match current URL.
+     *
+     * @private
+     */
+    _syncContent() {
+        const previousUrl = this.linkEl.getAttribute('href');
+        if (!previousUrl) {
+            return;
+        }
+        const protocolLessPrevUrl = previousUrl.replace(/^https?:\/\/|^mailto:/i, '');
+        const content = this.linkEl.innerText;
+        if (content === previousUrl || content === protocolLessPrevUrl) {
+            const newUrl = this.linkComponentWrapperRef.el.querySelector('input[name="url"]').value;
+            const protocolLessNewUrl = newUrl.replace(/^https?:\/\/|^mailto:/i, '')
+            const newContent = content.replace(protocolLessPrevUrl, protocolLessNewUrl);
+            this.linkComponentWrapperRef.el.querySelector('#o_link_dialog_label_input').value = newContent;
+            this._onLabelInput();
+        }
+    }
 }
 
 export function shouldUnlink(link, colorCombinationClass) {