[IMP] web_editor: allow to temporary block preview overlay toggling

This will allow to do the following:

1) Show a preview overlay over an element
2) Block preview overlays -> the overlay at step 1 stays no matter what
3) Encourage the user to do something that edits what the preview
   overlay is currently showing.
4) The edition is finished, go back to normal by unblocking preview
   overlays.

Part of https://github.com/odoo/odoo/pull/38959
task-2066614

addons/web_editor/static/src/js/editor/snippets.editor.js

@@ -736,6 +736,8 @@ var SnippetsMenu = Widget.extend({
         'reload_snippet_dropzones': '_disableUndroppableSnippets',
         'update_customize_elements': '_onUpdateCustomizeElements',
         'hide_overlay': '_onHideOverlay',
+        'block_preview_overlays': '_onBlockPreviewOverlays',
+        'unblock_preview_overlays': '_onUnblockPreviewOverlays',
     },
 
     /**
@@ -1123,6 +1125,9 @@ var SnippetsMenu = Widget.extend({
      *          (might be async when an editor must be created)
      */
     _activateSnippet: function ($snippet, previewMode, ifInactiveOptions) {
+        if (this._blockPreviewOverlays && previewMode) {
+            return Promise.resolve();
+        }
         return this._activateSnippetMutex.exec(() => {
             return new Promise(resolve => {
                 // Take the first parent of the provided DOM (or itself) which
@@ -1838,6 +1843,18 @@ var SnippetsMenu = Widget.extend({
             }],
         }).open();
     },
+    /**
+     * @private
+     */
+    _onBlockPreviewOverlays: function (ev) {
+        this._blockPreviewOverlays = true;
+    },
+    /**
+     * @private
+     */
+    _onUnblockPreviewOverlays: function (ev) {
+        this._blockPreviewOverlays = false;
+    },
     /**
      * @private
      * @param {OdooEvent} ev

addons/web_editor/static/src/scss/wysiwyg_snippets.scss

@@ -776,6 +776,7 @@ body.editor_enable.editor_has_snippets {
         }
 
         &.o_we_overlay_preview {
+            pointer-events: none;
             border-color: $o-we-handles-accent-color-preview;
 
             > .o_handles {