Skip to content

Commit 2f17c69

Browse files
authored
fix(material/autocomplete): panel not visible when opened from multiple triggers (#28843)
Fixes that if one panel is tied to multiple triggers, it ends up becoming invisible because the original trigger resets the state after the next trigger picks it up. These changes avoid the state reset if the trigger has changed. Fixes #28362.
1 parent 524fe62 commit 2f17c69

File tree

3 files changed

+14
-3
lines changed

3 files changed

+14
-3
lines changed

src/material/autocomplete/autocomplete-trigger.ts

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -318,7 +318,14 @@ export class MatAutocompleteTrigger
318318
});
319319
}
320320

321-
this.autocomplete._isOpen = this._overlayAttached = false;
321+
// Only reset if this trigger is the latest one that opened the
322+
// autocomplete since another may have taken it over.
323+
if (this.autocomplete._latestOpeningTrigger === this) {
324+
this.autocomplete._isOpen = false;
325+
this.autocomplete._latestOpeningTrigger = null;
326+
}
327+
328+
this._overlayAttached = false;
322329
this._pendingAutoselectedOption = null;
323330

324331
if (this._overlayRef && this._overlayRef.hasAttached()) {
@@ -340,8 +347,7 @@ export class MatAutocompleteTrigger
340347

341348
// Remove aria-owns attribute when the autocomplete is no longer visible.
342349
if (this._trackedModal) {
343-
const panelId = this.autocomplete.id;
344-
removeAriaReferencedId(this._trackedModal, 'aria-owns', panelId);
350+
removeAriaReferencedId(this._trackedModal, 'aria-owns', this.autocomplete.id);
345351
}
346352
}
347353

@@ -799,6 +805,7 @@ export class MatAutocompleteTrigger
799805
const wasOpen = this.panelOpen;
800806

801807
this.autocomplete._isOpen = this._overlayAttached = true;
808+
this.autocomplete._latestOpeningTrigger = this;
802809
this.autocomplete._setColor(this._formField?.color);
803810
this._updatePanelState();
804811
this._applyModalPanelOwnership();

src/material/autocomplete/autocomplete.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -145,6 +145,9 @@ export class MatAutocomplete implements AfterContentInit, OnDestroy {
145145
}
146146
_isOpen: boolean = false;
147147

148+
/** Latest trigger that opened the autocomplete. */
149+
_latestOpeningTrigger: unknown;
150+
148151
/** @docs-private Sets the theme color of the panel. */
149152
_setColor(value: ThemePalette) {
150153
this._color = value;

tools/public_api_guard/material/autocomplete.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -91,6 +91,7 @@ export class MatAutocomplete implements AfterContentInit, OnDestroy {
9191
// (undocumented)
9292
_isOpen: boolean;
9393
_keyManager: ActiveDescendantKeyManager<MatOption>;
94+
_latestOpeningTrigger: unknown;
9495
// (undocumented)
9596
static ngAcceptInputType_autoActiveFirstOption: unknown;
9697
// (undocumented)

0 commit comments

Comments
 (0)