From e2cf0a235810c1773bac68592a0dce9a67adbc34 Mon Sep 17 00:00:00 2001 From: qsm-odoo Date: Thu, 28 May 2020 10:04:22 +0000 Subject: [PATCH] [FIX] website, *: review theme tab creation + switching *: web_editor When clicking on the theme tab on an empty page, a scrollbar appeared and stayed. This was because the fake `` element was focused and the overlay positioned randomly outside of the page. This commit fixes that by simplifying the code and always hiding the related overlay. This commit also makes sure the onFocus/onBlur method of the theme options are called consistently, even though they are probably not useful. Part of https://github.com/odoo/odoo/pull/52081 closes odoo/odoo#52114 X-original-commit: 7760898de4e14fa30db1db87dfa05276bfcaa2bb Signed-off-by: Quentin Smetz (qsm) --- .../static/src/js/editor/snippets.editor.js | 6 +++--- .../static/src/js/editor/snippets.editor.js | 18 +++++++++--------- 2 files changed, 12 insertions(+), 12 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 3a91fe2be1c..2870303a53a 100644 --- a/addons/web_editor/static/src/js/editor/snippets.editor.js +++ b/addons/web_editor/static/src/js/editor/snippets.editor.js @@ -1872,10 +1872,10 @@ var SnippetsMenu = Widget.extend({ tab = tab || this.tabs.BLOCKS; - while (this.customizePanel.firstChild) { - this.customizePanel.removeChild(this.customizePanel.firstChild); - } if (content) { + while (this.customizePanel.firstChild) { + this.customizePanel.removeChild(this.customizePanel.firstChild); + } $(this.customizePanel).append(content); } diff --git a/addons/website/static/src/js/editor/snippets.editor.js b/addons/website/static/src/js/editor/snippets.editor.js index e5b1d525316..dd4f974918b 100644 --- a/addons/website/static/src/js/editor/snippets.editor.js +++ b/addons/website/static/src/js/editor/snippets.editor.js @@ -52,17 +52,17 @@ weSnippetEditor.Class.include({ this.el.appendChild(this.fakeThemeEl); } - await this._activateSnippet($(this.fakeThemeEl)); - - if (!this.themeCustomizationMenuEl) { - this.themeCustomizationMenuEl = document.createElement('div'); - for (const node of this.customizePanel.childNodes) { - this.themeCustomizationMenuEl.appendChild(node); - } - } + // Need all of this in that order so that: + // - the element is visible and can be enabled and the onFocus method is + // called each time. + // - the element is hidden afterwards so it does not take space in the + // DOM, same as the overlay which may make a scrollbar appear. + this.fakeThemeEl.classList.remove('d-none'); + const editor = await this._activateSnippet($(this.fakeThemeEl)); + this.fakeThemeEl.classList.add('d-none'); + editor.toggleOverlay(false); this._updateLeftPanelContent({ - content: this.themeCustomizationMenuEl, tab: this.tabs.THEME, }); },