diff --git a/addons/web/static/src/core/dropdown/dropdown.js b/addons/web/static/src/core/dropdown/dropdown.js index e0aa6a1dc3e..8f9ccaa7dde 100644 --- a/addons/web/static/src/core/dropdown/dropdown.js +++ b/addons/web/static/src/core/dropdown/dropdown.js @@ -147,6 +147,13 @@ export class Dropdown extends Component { () => [] ); + useEffect( + (open) => { + this.rootRef.el.parentElement.ariaExpanded = open ? "true" : "false"; + }, + () => [this.state.open] + ); + // Position menu relatively to parent element usePosition(() => this.rootRef.el.parentElement, positioningOptions); } else { diff --git a/addons/web/static/src/core/dropdown/dropdown.xml b/addons/web/static/src/core/dropdown/dropdown.xml index a015ca6a2ef..0b2305b5dcf 100644 --- a/addons/web/static/src/core/dropdown/dropdown.xml +++ b/addons/web/static/src/core/dropdown/dropdown.xml @@ -25,6 +25,7 @@ t-att-data-hotkey="props.hotkey" t-att-data-tooltip="props.tooltip" t-att-tabindex="props.skipTogglerTabbing ? -1 : 0" + t-att-aria-expanded="state.open ? 'true' : 'false'" t-ref="togglerRef" > @@ -33,6 +34,7 @@ t-if="state.open" class="o-dropdown--menu dropdown-menu d-block" t-att-class="props.menuClass" + role="menu" t-ref="menuRef" > diff --git a/addons/web/static/src/core/dropdown/dropdown_item.xml b/addons/web/static/src/core/dropdown/dropdown_item.xml index bc2660593af..8ce5845325d 100644 --- a/addons/web/static/src/core/dropdown/dropdown_item.xml +++ b/addons/web/static/src/core/dropdown/dropdown_item.xml @@ -7,6 +7,7 @@ t-att-href="props.href" class="dropdown-item" t-att-class="props.class" + role="menuitem" t-on-click.stop="onClick" t-att-title="props.title" t-att-data-hotkey="props.hotkey" diff --git a/addons/web/static/src/legacy/js/control_panel/comparison_menu.js b/addons/web/static/src/legacy/js/control_panel/comparison_menu.js index a28057bbc6b..733967e2499 100644 --- a/addons/web/static/src/legacy/js/control_panel/comparison_menu.js +++ b/addons/web/static/src/legacy/js/control_panel/comparison_menu.js @@ -2,7 +2,7 @@ odoo.define("web.ComparisonMenu", function (require) { "use strict"; const { Dropdown } = require("@web/core/dropdown/dropdown"); - const { DropdownItem } = require("@web/core/dropdown/dropdown_item"); + const { SearchDropdownItem } = require("@web/search/search_dropdown_item/search_dropdown_item"); const { FACET_ICONS } = require("web.searchUtils"); const { useModel } = require("web.Model"); const { LegacyComponent } = require("@web/legacy/legacy_component"); @@ -29,7 +29,7 @@ odoo.define("web.ComparisonMenu", function (require) { } } ComparisonMenu.template = "web.ComparisonMenu"; - ComparisonMenu.components = { Dropdown, DropdownItem }; + ComparisonMenu.components = { Dropdown, SearchDropdownItem }; return ComparisonMenu; }); diff --git a/addons/web/static/src/legacy/js/control_panel/favorite_menu.js b/addons/web/static/src/legacy/js/control_panel/favorite_menu.js index 4f3a735cf28..3dfccacfef7 100644 --- a/addons/web/static/src/legacy/js/control_panel/favorite_menu.js +++ b/addons/web/static/src/legacy/js/control_panel/favorite_menu.js @@ -2,7 +2,7 @@ odoo.define('web.FavoriteMenu', function (require) { "use strict"; const { Dropdown } = require("@web/core/dropdown/dropdown"); - const { DropdownItem } = require("@web/core/dropdown/dropdown_item"); + const { SearchDropdownItem } = require("@web/search/search_dropdown_item/search_dropdown_item"); const Dialog = require('web.OwlDialog'); const { FACET_ICONS } = require("web.searchUtils"); const Registry = require('web.Registry'); @@ -83,7 +83,7 @@ odoo.define('web.FavoriteMenu', function (require) { } FavoriteMenu.registry = new Registry(); - FavoriteMenu.components = { Dialog, Dropdown, DropdownItem }; + FavoriteMenu.components = { Dialog, Dropdown, SearchDropdownItem }; FavoriteMenu.template = 'web.Legacy.FavoriteMenu'; return FavoriteMenu; diff --git a/addons/web/static/src/legacy/js/control_panel/filter_menu.js b/addons/web/static/src/legacy/js/control_panel/filter_menu.js index 772797053e5..47568d92b83 100644 --- a/addons/web/static/src/legacy/js/control_panel/filter_menu.js +++ b/addons/web/static/src/legacy/js/control_panel/filter_menu.js @@ -2,7 +2,7 @@ odoo.define('web.FilterMenu', function (require) { "use strict"; const { Dropdown } = require("@web/core/dropdown/dropdown"); - const { DropdownItem } = require("@web/core/dropdown/dropdown_item"); + const { SearchDropdownItem } = require("@web/search/search_dropdown_item/search_dropdown_item"); const CustomFilterItem = require('web.CustomFilterItem'); const { FACET_ICONS } = require("web.searchUtils"); const { useModel } = require('web.Model'); @@ -52,7 +52,6 @@ odoo.define('web.FilterMenu', function (require) { } } - FilterMenu.components = { CustomFilterItem }; FilterMenu.defaultProps = { class: "", }; @@ -61,7 +60,7 @@ odoo.define('web.FilterMenu', function (require) { class: { String, optional: true }, }; FilterMenu.template = "web.legacy.FilterMenu"; - FilterMenu.components = { CustomFilterItem, Dropdown, DropdownItem }; + FilterMenu.components = { CustomFilterItem, Dropdown, SearchDropdownItem }; return FilterMenu; }); diff --git a/addons/web/static/src/legacy/js/control_panel/groupby_menu.js b/addons/web/static/src/legacy/js/control_panel/groupby_menu.js index 1052985eb91..ea75c68416e 100644 --- a/addons/web/static/src/legacy/js/control_panel/groupby_menu.js +++ b/addons/web/static/src/legacy/js/control_panel/groupby_menu.js @@ -2,7 +2,7 @@ odoo.define('web.GroupByMenu', function (require) { "use strict"; const { Dropdown } = require("@web/core/dropdown/dropdown"); - const { DropdownItem } = require("@web/core/dropdown/dropdown_item"); + const { SearchDropdownItem } = require("@web/search/search_dropdown_item/search_dropdown_item"); const { CustomGroupByItem } = require('@web/search/group_by_menu/custom_group_by_item'); const { FACET_ICONS, GROUPABLE_TYPES } = require('web.searchUtils'); const { useModel } = require('web.Model'); @@ -70,7 +70,7 @@ odoo.define('web.GroupByMenu', function (require) { } } - GroupByMenu.components = { CustomGroupByItem, Dropdown, DropdownItem }; + GroupByMenu.components = { CustomGroupByItem, Dropdown, SearchDropdownItem }; GroupByMenu.props = { fields: Object }; GroupByMenu.template = "web.GroupByMenu"; diff --git a/addons/web/static/src/search/comparison_menu/comparison_menu.js b/addons/web/static/src/search/comparison_menu/comparison_menu.js index 1528a03cb54..71924ece06a 100644 --- a/addons/web/static/src/search/comparison_menu/comparison_menu.js +++ b/addons/web/static/src/search/comparison_menu/comparison_menu.js @@ -1,7 +1,7 @@ /** @odoo-module **/ import { Dropdown } from "@web/core/dropdown/dropdown"; -import { DropdownItem } from "@web/core/dropdown/dropdown_item"; +import { SearchDropdownItem } from "@web/search/search_dropdown_item/search_dropdown_item"; import { FACET_ICONS } from "../utils/misc"; import { useBus } from "@web/core/utils/hooks"; @@ -30,6 +30,5 @@ export class ComparisonMenu extends Component { this.env.searchModel.toggleSearchItem(itemId); } } - ComparisonMenu.template = "web.ComparisonMenu"; -ComparisonMenu.components = { Dropdown, DropdownItem }; +ComparisonMenu.components = { Dropdown, SearchDropdownItem }; diff --git a/addons/web/static/src/search/comparison_menu/comparison_menu.xml b/addons/web/static/src/search/comparison_menu/comparison_menu.xml index 9d77955c4e6..7ab987a806e 100644 --- a/addons/web/static/src/search/comparison_menu/comparison_menu.xml +++ b/addons/web/static/src/search/comparison_menu/comparison_menu.xml @@ -8,7 +8,8 @@ Comparison - - @@ -24,7 +25,7 @@ t-on-click.stop="() => this.openConfirmationDialog(item.id)" /> - + diff --git a/addons/web/static/src/search/filter_menu/filter_menu.js b/addons/web/static/src/search/filter_menu/filter_menu.js index 50c9610cf02..e178802197c 100644 --- a/addons/web/static/src/search/filter_menu/filter_menu.js +++ b/addons/web/static/src/search/filter_menu/filter_menu.js @@ -1,7 +1,7 @@ /** @odoo-module **/ import { Dropdown } from "@web/core/dropdown/dropdown"; -import { DropdownItem } from "@web/core/dropdown/dropdown_item"; +import { SearchDropdownItem } from "@web/search/search_dropdown_item/search_dropdown_item"; import { CustomFilterItem } from "./custom_filter_item"; import { FACET_ICONS } from "../utils/misc"; import { useBus } from "@web/core/utils/hooks"; @@ -38,7 +38,7 @@ export class FilterMenu extends Component { } } -FilterMenu.components = { CustomFilterItem, Dropdown, DropdownItem }; +FilterMenu.components = { CustomFilterItem, Dropdown, SearchDropdownItem }; FilterMenu.template = "web.FilterMenu"; FilterMenu.props = { class: { type: String, optional: true }, diff --git a/addons/web/static/src/search/filter_menu/filter_menu.xml b/addons/web/static/src/search/filter_menu/filter_menu.xml index 473fe92face..809c2463a93 100644 --- a/addons/web/static/src/search/filter_menu/filter_menu.xml +++ b/addons/web/static/src/search/filter_menu/filter_menu.xml @@ -22,8 +22,9 @@