[FIX] web: form: do not add "o_xxl_form_view" class in dialogs

This class is added automatically on large screens, to better
style the form view to benefit form the available space. However,
the width of dialogs is limited, so it makes no sense to apply
this classname in this case. If we do, those form views may display
an horizontal scrollbar. For instance: in project with worksheets
enabled, create and edit a worksheet many2one.

Part-of: odoo/odoo#99503

addons/web/static/src/views/form/form_controller.js

@@ -397,17 +397,17 @@ export class FormController extends Component {
     }
 
     get className() {
+        const result = {};
         const { size } = this.ui;
-        let sizeClass = "";
         if (size <= SIZES.XS) {
-            sizeClass = "o_xxs_form_view";
-        } else if (size === SIZES.XXL) {
-            sizeClass = "o_xxl_form_view h-100";
+            result.o_xxs_form_view = true;
+        } else if (!this.env.inDialog && size === SIZES.XXL) {
+            result["o_xxl_form_view h-100"] = true;
         }
-        return {
-            [this.props.className]: true,
-            [sizeClass]: true,
-        };
+        if (this.props.className) {
+            result[this.props.className] = true;
+        }
+        return result;
     }
 }
 

addons/web/static/tests/views/form/form_view_tests.js

@@ -2523,6 +2523,41 @@ QUnit.module("Views", (hooks) => {
         assert.containsNone(target, ".o_dialog .o_form_view .o_control_panel");
     });
 
+    QUnit.test("form views in dialogs do not have class o_xxl_form_view", async function (assert) {
+        const bus = new EventBus();
+        registry.category("services").add("ui", {
+            start(env) {
+                Object.defineProperty(env, "isSmall", {
+                    value: false,
+                });
+                return {
+                    activateElement() {},
+                    deactivateElement() {},
+                    bus,
+                    size: SIZES.XXL,
+                    isSmall: false,
+                };
+            },
+        });
+        serverData.views = {
+            "partner,false,form": `<form><field name="foo"/></form>`,
+        };
+        serverData.actions = {
+            1: {
+                id: 1,
+                name: "Partner",
+                res_model: "partner",
+                type: "ir.actions.act_window",
+                views: [[false, "form"]],
+                target: "new",
+            },
+        };
+        const webClient = await createWebClient({ serverData });
+        await doAction(webClient, 1);
+        assert.containsOnce(target, ".o_dialog .o_form_view");
+        assert.doesNotHaveClass(target.querySelector(".o_dialog .o_form_view"), "o_xxl_form_view");
+    });
+
     QUnit.test("buttons in form view", async function (assert) {
         assert.expect(11);