[FIX] web_editor: readonly links opening in the same tab

Before this commit, when viewing the content of an html field in readonly mode, internal links (same origin or relative links) that did not have the target attribute set to "_blank" would be opened in the same browser tab. This is undesired, and particularly disturbing when the content is inside an iframe. This commit ensures that, in readonly mode, all links are opened in a new tab. task-3323602 closes odoo/odoo#125024 Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>

[FIX] web_editor: readonly links opening in the same tab
cb84f993 · Rodolpho Lima · a28b6a6f · cb84f993 · cb84f993
Commit cb84f993 authored 1 year ago by Rodolpho Lima
--- a/addons/web_editor/static/src/js/backend/html_field.js
+++ b/addons/web_editor/static/src/js/backend/html_field.js
@@ -734,10 +734,10 @@ function stripHistoryIds(value) {
    return value && value.replace(/\sdata-last-history-steps="[^"]*?"/, '') || value;
 }

-// Ensure all external links are opened in a new tab.
+// Ensure all links are opened in a new tab.
 const retargetLinks = (container) => {
-    for (const externalLink of container.querySelectorAll(`a:not([href^="${location.origin}"]):not([href^="/"])`)) {
-        externalLink.setAttribute('target', '_blank');
-        externalLink.setAttribute('rel', 'noreferrer');
+    for (const link of container.querySelectorAll('a')) {
+        link.setAttribute('target', '_blank');
+        link.setAttribute('rel', 'noreferrer');
    }
 }
--- a/addons/web_editor/static/tests/html_field_tests.js
+++ b/addons/web_editor/static/tests/html_field_tests.js
@@ -256,4 +256,33 @@ QUnit.module("WebEditor.HtmlField", ({ beforeEach }) => {
        assert.containsOnce(target, '.o_field_html[name="txt"] iframe[sandbox="allow-same-origin allow-popups allow-popups-to-escape-sandbox"]');
    });

+    QUnit.module('Readonly mode');
+
+    QUnit.test("Links should open on a new tab", async (assert) => {
+        assert.expect(6);
+        serverData.models.partner.records = [{
+            id: 1,
+            txt: `
+                <body>
+                    <a href="/contactus">Relative link</a>
+                    <a href="${location.origin}/contactus">Internal link</a>
+                    <a href="https://google.com">External link</a>
+                </body>`,
+        }];
+        await makeView({
+            type: "form",
+            resId: 1,
+            resModel: "partner",
+            serverData,
+            arch: `
+                <form>
+                    <field name="txt" widget="html" readonly="1"/>
+                </form>`,
+        });
+
+        for (const link of target.querySelectorAll('a')) {
+            assert.strictEqual(link.getAttribute('target'), '_blank');
+            assert.strictEqual(link.getAttribute('rel'), 'noreferrer');
+        }
+    });
 });