[FIX] web: fix autocomplete width being set to that of the parent

Previously, the autocomplete's width was set manually to that of the
parent. This is useless because the width is already set by the left: 0
and right: 0 rules in css. These rules are also incorrect, as we don't
want the width of the autocomplete to depend on the size of the input,
it should be able to overflow past the end of the input if necessary to
show the full width of the autocomplete items.

This commit fixes that, and relies on the usePosition hook for position
instead (as the position used to be left: 0 and right: 0)

closes odoo/odoo#98443

Signed-off-by: Michaël Mattiello <mcm@odoo.com>

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

@@ -5,7 +5,7 @@ import { useDebounced } from "@web/core/utils/timing";
 import { getActiveHotkey } from "@web/core/hotkeys/hotkey_service";
 import { usePosition } from "@web/core/position_hook";
 
-const { Component, useExternalListener, useRef, useState, useEffect } = owl;
+const { Component, useExternalListener, useRef, useState } = owl;
 
 export class AutoComplete extends Component {
     setup() {
@@ -39,18 +39,9 @@ export class AutoComplete extends Component {
         });
 
         // position and size
-        const sourcesListRef = useRef("sourcesList");
-        useEffect(
-            () => {
-                if (sourcesListRef.el) {
-                    sourcesListRef.el.style.width =
-                        this.inputRef.el.getBoundingClientRect().width + "px";
-                }
-            },
-            () => [sourcesListRef.el]
-        );
         usePosition(() => this.inputRef.el, {
             popper: "sourcesList",
+            position: "bottom-start",
         });
     }
 

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

@@ -3,9 +3,4 @@
     .o-autocomplete--input {
         width: 100%;
     }
-
-    .o-autocomplete--dropdown-menu {
-        left: 0;
-        right: 0;
-    }
 }