fix(select): alt + arrow key not opening in single-selection mode (#8910)

Fixes not being able to open a closed `mat-select` in single selection mode using the alt + up/down arrow combo. It seems like this was introduced when we added the ability go through the values using arrow keys on a closed select.
This commit is contained in:
Kristiyan Kostadinov
2017-12-13 22:53:00 +01:00
committed by Andrew Seguin
parent 91053020c3
commit a4c042b6c9
2 changed files with 31 additions and 1 deletions
+30
View File
@@ -253,6 +253,36 @@ describe('MatSelect', () => {
'Expected value from second option to have been set on the model.');
}));
it('should open a single-selection select using ALT + DOWN_ARROW', fakeAsync(() => {
const {control: formControl, select: selectInstance} = fixture.componentInstance;
expect(selectInstance.panelOpen).toBe(false, 'Expected select to be closed.');
expect(formControl.value).toBeFalsy('Expected no initial value.');
const event = createKeyboardEvent('keydown', DOWN_ARROW);
Object.defineProperty(event, 'altKey', {get: () => true});
dispatchEvent(select, event);
expect(selectInstance.panelOpen).toBe(true, 'Expected select to be open.');
expect(formControl.value).toBeFalsy('Expected value not to have changed.');
}));
it('should open a single-selection select using ALT + UP_ARROW', fakeAsync(() => {
const {control: formControl, select: selectInstance} = fixture.componentInstance;
expect(selectInstance.panelOpen).toBe(false, 'Expected select to be closed.');
expect(formControl.value).toBeFalsy('Expected no initial value.');
const event = createKeyboardEvent('keydown', UP_ARROW);
Object.defineProperty(event, 'altKey', {get: () => true});
dispatchEvent(select, event);
expect(selectInstance.panelOpen).toBe(true, 'Expected select to be open.');
expect(formControl.value).toBeFalsy('Expected value not to have changed.');
}));
it('should be able to select options by typing on a closed select', fakeAsync(() => {
const formControl = fixture.componentInstance.control;
const options = fixture.componentInstance.options.toArray();
+1 -1
View File
@@ -644,7 +644,7 @@ export class MatSelect extends _MatSelectMixinBase implements AfterContentInit,
const isArrowKey = keyCode === DOWN_ARROW || keyCode === UP_ARROW;
const isOpenKey = keyCode === ENTER || keyCode === SPACE;
if (isOpenKey || (this.multiple && isArrowKey)) {
if (isOpenKey || ((this.multiple || event.altKey) && isArrowKey)) {
event.preventDefault(); // prevents the page from scrolling down when pressing space
this.open();
} else if (!this.multiple) {