From 14cb5ccfea3f3699fc055f5306ac6e8dda9f5432 Mon Sep 17 00:00:00 2001
From: Antoine Guenet <age@odoo.com>
Date: Tue, 17 May 2022 13:54:59 +0000
Subject: [PATCH] [FIX] mass_mailing: do not allow links within
 background-image elements

Since background-image elements and their children will be flattened
into images, links within them won't work. This removes the link button
of the editor toolbar, as well as the link and button commands in those
contexts.

task-2856858

Part-of: odoo/odoo#91314
---
 addons/mass_mailing/static/src/js/wysiwyg.js  | 30 +++++++++++++++++--
 .../lib/odoo-editor/src/powerbox/Powerbox.js  |  3 ++
 2 files changed, 31 insertions(+), 2 deletions(-)

diff --git a/addons/mass_mailing/static/src/js/wysiwyg.js b/addons/mass_mailing/static/src/js/wysiwyg.js
index e827a10797e..4fd836b9a3c 100644
--- a/addons/mass_mailing/static/src/js/wysiwyg.js
+++ b/addons/mass_mailing/static/src/js/wysiwyg.js
@@ -3,6 +3,7 @@ odoo.define('mass_mailing.wysiwyg', function (require) {
 
 var Wysiwyg = require('web_editor.wysiwyg');
 var MassMailingSnippetsMenu = require('mass_mailing.snippets.editor');
+const {closestElement} = require('@web_editor/../lib/odoo-editor/src/OdooEditor');
 
 const MassMailingWysiwyg = Wysiwyg.extend({
     //--------------------------------------------------------------------------
@@ -38,13 +39,38 @@ const MassMailingWysiwyg = Wysiwyg.extend({
      */
     _getCommands: function () {
         const commands = this._super();
-        const linkCommand = commands.find(command => command.title === 'Link');
-        if (linkCommand) {
+        const linkCommands = commands.filter(command => command.title === 'Link' || command.title === 'Button');
+        for (const linkCommand of linkCommands) {
             // Don't open the dialog: use the link tools.
             linkCommand.callback = () => this.toggleLinkTools({forceDialog: false});
+            // Remove the command if the selection is within a background-image.
+            const superIsDisabled = linkCommand.isDisabled;
+            linkCommand.isDisabled = () => {
+                if (superIsDisabled && superIsDisabled()) {
+                    return true;
+                } else {
+                    const selection = this.odooEditor.document.getSelection();
+                    const range = selection.rangeCount && selection.getRangeAt(0);
+                    return !!range && !!closestElement(range.startContainer, '[style*=background-image]');
+                }
+            }
         }
         return commands;
     },
+    /**
+     * @override
+     */
+     _updateEditorUI: function (e) {
+        this._super(...arguments);
+        // Hide the create-link button if the selection is within a
+        // background-image.
+        const selection = this.odooEditor.document.getSelection();
+        const range = selection.rangeCount && selection.getRangeAt(0);
+        const isWithinBackgroundImage = !!range && !!closestElement(range.startContainer, '[style*=background-image]');
+        if (isWithinBackgroundImage) {
+            this.toolbar.$el.find('#create-link').toggleClass('d-none', true);
+        }
+    },
 });
 
 return MassMailingWysiwyg;
diff --git a/addons/web_editor/static/lib/odoo-editor/src/powerbox/Powerbox.js b/addons/web_editor/static/lib/odoo-editor/src/powerbox/Powerbox.js
index 812f7af3ef8..0088dd05a6b 100644
--- a/addons/web_editor/static/lib/odoo-editor/src/powerbox/Powerbox.js
+++ b/addons/web_editor/static/lib/odoo-editor/src/powerbox/Powerbox.js
@@ -56,6 +56,9 @@ export class Powerbox {
         clearTimeout(this._renderingTimeout);
         this._hoverActive = false;
 
+        // Do not show disabled commands.
+        commands = commands.filter(command => !command.isDisabled || !command.isDisabled());
+
         this._mainWrapperElement.classList.toggle('oe-commandbar-noResult', commands.length === 0);
         if (commands.length === 0) {
             return;