diff --git a/src/components/forms/auto-complete/RuiAutoComplete.spec.ts b/src/components/forms/auto-complete/RuiAutoComplete.spec.ts index 86f9f5f..403d7ee 100644 --- a/src/components/forms/auto-complete/RuiAutoComplete.spec.ts +++ b/src/components/forms/auto-complete/RuiAutoComplete.spec.ts @@ -89,7 +89,18 @@ describe('autocomplete', () => { await wrapper.find('[data-id=activator]').trigger('click'); await vi.delay(); await nextTick(); + expect(document.body.querySelector('div[role=menu]')).toBeTruthy(); + // Close Menu Select + await wrapper.find('[data-id=activator]').trigger('keydown.esc'); + await vi.delay(); + await nextTick(); + expect(document.body.querySelector('div[role=menu]')).toBeFalsy(); + + // Open Menu Select by Enter + await wrapper.find('[data-id=activator]').trigger('keydown.enter'); + await vi.delay(); + await nextTick(); expect(document.body.querySelector('div[role=menu]')).toBeTruthy(); const selectedIndex = 4; @@ -100,6 +111,15 @@ describe('autocomplete', () => { buttonToSelect?.click(); expect(wrapper.emitted().input!.at(-1)![0]).toBe(selectedIndex.toString()); + await wrapper.setProps({ + value: selectedIndex.toString(), + }); + + await vi.delay(); + expect(document.body.querySelector('div[role=menu]')).toBeFalsy(); + + // Shouldn't open menu select because the value has been set + await wrapper.find('[data-id=activator]').trigger('keydown.enter'); await vi.delay(); expect(document.body.querySelector('div[role=menu]')).toBeFalsy(); @@ -137,11 +157,10 @@ describe('autocomplete', () => { await wrapper.setProps({ options: newOptions, + value: newSelectedIndexToString, }); await nextTick(); - expect(wrapper.emitted().input!.at(-1)![0]).toEqual(null); - // Even if the options changed, the search value should not be touch as long as the focus still there, so the UX is not breaking expect((wrapper.find('input').element as HTMLInputElement).value).toBe('Greece'); diff --git a/src/components/forms/auto-complete/RuiAutoComplete.vue b/src/components/forms/auto-complete/RuiAutoComplete.vue index 32a4c1d..fc5a4fc 100644 --- a/src/components/forms/auto-complete/RuiAutoComplete.vue +++ b/src/components/forms/auto-complete/RuiAutoComplete.vue @@ -477,7 +477,7 @@ function onEnter(event: KeyboardEvent) { set(isOpen, false); event.preventDefault(); } - else if (!get(isOpen)) { + else if (!get(isOpen) && get(value).length === 0) { set(isOpen, true); event.preventDefault(); }