[FIX] website: handle search keyboard navigation manually

Since [1] when BS5 was introduced, the keyboard navigation of search
autocomplete suggestions did not work anymore.

This commit avoids relying on bootstrap and JQuery to navigate the
suggestions.

[1]: https://github.com/odoo/odoo/commit/971e5a91aab96d36129a823e03f1f9f1b1293968

task-3148871

closes odoo/odoo#112733

X-original-commit: be549b7b64a253149d55b7f73f1d1a25a29388f9
Signed-off-by: Outagant Mehdi (mou) <mou@odoo.com>
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>

addons/website/static/src/snippets/s_searchbar/000.js

@@ -11,7 +11,7 @@ publicWidget.registry.searchBar = publicWidget.Widget.extend({
     events: {
         'input .search-query': '_onInput',
         'focusout': '_onFocusOut',
-        'keydown .search-query': '_onKeydown',
+        'keydown .search-query, .dropdown-item': '_onKeydown',
         'search .search-query': '_onSearch',
     },
     autocompleteMinWidth: 300,
@@ -242,8 +242,13 @@ publicWidget.registry.searchBar = publicWidget.Widget.extend({
             case $.ui.keyCode.DOWN:
                 ev.preventDefault();
                 if (this.$menu) {
-                    let $element = ev.which === $.ui.keyCode.UP ? this.$menu.children().last() : this.$menu.children().first();
-                    $element.focus();
+                    const focusableEls = [this.$input[0], ...this.$menu[0].children];
+                    const focusedEl = document.activeElement;
+                    const currentIndex = focusableEls.indexOf(focusedEl) || 0;
+                    const delta = ev.which === $.ui.keyCode.UP ? focusableEls.length - 1 : 1;
+                    const nextIndex = (currentIndex + delta) % focusableEls.length;
+                    const nextFocusedEl = focusableEls[nextIndex];
+                    nextFocusedEl.focus();
                 }
                 break;
             case $.ui.keyCode.ENTER: