From bd8afccf1694d30d2b4a317167f1c940d2fcd992 Mon Sep 17 00:00:00 2001
From: "Dardenne Florent (dafl)" <dafl@odoo.com>
Date: Tue, 6 Sep 2022 13:19:36 +0000
Subject: [PATCH] [IMP] web: `Dropdown`: add caret props

Before, the small "caret" to the right of the dropdown was only
 displayed if the current Dropdown was a child of another Dropdown.

It is sometimes necessary to display this caret in a parent
 `Dropdown` in order to make the user understand that there is a
  dropdown if he clicks on the text.

Now, it is possible thanks to a props to display manually this carret
 if desired.

Part-of: odoo/odoo#99321
---
 .../web/static/src/core/dropdown/dropdown.js  |  8 ++++++
 .../web/static/src/core/dropdown/dropdown.xml |  2 +-
 .../web/static/tests/core/dropdown_tests.js   | 26 +++++++++++++++++++
 3 files changed, 35 insertions(+), 1 deletion(-)

diff --git a/addons/web/static/src/core/dropdown/dropdown.js b/addons/web/static/src/core/dropdown/dropdown.js
index 1dfcf1a2bf1..ee6cbce04b5 100644
--- a/addons/web/static/src/core/dropdown/dropdown.js
+++ b/addons/web/static/src/core/dropdown/dropdown.js
@@ -207,6 +207,10 @@ export class Dropdown extends Component {
         return this.changeStateAndNotify({ open: toggled, groupIsOpen: toggled });
     }
 
+    get showCaret() {
+        return this.props.showCaret === undefined ? this.parentDropdown : this.props.showCaret;
+    }
+
     // -------------------------------------------------------------------------
     // Handlers
     // -------------------------------------------------------------------------
@@ -341,5 +345,9 @@ Dropdown.props = {
         type: Object,
         optional: true,
     },
+    showCaret: {
+        type: Boolean,
+        optional: true,
+    },
 };
 Dropdown.template = "web.Dropdown";
diff --git a/addons/web/static/src/core/dropdown/dropdown.xml b/addons/web/static/src/core/dropdown/dropdown.xml
index b442305bae8..ba63d59e324 100644
--- a/addons/web/static/src/core/dropdown/dropdown.xml
+++ b/addons/web/static/src/core/dropdown/dropdown.xml
@@ -8,7 +8,7 @@
       t-attf-class="
         {{ directionCaretClass || ''}}
         {{ state.open ? 'show' : ''}}
-        {{ !parentDropdown ? 'o-dropdown--no-caret' : '' }}
+        {{ !showCaret ? 'o-dropdown--no-caret' : '' }}
       "
       t-ref="root"
     >
diff --git a/addons/web/static/tests/core/dropdown_tests.js b/addons/web/static/tests/core/dropdown_tests.js
index 1a05206d297..983204db796 100644
--- a/addons/web/static/tests/core/dropdown_tests.js
+++ b/addons/web/static/tests/core/dropdown_tests.js
@@ -883,6 +883,32 @@ QUnit.module("Components", ({ beforeEach }) => {
         }
     });
 
+    QUnit.test("showCaret props adds caret class", async (assert) => {
+        class Parent extends Component {}
+        Parent.template = xml`
+            <Dropdown class="'first'" hotkey="'1'" showCaret="true">
+                <DropdownItem class="'first-first'">O</DropdownItem>
+                <Dropdown class="'second'" showCaret="false">
+                    <DropdownItem class="'second-first'">O</DropdownItem>
+                </Dropdown>
+            </Dropdown>
+        `;
+        Parent.components = { Dropdown, DropdownItem };
+        env = await makeTestEnv();
+        await mount(Parent, target, { env });
+        assert.containsNone(
+            target,
+            ".first.o-dropdown--no-caret",
+            "first dropdown should have a caret"
+        );
+        await click(target, ".dropdown-toggle");
+        assert.containsOnce(
+            target,
+            ".second.o-dropdown--no-caret",
+            "second dropdown should not have a caret"
+        );
+    });
+
     QUnit.test(
         "multi-level dropdown: mouseentering a dropdown item should close any subdropdown",
         async (assert) => {