[FIX] web: left/rigth navigation in search bar

Before this commit, if there were several facets in the search bar, it
was not possible to navigate correctly between them.

closes odoo/odoo#93547

X-original-commit: d2b6aab509717866ab42a9750adbb884ccec18a4
Signed-off-by: Mathieu Duckerts-Antoine <dam@odoo.com>
Signed-off-by: Aaron Bohy (aab) <aab@odoo.com>
This commit is contained in:
Mathieu Duckerts-Antoine
2022-06-14 08:37:38 +02:00
parent 767bec9ef6
commit a44b3f8fb3
2 changed files with 43 additions and 1 deletions
@@ -223,7 +223,7 @@ export class SearchBar extends Component {
focusFacet(index) {
const facets = this.root.el.getElementsByClassName("o_searchview_facet");
if (facets.length) {
if (!index) {
if (index === undefined) {
facets[facets.length - 1].focus();
} else {
facets[index].focus();
@@ -167,6 +167,48 @@ QUnit.module("Search", (hooks) => {
assert.strictEqual(document.activeElement, target.querySelector(".o_searchview input"));
});
QUnit.test("navigation with facets (2)", async function (assert) {
await makeWithSearch({
serverData,
resModel: "partner",
Component: ControlPanel,
searchMenuTypes: ["groupBy"],
searchViewId: false,
context: {
search_default_date_group_by: 1,
search_default_foo: 1,
},
});
assert.containsN(target, ".o_searchview .o_searchview_facet", 2);
assert.strictEqual(document.activeElement, target.querySelector(".o_searchview input"));
// press left to focus the rightmost facet
await triggerEvent(document.activeElement, null, "keydown", { key: "ArrowLeft" });
assert.strictEqual(
document.activeElement,
target.querySelector(".o_searchview .o_searchview_facet:nth-child(2)")
);
// press left to focus the leftmost facet
await triggerEvent(document.activeElement, null, "keydown", { key: "ArrowLeft" });
assert.strictEqual(
document.activeElement,
target.querySelector(".o_searchview .o_searchview_facet:nth-child(1)")
);
// press left to focus the input
await triggerEvent(document.activeElement, null, "keydown", { key: "ArrowLeft" });
assert.strictEqual(document.activeElement, target.querySelector(".o_searchview input"));
// press left to focus the leftmost facet
await triggerEvent(document.activeElement, null, "keydown", { key: "ArrowRight" });
assert.strictEqual(
document.activeElement,
target.querySelector(".o_searchview .o_searchview_facet:nth-child(1)")
);
});
QUnit.test("search date and datetime fields. Support of timezones", async function (assert) {
assert.expect(4);