[IMP] web_editor, *: add visibility check for editor sub-widgets

*: website

Update the visibility (from dependencies and _computeWidgetVisibility
function) for all widgets, including the ones which are children of main
widgets (e.g. new ability to hide some choices from a select depending
on other options).

closes odoo/odoo#54162

Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>

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

@@ -1907,33 +1907,45 @@ const SnippetOptionWidget = Widget.extend({
                 obj = createPropertyProxy(this, '$target', $firstSubTarget);
             }
 
-            const show = await this._computeWidgetVisibility.call(obj, widget.getName(), params);
-            if (!show) {
-                widget.toggleVisibility(false);
-                return;
+            // Make sure to check the visibility of all sub-widgets. For
+            // simplicity and efficiency, those will be checked with main
+            // widgets params.
+            const allSubWidgets = [widget];
+            let i = 0;
+            while (i < allSubWidgets.length) {
+                allSubWidgets.push(...allSubWidgets[i]._userValueWidgets);
+                i++;
             }
-
-            const dependencies = widget.getDependencies();
-            const dependenciesData = [];
-            dependencies.forEach(depName => {
-                const toBeActive = (depName[0] !== '!');
-                if (!toBeActive) {
-                    depName = depName.substr(1);
+            const proms = allSubWidgets.map(async widget => {
+                const show = await this._computeWidgetVisibility.call(obj, widget.getName(), params);
+                if (!show) {
+                    widget.toggleVisibility(false);
+                    return;
                 }
 
-                const widget = this._requestUserValueWidgets(depName)[0];
-                if (widget) {
-                    dependenciesData.push({
-                        widget: widget,
-                        toBeActive: toBeActive,
-                    });
-                }
-            });
-            const dependenciesOK = !dependenciesData.length || dependenciesData.some(depData => {
-                return (depData.widget.isActive() === depData.toBeActive);
-            });
+                const dependencies = widget.getDependencies();
+                const dependenciesData = [];
+                dependencies.forEach(depName => {
+                    const toBeActive = (depName[0] !== '!');
+                    if (!toBeActive) {
+                        depName = depName.substr(1);
+                    }
 
-            widget.toggleVisibility(dependenciesOK);
+                    const widget = this._requestUserValueWidgets(depName)[0];
+                    if (widget) {
+                        dependenciesData.push({
+                            widget: widget,
+                            toBeActive: toBeActive,
+                        });
+                    }
+                });
+                const dependenciesOK = !dependenciesData.length || dependenciesData.some(depData => {
+                    return (depData.widget.isActive() === depData.toBeActive);
+                });
+
+                widget.toggleVisibility(dependenciesOK);
+            });
+            return Promise.all(proms);
         });
 
         const showUI = await this._computeVisibility();

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

@@ -1895,6 +1895,15 @@ options.registry.Box = options.Class.extend({
         }
         return this._super(...arguments);
     },
+    /**
+     * @override
+     */
+    async _computeWidgetVisibility(widgetName, params) {
+        if (widgetName === 'fake_inset_shadow_opt') {
+            return false;
+        }
+        return this._super(...arguments);
+    },
 });
 
 options.registry.CookiesBar = options.registry.SnippetPopup.extend({

addons/website/views/snippets/snippets.xml

@@ -167,7 +167,7 @@
         </we-row>
         <!-- Inset parameter always hidden (as controlled above) but needed -->
         <!-- for the we-multi widget to work properly. -->
-        <we-checkbox class="d-none" data-select-style="inset"/>
+        <we-checkbox data-name="fake_inset_shadow_opt" data-select-style="inset"/>
     </we-multi>
 </template>