Skip to content

Commit

Permalink
fix(dialog): capture previously focused element immediately
Browse files Browse the repository at this point in the history
Captures the previously-focused element immediately, instead of waiting until the animation is done. This fixes a regression from angular#3774, because if we wait for the animation to finish, the focus might have shifted, or the element could have been disabled.
  • Loading branch information
crisbeto committed Apr 19, 2017
1 parent 8d0cd04 commit 5b485bc
Showing 1 changed file with 20 additions and 2 deletions.
22 changes: 20 additions & 2 deletions src/lib/dialog/dialog-container.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@ import {
Renderer,
ElementRef,
EventEmitter,
Inject,
Optional,
} from '@angular/core';
import {
animate,
Expand All @@ -15,6 +17,7 @@ import {
transition,
AnimationEvent,
} from '@angular/animations';
import {DOCUMENT} from '@angular/platform-browser';
import {BasePortalHost, ComponentPortal, PortalHostDirective, TemplatePortal} from '../core';
import {MdDialogConfig} from './dialog-config';
import {MdDialogContentAlreadyAttachedError} from './dialog-errors';
Expand Down Expand Up @@ -57,6 +60,9 @@ export class MdDialogContainer extends BasePortalHost {
/** Element that was focused before the dialog was opened. Save this to restore upon close. */
private _elementFocusedBeforeDialogWasOpened: HTMLElement = null;

/** Reference to the global document object. */
private _document: Document|Document;

/** The dialog configuration. */
dialogConfig: MdDialogConfig;

Expand All @@ -69,9 +75,11 @@ export class MdDialogContainer extends BasePortalHost {
constructor(
private _renderer: Renderer,
private _elementRef: ElementRef,
private _focusTrapFactory: FocusTrapFactory) {
private _focusTrapFactory: FocusTrapFactory,
@Optional() @Inject(DOCUMENT) _document: any) {

super();
this._document = _document;
}

/**
Expand All @@ -83,6 +91,7 @@ export class MdDialogContainer extends BasePortalHost {
throw new MdDialogContentAlreadyAttachedError();
}

this._savePreviouslyFocusedElement();
return this._portalHost.attachComponentPortal(portal);
}

Expand All @@ -95,6 +104,7 @@ export class MdDialogContainer extends BasePortalHost {
throw new MdDialogContentAlreadyAttachedError();
}

this._savePreviouslyFocusedElement();
return this._portalHost.attachTemplatePortal(portal);
}

Expand All @@ -109,10 +119,18 @@ export class MdDialogContainer extends BasePortalHost {
// If were to attempt to focus immediately, then the content of the dialog would not yet be
// ready in instances where change detection has to run first. To deal with this, we simply
// wait for the microtask queue to be empty.
this._elementFocusedBeforeDialogWasOpened = document.activeElement as HTMLElement;
this._focusTrap.focusFirstTabbableElementWhenReady();
}

/**
* Saves a reference to the element that was focused before the dialog was opened.
*/
private _savePreviouslyFocusedElement() {
if (this._document) {
this._elementFocusedBeforeDialogWasOpened = this._document.activeElement as HTMLElement;
}
}

/**
* Callback, invoked whenever an animation on the host completes.
* @docs-private
Expand Down

0 comments on commit 5b485bc

Please sign in to comment.