diff --git a/src/lib/dialog/dialog-ref.ts b/src/lib/dialog/dialog-ref.ts index f0dc22271957..5d44899981e2 100644 --- a/src/lib/dialog/dialog-ref.ts +++ b/src/lib/dialog/dialog-ref.ts @@ -89,6 +89,13 @@ export class MdDialogRef { return this._beforeClose.asObservable(); } + /** + * Gets an observable that emits when the overlay's backdrop has been clicked. + */ + backdropClick(): Observable { + return this._overlayRef.backdropClick(); + } + /** * Updates the dialog's position. * @param position New dialog position. diff --git a/src/lib/dialog/dialog.spec.ts b/src/lib/dialog/dialog.spec.ts index ca09dc13883c..b06150d8c8e1 100644 --- a/src/lib/dialog/dialog.spec.ts +++ b/src/lib/dialog/dialog.spec.ts @@ -237,6 +237,30 @@ describe('MdDialog', () => { }); })); + it('should emit the backdropClick stream when clicking on the overlay backdrop', async(() => { + const dialogRef = dialog.open(PizzaMsg, { + viewContainerRef: testViewContainerRef + }); + + const spy = jasmine.createSpy('backdropClick spy'); + dialogRef.backdropClick().subscribe(spy); + + viewContainerFixture.detectChanges(); + + let backdrop = overlayContainerElement.querySelector('.cdk-overlay-backdrop') as HTMLElement; + + backdrop.click(); + expect(spy).toHaveBeenCalledTimes(1); + + viewContainerFixture.detectChanges(); + + viewContainerFixture.whenStable().then(() => { + // Additional clicks after the dialog has closed should not be emitted + backdrop.click(); + expect(spy).toHaveBeenCalledTimes(1); + }); + })); + it('should notify the observers if a dialog has been opened', () => { dialog.afterOpen.subscribe(ref => { expect(dialog.open(PizzaMsg, {