diff --git a/.changeset/rare-walls-lay.md b/.changeset/rare-walls-lay.md new file mode 100644 index 000000000..6042a3d69 --- /dev/null +++ b/.changeset/rare-walls-lay.md @@ -0,0 +1,5 @@ +--- +'@lion/ui': patch +--- + +[select-rich] block arrow key interaction when singleOption is set diff --git a/packages/ui/components/select-rich/src/LionSelectRich.js b/packages/ui/components/select-rich/src/LionSelectRich.js index b8bd014f8..9d806ae21 100644 --- a/packages/ui/components/select-rich/src/LionSelectRich.js +++ b/packages/ui/components/select-rich/src/LionSelectRich.js @@ -491,7 +491,7 @@ export class LionSelectRich extends SlotMixin(ScopedElementsMixin(OverlayMixin(L */ // TODO: rename to #invokerOnKeyUp() (and move event listener to the invoker) in v1 __onKeyUp(ev) { - if (this.disabled || this.readOnly) { + if (this.disabled || this.readOnly || this.singleOption) { return; } diff --git a/packages/ui/components/select-rich/test/lion-select-rich.test.js b/packages/ui/components/select-rich/test/lion-select-rich.test.js index 7bc4cc232..e5032362c 100644 --- a/packages/ui/components/select-rich/test/lion-select-rich.test.js +++ b/packages/ui/components/select-rich/test/lion-select-rich.test.js @@ -342,7 +342,7 @@ describe('lion-select-rich', () => { expect(elSingleoption.opened).to.be.false; }); - it('stays closed with [ArrowUp] or [ArrowDown] key in readonly mode', async () => { + it('stays closed with [ArrowUp] or [ArrowDown] key in readonly mode or has a single option', async () => { const elReadOnly = await fixture(html` Item 1 @@ -350,11 +350,23 @@ describe('lion-select-rich', () => { `); + const elSingleOption = await fixture(html` + + Item 1 + + `); + elReadOnly.dispatchEvent(new KeyboardEvent('keyup', { key: 'ArrowDown' })); expect(elReadOnly.opened).to.be.false; elReadOnly.dispatchEvent(new KeyboardEvent('keyup', { key: 'ArrowUp' })); expect(elReadOnly.opened).to.be.false; + + elSingleOption.dispatchEvent(new KeyboardEvent('keyup', { key: 'ArrowDown' })); + expect(elSingleOption.opened).to.be.false; + + elSingleOption.dispatchEvent(new KeyboardEvent('keyup', { key: 'ArrowUp' })); + expect(elSingleOption.opened).to.be.false; }); it('sets inheritsReferenceWidth to min by default', async () => {