diff --git a/src/lib/autocomplete/autocomplete-trigger.ts b/src/lib/autocomplete/autocomplete-trigger.ts index 9fb0e8a763b..f4f27bfa2c9 100644 --- a/src/lib/autocomplete/autocomplete-trigger.ts +++ b/src/lib/autocomplete/autocomplete-trigger.ts @@ -296,8 +296,10 @@ export class MatAutocompleteTrigger implements ControlValueAccessor, OnDestroy { } _handleFocus(): void { - this._attachOverlay(); - this._floatPlaceholder(true); + if (!this._element.nativeElement.readOnly) { + this._attachOverlay(); + this._floatPlaceholder(true); + } } /** diff --git a/src/lib/autocomplete/autocomplete.spec.ts b/src/lib/autocomplete/autocomplete.spec.ts index eb3e117a2d1..c5e5b007faa 100644 --- a/src/lib/autocomplete/autocomplete.spec.ts +++ b/src/lib/autocomplete/autocomplete.spec.ts @@ -118,6 +118,20 @@ describe('MatAutocomplete', () => { }); })); + it('should not open the panel on focus if the input is readonly', async(() => { + const trigger = fixture.componentInstance.trigger; + input.readOnly = true; + fixture.detectChanges(); + + expect(trigger.panelOpen).toBe(false, 'Expected panel state to start out closed.'); + dispatchFakeEvent(input, 'focusin'); + + fixture.whenStable().then(() => { + fixture.detectChanges(); + expect(trigger.panelOpen).toBe(false, 'Expected panel to stay closed.'); + }); + })); + it('should open the panel programmatically', async(() => { expect(fixture.componentInstance.trigger.panelOpen) .toBe(false, `Expected panel state to start out closed.`);