diff --git a/addons/web/static/src/core/select_menu/select_menu.js b/addons/web/static/src/core/select_menu/select_menu.js index 5bb845d8f32..513110d18e0 100644 --- a/addons/web/static/src/core/select_menu/select_menu.js +++ b/addons/web/static/src/core/select_menu/select_menu.js @@ -83,11 +83,11 @@ export class SelectMenu extends Component { } get displayValue() { - if (this.props.value) { - const value = this.props.choices.find((c) => c.value === this.props.value); + if (this.props.value !== undefined) { + const choices = [...this.props.choices, ...this.props.groups.flatMap((g) => g.choices)]; + const value = choices.find((c) => c.value === this.props.value); return value ? value.label : this.props.value; } - return this.props.value; } onOpened() { diff --git a/addons/web/static/tests/core/select_menu_tests.js b/addons/web/static/tests/core/select_menu_tests.js index 29361d27d41..87dbe566234 100644 --- a/addons/web/static/tests/core/select_menu_tests.js +++ b/addons/web/static/tests/core/select_menu_tests.js @@ -102,7 +102,14 @@ QUnit.module("Web Components", (hooks) => { this.state = useState({ value: "world" }); this.choices = [ { label: "Hello", value: "hello" }, - { label: "World", value: "world" }, + ]; + this.groups = [ + { + label: "Group A", + choices: [ + { label: "World", value: "world" }, + ] + } ]; } @@ -114,6 +121,7 @@ QUnit.module("Web Components", (hooks) => { Parent.components = { SelectMenu }; Parent.template = xml`