From 34d0f92a785876bf8dfe2e00f18ba52611c3c2ae Mon Sep 17 00:00:00 2001
From: Nicolas Bayet <nby@odoo.com>
Date: Wed, 10 Nov 2021 11:56:16 +0000
Subject: [PATCH] [FIX] web_editor: wait untill colorpicker is inserted

Before this commit, an update to the colorpicker could be called
multiples times with a `colorpicker` not yet in the document.

If a colorbpicker has been created, we need to await it's start method
to be fully resolved.

Task-2667983

closes odoo/odoo#79641

X-original-commit: 105208c8363f77130ee644ce8ec2e993d9955763
Signed-off-by: David Monjoie (dmo) <dmo@odoo.com>
Signed-off-by: Antoine Guenet <age@odoo.com>
---
 .../web_editor/static/src/js/wysiwyg/widgets/link_tools.js   | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

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 14f787c2a6c..b35e723a7a4 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
@@ -42,6 +42,7 @@ const LinkTools = Link.extend({
         // Keep track of each selected custom color and colorpicker.
         this.customColors = {};
         this.colorpickers = {};
+        this.colorpickersPromises = {};
     },
     /**
      * @override
@@ -227,6 +228,7 @@ const LinkTools = Link.extend({
         }[cssProperty];
 
         let colorpicker = this.colorpickers[cssProperty];
+        await this.colorpickersPromises[cssProperty];
         if (!colorpicker) {
             colorpicker = new ColorPaletteWidget(this, {
                 excluded: ['transparent_grayscale'],
@@ -239,7 +241,8 @@ const LinkTools = Link.extend({
                 'background-color': '.link-custom-color-fill .dropdown-menu',
                 'border-color': '.link-custom-color-border .o_we_so_color_palette .dropdown-menu',
             }[cssProperty]);
-            await colorpicker.appendTo($(target));
+            this.colorpickersPromises[cssProperty] = colorpicker.appendTo($(target));
+            await this.colorpickersPromises[cssProperty];
             colorpicker.on('custom_color_picked color_picked color_hover color_leave', this, (ev) => {
                 // Reset color styles in link content to make sure new color is not hidden.
                 // Only done when applied to avoid losing state during preview.