From b6303fed43f774ed04c8262888152f12273d60ab Mon Sep 17 00:00:00 2001 From: crisbeto Date: Thu, 6 Jun 2019 18:50:01 +0200 Subject: [PATCH] fix(dialog): not moving focus to container if autoFocus is disabled and focus was moved from a different component Given an example where we have a `mat-menu` that opens a dialog with `autoFocus = false`, the user's focus will end up on the menu's trigger, rather than the dialog container. This is due to the fact that we move focus to the dialog container immediately when the opening sequence starts and we assume that it's going to stay there. This isn't a problem when `autoFocus` is enabled, because we also try to move focus once the animation is done. These changes add an extra call after the animation finishes to ensure that the container has focus. Fixes #16215. --- src/material/dialog/dialog-container.ts | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/material/dialog/dialog-container.ts b/src/material/dialog/dialog-container.ts index 7a80ee3a5e3e..a1d6d7de7e43 100644 --- a/src/material/dialog/dialog-container.ts +++ b/src/material/dialog/dialog-container.ts @@ -141,6 +141,11 @@ export class MatDialogContainer extends BasePortalOutlet { // wait for the microtask queue to be empty. if (this._config.autoFocus) { this._focusTrap.focusInitialElementWhenReady(); + } else { + // Otherwise ensure that focus is on the dialog container. It's possible that a different + // component tried to move focus while the open animation was running. See: + // https://github.com/angular/components/issues/16215 + this._elementRef.nativeElement.focus(); } }