[IMP] web_editor: allow async parts in onFocus/onBlur

Part of https://github.com/odoo/odoo/pull/74941

Part-of: odoo/odoo#74941

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

@@ -573,15 +573,15 @@ var SnippetEditor = Widget.extend({
         // affect another option (like updating the $target)
         const editorUIsToUpdate = [];
         const focusOrBlur = show
-            ? (editor, options) => {
+            ? async (editor, options) => {
                 for (const opt of options) {
-                    opt.onFocus();
+                    await opt.onFocus();
                 }
                 editorUIsToUpdate.push(editor);
             }
-            : (editor, options) => {
+            : async (editor, options) => {
                 for (const opt of options) {
-                    opt.onBlur();
+                    await opt.onBlur();
                 }
             };
         for (const $el of this._customize$Elements) {
@@ -590,8 +590,8 @@ var SnippetEditor = Widget.extend({
                 .values()
                 .sortBy('__order')
                 .value();
-            // TODO ideally: allow async parts in onFocus/onBlur
-            focusOrBlur(editor, styles);
+
+            await focusOrBlur(editor, styles);
         }
         await Promise.all(editorUIsToUpdate.map(editor => editor.updateOptionsUI()));
         await Promise.all(editorUIsToUpdate.map(editor => editor.updateOptionsUIVisibility()));

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

@@ -2900,8 +2900,9 @@ const SnippetOptionWidget = Widget.extend({
      * (the first time, this follows the call to the @see start method).
      *
      * @abstract
+     * @returns {Promise|undefined}
      */
-    onFocus: function () {},
+    async onFocus() {},
     /**
      * Called when the parent edition overlay is covering the associated snippet
      * for the first time, when it is a new snippet dropped from the d&d snippet
@@ -2915,8 +2916,9 @@ const SnippetOptionWidget = Widget.extend({
      * snippet (another snippet enters edition for example).
      *
      * @abstract
+     * @returns {Promise|undefined}
      */
-    onBlur: function () {},
+    async onBlur() {},
     /**
      * Called when the associated snippet is the result of the cloning of
      * another snippet (so `this.$target` is a cloned element).