fix(autocomplete): alt + up arrow to close panel not working (#15364)

Currently we support the part of the spec where the autocomplete panel is supposed to close when pressing alt + up arrow, however at some point we added more functionality that ends up reopening the panel immediately. These changes ensure that the user is able to close the panel via alt + up arrow.
This commit is contained in:
Kristiyan Kostadinov
2019-06-19 19:44:15 +02:00
committed by Jeremy Elbourn
parent a2d91e4674
commit 4b82786333
2 changed files with 7 additions and 0 deletions
@@ -611,6 +611,11 @@ export class MatAutocompleteTrigger implements ControlValueAccessor, OnChanges,
if (event.keyCode === ESCAPE || (event.keyCode === UP_ARROW && event.altKey)) {
this._resetActiveItem();
this._closeKeyEventStream.next();
// We need to stop propagation, otherwise the event will eventually
// reach the input itself and cause the overlay to be reopened.
event.stopPropagation();
event.preventDefault();
}
});
@@ -1111,6 +1111,7 @@ describe('MatAutocomplete', () => {
const trigger = fixture.componentInstance.trigger;
const upArrowEvent = createKeyboardEvent('keydown', UP_ARROW);
Object.defineProperty(upArrowEvent, 'altKey', {get: () => true});
spyOn(upArrowEvent, 'stopPropagation').and.callThrough();
input.focus();
flush();
@@ -1124,6 +1125,7 @@ describe('MatAutocomplete', () => {
expect(document.activeElement).toBe(input, 'Expected input to continue to be focused.');
expect(trigger.panelOpen).toBe(false, 'Expected panel to be closed.');
expect(upArrowEvent.stopPropagation).toHaveBeenCalled();
}));
it('should close the panel when tabbing away from a trigger without results', fakeAsync(() => {