From 53d2b583111b5f17216ffefe800c55e2e25373fa Mon Sep 17 00:00:00 2001
From: Kristiyan Kostadinov <crisbeto@users.noreply.github.com>
Date: Wed, 12 Dec 2018 19:09:07 +0100
Subject: [PATCH] fix(autocomplete): auto-highlighted first option not display
 correctly if the floating label is disabled (#14414)

Fixes the first option not appearing as highlighted if the consumer has set `floatLabel="never"` and `autoActiveFirstOption`. It looks like we were depending on the `transitioned` event from the label to kick off the change detection that shows the highlight.

Fixes #13734.
---
 src/lib/autocomplete/autocomplete-trigger.ts |  1 +
 src/lib/autocomplete/autocomplete.spec.ts    | 16 ++++++++++++++++
 2 files changed, 17 insertions(+)

diff --git a/src/lib/autocomplete/autocomplete-trigger.ts b/src/lib/autocomplete/autocomplete-trigger.ts
index ea86763a572..f0d1aae55a8 100644
--- a/src/lib/autocomplete/autocomplete-trigger.ts
+++ b/src/lib/autocomplete/autocomplete-trigger.ts
@@ -493,6 +493,7 @@ export class MatAutocompleteTrigger implements ControlValueAccessor, OnDestroy {
         switchMap(() => {
           this._resetActiveItem();
           this.autocomplete._setVisibility();
+          this._changeDetectorRef.detectChanges();
 
           if (this.panelOpen) {
             this._overlayRef!.updatePosition();
diff --git a/src/lib/autocomplete/autocomplete.spec.ts b/src/lib/autocomplete/autocomplete.spec.ts
index 143ea70c8f0..42038e56fe7 100644
--- a/src/lib/autocomplete/autocomplete.spec.ts
+++ b/src/lib/autocomplete/autocomplete.spec.ts
@@ -1644,6 +1644,22 @@ describe('MatAutocomplete', () => {
           .toContain('mat-active', 'Expected first option to be highlighted.');
     }));
 
+    it('should be able to preselect the first option when the floating label is disabled',
+      fakeAsync(() => {
+        fixture.componentInstance.floatLabel = 'never';
+        fixture.componentInstance.trigger.autocomplete.autoActiveFirstOption = true;
+        fixture.detectChanges();
+
+        fixture.componentInstance.trigger.openPanel();
+        fixture.detectChanges();
+        zone.simulateZoneExit();
+        // Note: should not have a detectChanges call here
+        // in order for the test to fail when it's supposed to.
+
+        expect(overlayContainerElement.querySelectorAll('mat-option')[0].classList)
+            .toContain('mat-active', 'Expected first option to be highlighted.');
+      }));
+
     it('should be able to configure preselecting the first option globally', fakeAsync(() => {
       overlayContainer.ngOnDestroy();
       fixture.destroy();