[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

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";

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"
     >

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) => {