[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>
This commit is contained in:
qsm-odoo
2023-10-18 13:39:12 +00:00
parent a2f985a84d
commit b867cf3395
@@ -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>");