From b867cf3395464dc6077bcd877fd2980bc3b3bf30 Mon Sep 17 00:00:00 2001
From: qsm-odoo <qsm@odoo.com>
Date: Tue, 17 Oct 2023 15:27:55 +0000
Subject: [PATCH] [FIX] web_editor: restore synchronous call to _addToolbar

Commit [1] changed a method to be asynchronous instead of synchronous
but did not care about where it was called or overridden. That code and
its surrounding needs to be refactored when fully switching to OWL.
Meanwhile this extracts the asynchronous part of the method to be done
once in all cases at initialization for now.

This is probably a cause of race condition or bugs but this was mainly
discovered during a master task development, preventing to code the new
feature properly.

[1]: https://github.com/odoo/odoo/commit/d7245d2abf528d093226c80e40975e63d61e8997

closes odoo/odoo#138985

X-original-commit: e26c007dd14de9d0cbf76181e8054a3498e67bd9
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
---
 .../static/src/js/editor/snippets.editor.js   | 64 +++++++++----------
 1 file changed, 31 insertions(+), 33 deletions(-)

diff --git a/addons/web_editor/static/src/js/editor/snippets.editor.js b/addons/web_editor/static/src/js/editor/snippets.editor.js
index c7000be83f5..b787d32cb04 100644
--- a/addons/web_editor/static/src/js/editor/snippets.editor.js
+++ b/addons/web_editor/static/src/js/editor/snippets.editor.js
@@ -1865,9 +1865,39 @@ var SnippetsMenu = Widget.extend({
 
         this.customizePanel = document.createElement('div');
         this.customizePanel.classList.add('o_we_customize_panel', 'd-none');
+
+        this._toolbarWrapperEl = document.createElement('div');
+        this._toolbarWrapperEl.classList.add('o_we_toolbar_wrapper');
+        class WebsiteToolbar extends Component {
+            static components = { Toolbar, LinkTools };
+            static template = xml`
+                <Toolbar t-props="props.wysiwygState.toolbarProps">
+                    <t t-if="props.wysiwygState.linkToolProps">
+                        <LinkTools t-props="props.wysiwygState.linkToolProps" />
+                    </t>
+                </Toolbar>
+            `;
+            static props = {
+                wysiwygState: Object,
+            };
+        }
+        // Add the toolbarWrapperEl to the dom for owl to properly mount the
+        // Toolbar.
+        document.body.append(this._toolbarWrapperEl);
+        this._toolbarWrapperEl.style.display = 'none';
+        await attachComponent(this, this._toolbarWrapperEl, WebsiteToolbar, {
+            wysiwygState: this.options.wysiwyg.state,
+        });
+        this._toolbarWrapperEl.style.display = 'contents';
+
+        const toolbarEl = this._toolbarWrapperEl.firstChild;
+        toolbarEl.classList.remove('oe-floating');
+        this.options.wysiwyg.toolbarEl.style.display = 'none';
+        this.options.wysiwyg.setupToolbar(toolbarEl);
         this._addToolbar();
         this._checkEditorToolbarVisibilityCallback = this._checkEditorToolbarVisibility.bind(this);
         $(this.options.wysiwyg.odooEditor.document.body).on('click', this._checkEditorToolbarVisibilityCallback);
+
         this.invisibleDOMPanelEl = document.createElement('div');
         this.invisibleDOMPanelEl.classList.add('o_we_invisible_el_panel');
         this.invisibleDOMPanelEl.appendChild(
@@ -4318,7 +4348,7 @@ var SnippetsMenu = Widget.extend({
     async _onUpdateInvisibleDom() {
         await this._updateInvisibleDOM();
     },
-    async _addToolbar(toolbarMode = "text") {
+    _addToolbar(toolbarMode = "text") {
         if (this.folded) {
             return;
         }
@@ -4334,38 +4364,6 @@ var SnippetsMenu = Widget.extend({
                 titleText = _t("Icon Formatting");
                 break;
         }
-
-        if (!this._toolbarWrapperEl) {
-            this._toolbarWrapperEl = document.createElement('div');
-            this._toolbarWrapperEl.classList.add('o_we_toolbar_wrapper');
-            class WebsiteToolbar extends Component {
-                static components = { Toolbar, LinkTools };
-                static template = xml`
-                    <Toolbar t-props="props.wysiwygState.toolbarProps">
-                        <t t-if="props.wysiwygState.linkToolProps">
-                            <LinkTools t-props="props.wysiwygState.linkToolProps" />
-                        </t>
-                    </Toolbar>
-                `;
-                static props = {
-                    wysiwygState: Object,
-                };
-            }
-            // Add the toolbarWrapperEl to the dom for owl to properly mount the
-            // Toolbar.
-            document.body.append(this._toolbarWrapperEl);
-            this._toolbarWrapperEl.style.display = 'none';
-            await attachComponent(this, this._toolbarWrapperEl, WebsiteToolbar, {
-                wysiwygState: this.options.wysiwyg.state,
-            });
-            this._toolbarWrapperEl.style.display = 'contents';
-
-            const toolbarEl = this._toolbarWrapperEl.firstChild;
-            toolbarEl.classList.remove('oe-floating');
-            this.options.wysiwyg.toolbarEl.style.display = 'none';
-            this.options.wysiwyg.setupToolbar(toolbarEl);
-        }
-
         // Create toolbar custom container.
         this._$toolbarContainer = $('<WE-CUSTOMIZEBLOCK-OPTIONS id="o_we_editor_toolbar_container"/>');
         const $title = $("<we-title><span>" + titleText + "</span></we-title>");