[IMP] web: some autocomplete improvements

This commit introduces two small improvements to the autocomplete
component:
- the ability to autofocus the input, once it is mounted
- the ability to set an additional class to its root element

closes odoo/odoo#115142

Signed-off-by: Mathieu Duckerts-Antoine <dam@odoo.com>

addons/web/static/src/core/autocomplete/autocomplete.js

@@ -1,10 +1,9 @@
 /** @odoo-module **/
 
-import { useForwardRefToParent, useService } from "@web/core/utils/hooks";
+import { useAutofocus, useForwardRefToParent, useService } from "@web/core/utils/hooks";
 import { useDebounced } from "@web/core/utils/timing";
 import { getActiveHotkey } from "@web/core/hotkeys/hotkey_service";
 import { usePosition } from "@web/core/position_hook";
-
 import { Component, useExternalListener, useRef, useState } from "@odoo/owl";
 
 export class AutoComplete extends Component {
@@ -22,6 +21,9 @@ export class AutoComplete extends Component {
         });
 
         this.inputRef = useForwardRefToParent("input");
+        if (this.props.autofocus) {
+            useAutofocus({ refName: "input" });
+        }
         this.root = useRef("root");
         this.debouncedOnInput = useDebounced(this.onInput, this.constructor.timeout);
         useExternalListener(window, "scroll", this.onWindowScroll, true);
@@ -322,6 +324,8 @@ Object.assign(AutoComplete, {
         onBlur: { type: Function, optional: true },
         onFocus: { type: Function, optional: true },
         input: { type: Function, optional: true },
+        autofocus: { type: Boolean, optional: true },
+        class: { type: String, optional: true },
     },
     defaultProps: {
         placeholder: "",

addons/web/static/src/core/autocomplete/autocomplete.xml

@@ -2,7 +2,7 @@
 <templates xml:space="preserve">
 
     <t t-name="web.AutoComplete" owl="1">
-        <div class="o-autocomplete dropdown" t-ref="root">
+        <div class="o-autocomplete dropdown" t-ref="root" t-att-class="props.class">
             <input
                 type="text"
                 t-att-id="props.id"

addons/web/static/tests/core/autocomplete_tests.js

@@ -338,4 +338,20 @@ QUnit.module("Components", (hooks) => {
         assert.strictEqual(target.querySelector(".o-autocomplete--input").value, "t");
         assert.containsNone(target, ".o-autocomplete--dropdown-menu");
     });
+
+    QUnit.test("autofocus=true option work as expected", async (assert) => {
+        class Parent extends Component {}
+        Parent.components = { AutoComplete };
+        Parent.template = xml`
+            <AutoComplete value="'Hello'"
+                sources="[{ options: [{ label: 'World' }, { label: 'Hello' }] }]"
+                autofocus="true"
+                onSelect="() => {}"
+            />
+        `;
+
+        await mount(Parent, target, { env });
+
+        assert.strictEqual(target.querySelector(".o-autocomplete input"), document.activeElement);
+    });
 });