Skip to content

Commit

Permalink
fix(multiple): memory leak when forcing focus (#24520)
Browse files Browse the repository at this point in the history
When we force focus on an element, we were adding a couple of event listeners that were never removed.

(cherry picked from commit 764030d)
  • Loading branch information
crisbeto authored and wagnermaciel committed Mar 17, 2022
1 parent 0897f49 commit 0a3c7d7
Show file tree
Hide file tree
Showing 4 changed files with 32 additions and 8 deletions.
10 changes: 8 additions & 2 deletions src/cdk-experimental/dialog/dialog-container.ts
Original file line number Diff line number Diff line change
Expand Up @@ -267,8 +267,14 @@ export class CdkDialogContainer extends BasePortalOutlet implements OnDestroy {
element.tabIndex = -1;
// The tabindex attribute should be removed to avoid navigating to that element again
this._ngZone.runOutsideAngular(() => {
element.addEventListener('blur', () => element.removeAttribute('tabindex'));
element.addEventListener('mousedown', () => element.removeAttribute('tabindex'));
const callback = () => {
element.removeEventListener('blur', callback);
element.removeEventListener('mousedown', callback);
element.removeAttribute('tabindex');
};

element.addEventListener('blur', callback);
element.addEventListener('mousedown', callback);
});
}
element.focus(options);
Expand Down
10 changes: 8 additions & 2 deletions src/material/bottom-sheet/bottom-sheet-container.ts
Original file line number Diff line number Diff line change
Expand Up @@ -210,8 +210,14 @@ export class MatBottomSheetContainer extends BasePortalOutlet implements OnDestr
element.tabIndex = -1;
// The tabindex attribute should be removed to avoid navigating to that element again
this._ngZone.runOutsideAngular(() => {
element.addEventListener('blur', () => element.removeAttribute('tabindex'));
element.addEventListener('mousedown', () => element.removeAttribute('tabindex'));
const callback = () => {
element.removeEventListener('blur', callback);
element.removeEventListener('mousedown', callback);
element.removeAttribute('tabindex');
};

element.addEventListener('blur', callback);
element.addEventListener('mousedown', callback);
});
}
element.focus(options);
Expand Down
10 changes: 8 additions & 2 deletions src/material/dialog/dialog-container.ts
Original file line number Diff line number Diff line change
Expand Up @@ -174,8 +174,14 @@ export abstract class _MatDialogContainerBase extends BasePortalOutlet {
element.tabIndex = -1;
// The tabindex attribute should be removed to avoid navigating to that element again
this._ngZone.runOutsideAngular(() => {
element.addEventListener('blur', () => element.removeAttribute('tabindex'));
element.addEventListener('mousedown', () => element.removeAttribute('tabindex'));
const callback = () => {
element.removeEventListener('blur', callback);
element.removeEventListener('mousedown', callback);
element.removeAttribute('tabindex');
};

element.addEventListener('blur', callback);
element.addEventListener('mousedown', callback);
});
}
element.focus(options);
Expand Down
10 changes: 8 additions & 2 deletions src/material/sidenav/drawer.ts
Original file line number Diff line number Diff line change
Expand Up @@ -388,8 +388,14 @@ export class MatDrawer implements AfterViewInit, AfterContentChecked, OnDestroy
element.tabIndex = -1;
// The tabindex attribute should be removed to avoid navigating to that element again
this._ngZone.runOutsideAngular(() => {
element.addEventListener('blur', () => element.removeAttribute('tabindex'));
element.addEventListener('mousedown', () => element.removeAttribute('tabindex'));
const callback = () => {
element.removeEventListener('blur', callback);
element.removeEventListener('mousedown', callback);
element.removeAttribute('tabindex');
};

element.addEventListener('blur', callback);
element.addEventListener('mousedown', callback);
});
}
element.focus(options);
Expand Down

0 comments on commit 0a3c7d7

Please sign in to comment.