Skip to content

Commit 3190451

Browse files
committed
fix(material/menu): close menu when cleared from trigger (#33306)
Fixes that the menu would get stuck in the open state if it's cleared from the trigger while it's open. Fixes #30139. (cherry picked from commit 8b729f3)
1 parent f3a3a7c commit 3190451

2 files changed

Lines changed: 17 additions & 1 deletion

File tree

src/material/menu/menu-trigger-base.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -134,6 +134,8 @@ export abstract class MatMenuTriggerBase implements OnDestroy {
134134
this._parentMaterialMenu.closed.emit(reason);
135135
}
136136
});
137+
} else {
138+
this._destroyMenu();
137139
}
138140

139141
this._menuItemInstance?._setTriggersSubmenu(this._triggersSubmenu());

src/material/menu/menu.spec.ts

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,7 @@ describe('MatMenu', () => {
7676
window.scroll(0, 0);
7777
});
7878

79-
it('should aria-controls the menu panel', () => {
79+
it('should set aria-controls on the menu panel', () => {
8080
const fixture = TestBed.createComponent(SimpleMenu);
8181
fixture.detectChanges();
8282
fixture.componentInstance.trigger.openMenu();
@@ -1149,6 +1149,20 @@ describe('MatMenu', () => {
11491149
expect(Math.floor(panelRect.bottom)).toBe(viewportHeight);
11501150
});
11511151

1152+
it('should close the menu when it is cleared from the trigger', async () => {
1153+
const fixture = TestBed.createComponent(SimpleMenu);
1154+
fixture.detectChanges();
1155+
fixture.componentInstance.trigger.openMenu();
1156+
fixture.detectChanges();
1157+
await wait(200);
1158+
expect(overlayContainerElement.querySelector('.mat-mdc-menu-panel')).toBeTruthy();
1159+
1160+
fixture.componentInstance.trigger.menu = null;
1161+
fixture.changeDetectorRef.markForCheck();
1162+
fixture.detectChanges();
1163+
expect(overlayContainerElement.querySelector('.mat-mdc-menu-panel')).toBeFalsy();
1164+
});
1165+
11521166
describe('lazy rendering', () => {
11531167
it('should be able to render the menu content lazily', () => {
11541168
const fixture = TestBed.createComponent(SimpleLazyMenu);

0 commit comments

Comments
 (0)