fix(material/autocomplete): don't emit optionActivated event when opt…

…ion is reset (#23437)

Fixes that we were emitting the `optionActivated` event when the option is reset programmatically when the panel closes. The intent was to only emit the event as a result of a user action.

Fixes #23430.

src/material-experimental/mdc-autocomplete/autocomplete.spec.ts

@@ -2789,6 +2789,28 @@ expect(scrollContainer.scrollTop)
     expect(spy.calls.mostRecent().args[0]).toEqual({source: autocomplete, option: options[2]});
   }));
 
+  it('should not emit the optionActivated event when the active option is reset', fakeAsync(() => {
+    const fixture = createComponent(AutocompleteWithActivatedEvent);
+
+    fixture.detectChanges();
+    fixture.componentInstance.trigger.openPanel();
+    zone.simulateZoneExit();
+    fixture.detectChanges();
+
+    const input = fixture.nativeElement.querySelector('input');
+    const spy = fixture.componentInstance.optionActivated;
+
+    expect(spy).not.toHaveBeenCalled();
+
+    dispatchKeyboardEvent(input, 'keydown', DOWN_ARROW);
+    fixture.detectChanges();
+    expect(spy).toHaveBeenCalledTimes(1);
+
+    dispatchKeyboardEvent(input, 'keydown', ESCAPE);
+    fixture.detectChanges();
+    expect(spy).toHaveBeenCalledTimes(1);
+  }));
+
   it('should be able to set a custom panel connection element', () => {
     const fixture = createComponent(AutocompleteWithDifferentOrigin);
 

src/material/autocomplete/autocomplete-trigger.ts

@@ -574,8 +574,8 @@ export abstract class _MatAutocompleteTriggerBase implements ControlValueAccesso
         // See: https://www.w3.org/TR/wai-aria-practices-1.1/#textbox-keyboard-interaction
         if ((event.keyCode === ESCAPE && !hasModifierKey(event)) ||
             (event.keyCode === UP_ARROW && hasModifierKey(event, 'altKey'))) {
-          this._resetActiveItem();
           this._closeKeyEventStream.next();
+          this._resetActiveItem();
 
           // We need to stop propagation, otherwise the event will eventually
           // reach the input itself and cause the overlay to be reopened.

src/material/autocomplete/autocomplete.spec.ts

@@ -2790,6 +2790,28 @@ expect(container.scrollTop)
     expect(spy.calls.mostRecent().args[0]).toEqual({source: autocomplete, option: options[2]});
   }));
 
+  it('should not emit the optionActivated event when the active option is reset', fakeAsync(() => {
+    const fixture = createComponent(AutocompleteWithActivatedEvent);
+
+    fixture.detectChanges();
+    fixture.componentInstance.trigger.openPanel();
+    zone.simulateZoneExit();
+    fixture.detectChanges();
+
+    const input = fixture.nativeElement.querySelector('input');
+    const spy = fixture.componentInstance.optionActivated;
+
+    expect(spy).not.toHaveBeenCalled();
+
+    dispatchKeyboardEvent(input, 'keydown', DOWN_ARROW);
+    fixture.detectChanges();
+    expect(spy).toHaveBeenCalledTimes(1);
+
+    dispatchKeyboardEvent(input, 'keydown', ESCAPE);
+    fixture.detectChanges();
+    expect(spy).toHaveBeenCalledTimes(1);
+  }));
+
   it('should be able to set a custom panel connection element', () => {
     const fixture = createComponent(AutocompleteWithDifferentOrigin);
 

src/material/autocomplete/autocomplete.ts

@@ -215,7 +215,9 @@ export abstract class _MatAutocompleteBase extends _MatAutocompleteMixinBase imp
   ngAfterContentInit() {
     this._keyManager = new ActiveDescendantKeyManager<_MatOptionBase>(this.options).withWrap();
     this._activeOptionChanges = this._keyManager.change.subscribe(index => {
-      this.optionActivated.emit({source: this, option: this.options.toArray()[index] || null});
+      if (this.isOpen) {
+        this.optionActivated.emit({source: this, option: this.options.toArray()[index] || null});
+      }
     });
 
     // Set the initial visibility state.