Description
Bug, feature request, or proposal:
The MdDialogRef.afterClosed() observable emits an event before the MdDialogContainer has restored focus to an underlying element. This can cause problems if subscriptions to MdDialogRef.afterClosed() involve triggering focus events themselves.
This happens because MdDialogContainer waits for the NgZone's onMicrotaskEmpty to emit before executing its refocus operation.
What is the expected behavior?
If this is the intended behaviour then I believe it should be made explicit in the documentation. Otherwise, the MdDialogRef.afterClosed() observable should only emit once all dialog cleanup has been completed.
Currently, the documentation says:
afterClosed- Gets an observable that is notified when the dialog is finished closing.
What is the current behavior?
See above
What are the steps to reproduce?
See this plunker. AppComponent wants to focus its input element after the dialog has closed but this event is overwritten by MdDialogContainer, which restores focus to the button element.
What is the use-case or motivation for changing an existing behavior?
The contract with MdDialogRef.afterClosed() should be clear.
I am using MdDialog within the context of an application that refocuses elements in a non-trivial way so it would not be possible to control this behaviour through tabindex attributes.
Which versions of Angular, Material, OS, browsers are affected?
Tested on Angular 4.0.1/Material head f40296e/Windows 7/Chrome 57
Is there anything else we should know?
The workaround I am using is to perform the focus event inside another NgZone.onMicrotaskEmpty subscription:
this.modal.afterClosed().subscribe(() => {
this.ngZone.onMicrotaskEmpty.first().subscribe(() => {
// Focus operation here
});
});