[IMP] website: Remove hardcoded domains from website menus

A common software development pattern is to have the same data replicated across different environments, such as production and staging. This happens i.e. in Odoo.sh.

Let's assume your production instance is in ``https://www.example.com`` and your staging one is in ``https://staging.example.com``. Then:

1. A user in production modifies a website menu and makes it link to ``https://www.example.com/my-cool-page``.
1. A new change lands in staging, with a fresh copy of the production database.
1. The user goes to ``https://staging.example.com`` and navigates through the menus to validate the changes.
1. While navigating, he clicks in the website menu that links to ``https://www.example.com/my-cool-page``.
1. He makes some changes. **He didn't realize he was modifying production**.

To avoid this kind of problems, if a user pastes a link that starts with the current domain, it gets removed.

closes odoo/odoo#35715

Signed-off-by: Jérémy Kersten (jke) <jke@openerp.com>

2 files changed, 12 insertions, 1 deletions

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 236725dcace..6e8ec03f1f8 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
@@ -71,6 +71,7 @@ var LinkDialog = Dialog.extend({
         if (this.data.url) {
             var match = /mailto:(.+)/.exec(this.data.url);
             this.$('input[name="url"]').val(match ? match[1] : this.data.url);
+            this._onURLInput();
         }
 
         // Hide the duplicate color buttons (most of the times, primary = alpha
@@ -184,6 +185,8 @@ var LinkDialog = Dialog.extend({
 
         if (url.indexOf('@') >= 0 && url.indexOf('mailto:') < 0 && !url.match(/^http[s]?/i)) {
             url = ('mailto:' + url);
+        } else if (url.indexOf(location.origin) === 0 && this.$('#o_link_dialog_url_strip_domain').prop("checked")) {
+            url = url.slice(location.origin.length);
         }
         var allWhitespace = /\s+/gi;
         var allStartAndEndSpace = /^\s+|\s+$/gi;
@@ -211,8 +214,10 @@ var LinkDialog = Dialog.extend({
     _onURLInput: function () {
         var $linkUrlInput = this.$('#o_link_dialog_url_input');
         $linkUrlInput.closest('.form-group').removeClass('o_has_error').find('.form-control, .custom-select').removeClass('is-invalid');
-        var isLink = $linkUrlInput.val().indexOf('@') < 0;
+        let value = $linkUrlInput.val();
+        let isLink = value.indexOf('@') < 0;
         this.$('input[name="is_new_window"]').closest('.form-group').toggleClass('d-none', !isLink);
+        this.$('.o_strip_domain').toggleClass('d-none', value.indexOf(window.location.origin) !== 0);
     },
 });
 
diff --git a/addons/web_editor/static/src/xml/wysiwyg.xml b/addons/web_editor/static/src/xml/wysiwyg.xml
index bcf3a480a93..4c5ffaa50c2 100644
--- a/addons/web_editor/static/src/xml/wysiwyg.xml
+++ b/addons/web_editor/static/src/xml/wysiwyg.xml
@@ -440,6 +440,12 @@
                     <label class="col-form-label col-md-3" for="o_link_dialog_url_input">URL or Email</label>
                     <div class="col-md-9">
                         <input type="text" name="url" class="form-control" id="o_link_dialog_url_input" required="required"/>
+                        <div class="form-check text-muted o_strip_domain">
+                            <input type="checkbox" id="o_link_dialog_url_strip_domain" checked="checked" class="form-check-input"/>
+                            <label for="o_link_dialog_url_strip_domain" class="form-check-label">
+                                Autoconvert to relative link
+                            </label>
+                        </div>
                     </div>
                 </div>
                 <div class="form-group row">