diff --git a/src/lib/select/select.spec.ts b/src/lib/select/select.spec.ts index a2df8f8545f1..be4159cd5c84 100644 --- a/src/lib/select/select.spec.ts +++ b/src/lib/select/select.spec.ts @@ -282,6 +282,28 @@ describe('MatSelect', () => { 'Expected value from second option to have been set on the model.'); })); + it('should resume focus from selected item after selecting via click', fakeAsync(() => { + const formControl = fixture.componentInstance.control; + const options = fixture.componentInstance.options.toArray(); + + expect(formControl.value).toBeFalsy('Expected no initial value.'); + + fixture.componentInstance.select.open(); + fixture.detectChanges(); + flush(); + + (overlayContainerElement.querySelectorAll('mat-option')[3] as HTMLElement).click(); + fixture.detectChanges(); + flush(); + + expect(formControl.value).toBe(options[3].value); + + dispatchKeyboardEvent(select, 'keydown', DOWN_ARROW); + fixture.detectChanges(); + + expect(formControl.value).toBe(options[4].value); + })); + it('should select options via LEFT/RIGHT arrow keys on a closed select', fakeAsync(() => { const formControl = fixture.componentInstance.control; const options = fixture.componentInstance.options.toArray(); diff --git a/src/lib/select/select.ts b/src/lib/select/select.ts index 0e9603421ace..cd11b499f569 100644 --- a/src/lib/select/select.ts +++ b/src/lib/select/select.ts @@ -892,12 +892,14 @@ export class MatSelect extends _MatSelectMixinBase implements AfterContentInit, } else { option.selected ? this._selectionModel.select(option) : this._selectionModel.deselect(option); + if (isUserInput) { + this._keyManager.setActiveItem(option); + } + if (this.multiple) { this._sortValues(); if (isUserInput) { - this._keyManager.setActiveItem(option); - // In case the user selected the option with their mouse, we // want to restore focus back to the trigger, in order to // prevent the select keyboard controls from clashing with