diff --git a/src/components/select/select.test.ts b/src/components/select/select.test.ts index 99c229b1..fec7d68c 100644 --- a/src/components/select/select.test.ts +++ b/src/components/select/select.test.ts @@ -48,10 +48,7 @@ describe('', () => { `)) as SlSelect; const selectBox = el.shadowRoot.querySelector('.select__box') as HTMLSelectElement; selectBox.focus(); - const ctrlKeyEvent = new KeyboardEvent('keydown', { key: 'Control' }); - selectBox.dispatchEvent(ctrlKeyEvent); - await aTimeout(100); - const rKeyEvent = new KeyboardEvent('keydown', { key: 'r' }); + const rKeyEvent = new KeyboardEvent('keydown', { key: 'r', ctrlKey: true }); selectBox.dispatchEvent(rKeyEvent); await aTimeout(100); expect(selectBox.getAttribute('aria-expanded')).to.equal('false'); diff --git a/src/components/select/select.ts b/src/components/select/select.ts index 8f9abea5..90671601 100644 --- a/src/components/select/select.ts +++ b/src/components/select/select.ts @@ -65,7 +65,6 @@ export default class SlSelect extends LitElement { private helpTextId = `select-help-text-${id}`; private labelId = `select-label-${id}`; private resizeObserver: ResizeObserver; - private isCtrlKeyPressed = false; @state() private hasFocus = false; @state() private hasHelpTextSlot = false; @@ -250,14 +249,13 @@ export default class SlSelect extends LitElement { } } - // toggling CTRL/Command key state for ctrl + any key commands - if (event.key === 'Control' || event.metaKey) { - this.isCtrlKeyPressed = true; + // don't open the menu when a CTRL/Command key is pressed + if (event.ctrlKey || event.metaKey) { return; } - // All other "printable" keys open the menu (if not ctrl key is pressed) and initiate type to select - if (!this.isOpen && !this.isCtrlKeyPressed && event.key.length === 1) { + // All other "printable" keys open the menu and initiate type to select + if (!this.isOpen && event.key.length === 1) { event.stopPropagation(); event.preventDefault(); this.dropdown.show(); @@ -265,13 +263,6 @@ export default class SlSelect extends LitElement { } } - handleKeyUp(event: KeyboardEvent) { - // toggling CTRL/Command key state for ctrl + any key commands - if (event.key === 'Control' || event.metaKey) { - this.isCtrlKeyPressed = false; - } - } - handleLabelClick() { const box = this.shadowRoot?.querySelector('.select__box') as HTMLElement; box.focus(); @@ -491,7 +482,6 @@ export default class SlSelect extends LitElement { @blur=${this.handleBlur} @focus=${this.handleFocus} @keydown=${this.handleKeyDown} - @keyup=${this.handleKeyUp} >
${this.displayTags.length