From db6e0c2c66771c08980a981db275a828b8058c7b Mon Sep 17 00:00:00 2001
From: crisbeto <crisbeto@abv.bg>
Date: Sun, 11 Feb 2018 11:05:31 +0100
Subject: [PATCH] fix(autocomplete): autofill value changes not being
 propagated to the form control

Currently we skip any `input` events on an autocomplete trigger that have been dispatched while the element is blurre, in order to handle some IE-specific cases. This ends up preventing the autocomplete from picking up any changes to its value that have come as a result of the browser autofill. These changes move some logic around to handle both autofilling and the IE issues.

Fixes #9704.
---
 src/lib/autocomplete/autocomplete-trigger.ts |  4 ++--
 src/lib/autocomplete/autocomplete.spec.ts    | 12 ++++++++++++
 2 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/src/lib/autocomplete/autocomplete-trigger.ts b/src/lib/autocomplete/autocomplete-trigger.ts
index 776b87117479..ea86763a5722 100644
--- a/src/lib/autocomplete/autocomplete-trigger.ts
+++ b/src/lib/autocomplete/autocomplete-trigger.ts
@@ -402,11 +402,11 @@ export class MatAutocompleteTrigger implements ControlValueAccessor, OnDestroy {
     // filter out all of the extra events, we save the value on focus and between
     // `input` events, and we check whether it changed.
     // See: https://connect.microsoft.com/IE/feedback/details/885747/
-    if (this._previousValue !== value && document.activeElement === event.target) {
+    if (this._previousValue !== value) {
       this._previousValue = value;
       this._onChange(value);
 
-      if (this._canOpen()) {
+      if (this._canOpen() && document.activeElement === event.target) {
         this.openPanel();
       }
     }
diff --git a/src/lib/autocomplete/autocomplete.spec.ts b/src/lib/autocomplete/autocomplete.spec.ts
index d03b7bc34729..055cf6da1e5d 100644
--- a/src/lib/autocomplete/autocomplete.spec.ts
+++ b/src/lib/autocomplete/autocomplete.spec.ts
@@ -571,6 +571,18 @@ describe('MatAutocomplete', () => {
           .toEqual('al', 'Expected control value to be updated as user types.');
     });
 
+    it('should update control value when autofilling', () => {
+      // Simulate the browser autofilling the input by setting a value and
+      // dispatching an `input` event while the input is out of focus.
+      expect(document.activeElement).not.toBe(input, 'Expected input not to have focus.');
+      input.value = 'Alabama';
+      dispatchFakeEvent(input, 'input');
+      fixture.detectChanges();
+
+      expect(fixture.componentInstance.stateCtrl.value)
+          .toBe('Alabama', 'Expected value to be propagated to the form control.');
+    });
+
     it('should update control value when option is selected with option value', fakeAsync(() => {
       fixture.componentInstance.trigger.openPanel();
       fixture.detectChanges();