From cd9ba6b06ae779d19892b07f13064aa396caf596 Mon Sep 17 00:00:00 2001
From: Jorge Pinna Puissant <jpp@odoo.com>
Date: Thu, 7 Jul 2022 13:28:20 +0000
Subject: [PATCH] [FIX] web: take into account orientation classes on radio
 button field

Before this commit, all radio buttons were on horizontal style,
the o_vertical class was not taken into account.

closes odoo/odoo#95553

Signed-off-by: Aaron Bohy (aab) <aab@odoo.com>
---
 .../static/src/views/fields/radio/radio_field.scss   |  4 ++--
 .../static/tests/views/fields/radio_field_tests.js   | 12 +++++++++++-
 2 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/addons/web/static/src/views/fields/radio/radio_field.scss b/addons/web/static/src/views/fields/radio/radio_field.scss
index 4df78059a6a..3317c606b89 100644
--- a/addons/web/static/src/views/fields/radio/radio_field.scss
+++ b/addons/web/static/src/views/fields/radio/radio_field.scss
@@ -1,5 +1,4 @@
-.o_field_radio > div {
-    display: inline-flex;
+.o_field_radio {
     > span, > button {
         flex: 0 0 auto;
     }
@@ -15,6 +14,7 @@
     }
 
     .o_horizontal {
+        display: inline-flex;
         .o_radio_item {
             margin-right: $o-form-spacing-unit * 2;
         }
diff --git a/addons/web/static/tests/views/fields/radio_field_tests.js b/addons/web/static/tests/views/fields/radio_field_tests.js
index c1ce0ff3cd9..7489b6dd562 100644
--- a/addons/web/static/tests/views/fields/radio_field_tests.js
+++ b/addons/web/static/tests/views/fields/radio_field_tests.js
@@ -226,11 +226,21 @@ QUnit.module("Fields", (hooks) => {
             ".o_field_radio > div.o_vertical",
             "should have o_vertical class"
         );
+        const verticalRadio = target.querySelector(".o_field_radio > div.o_vertical");
+        assert.strictEqual(
+            verticalRadio.querySelector(".o_radio_item:first-child").getBoundingClientRect().right,
+            verticalRadio.querySelector(".o_radio_item:last-child").getBoundingClientRect().right
+        );
         assert.containsOnce(
             target,
-            ".o_field_radio div.o_horizontal",
+            ".o_field_radio > div.o_horizontal",
             "should have o_horizontal class"
         );
+        const horizontalRadio = target.querySelector(".o_field_radio > div.o_horizontal");
+        assert.strictEqual(
+            horizontalRadio.querySelector(".o_radio_item:first-child").getBoundingClientRect().top,
+            horizontalRadio.querySelector(".o_radio_item:last-child").getBoundingClientRect().top
+        );
     });
 
     QUnit.test("fieldradio widget with numerical keys encoded as strings", async function (assert) {