diff --git a/src/lib/sidenav/sidenav.spec.ts b/src/lib/sidenav/sidenav.spec.ts index a977b119f8c1..fb152b11bc3c 100644 --- a/src/lib/sidenav/sidenav.spec.ts +++ b/src/lib/sidenav/sidenav.spec.ts @@ -194,7 +194,7 @@ describe('MdSidenav', () => { }).not.toThrow(); })); - it('should emit the backdrop-clicked event when the backdrop is clicked', fakeAsync(() => { + it('should emit the backdropClick event when the backdrop is clicked', fakeAsync(() => { let fixture = TestBed.createComponent(BasicTestApp); let testComponent: BasicTestApp = fixture.debugElement.componentInstance; @@ -264,6 +264,54 @@ describe('MdSidenav', () => { expect(testComponent.closeCount).toBe(1); })); + it('should not close by pressing escape when disableClose is set', fakeAsync(() => { + let fixture = TestBed.createComponent(BasicTestApp); + let testComponent = fixture.debugElement.componentInstance; + let sidenav = fixture.debugElement.query(By.directive(MdSidenav)).componentInstance; + + sidenav.disableClose = true; + sidenav.open(); + + fixture.detectChanges(); + endSidenavTransition(fixture); + tick(); + + sidenav.handleKeydown({ + keyCode: ESCAPE, + stopPropagation: () => {} + }); + + fixture.detectChanges(); + endSidenavTransition(fixture); + tick(); + + expect(testComponent.closeCount).toBe(0); + })); + + it('should not close by clicking on the backdrop when disableClose is set', fakeAsync(() => { + let fixture = TestBed.createComponent(BasicTestApp); + let testComponent = fixture.debugElement.componentInstance; + let sidenav = fixture.debugElement.query(By.directive(MdSidenav)).componentInstance; + + sidenav.disableClose = true; + sidenav.open(); + + fixture.detectChanges(); + endSidenavTransition(fixture); + tick(); + + let backdropEl = fixture.debugElement.query(By.css('.md-sidenav-backdrop')).nativeElement; + backdropEl.click(); + fixture.detectChanges(); + tick(); + + fixture.detectChanges(); + endSidenavTransition(fixture); + tick(); + + expect(testComponent.closeCount).toBe(0); + })); + it('should restore focus to the trigger element on close', fakeAsync(() => { let fixture = TestBed.createComponent(BasicTestApp); let sidenav: MdSidenav = fixture.debugElement @@ -414,7 +462,7 @@ class SidenavContainerTwoSidenavTestApp { } /** Test component that contains an MdSidenavContainer and one MdSidenav. */ @Component({ template: ` - + (); + @Output() backdropClick = new EventEmitter(); /** The sidenav at the start/end alignment, independent of direction. */ private _start: MdSidenav; @@ -434,17 +440,15 @@ export class MdSidenavContainer implements AfterContentInit { } _onBackdropClicked() { - this.onBackdropClicked.emit(); + this.backdropClick.emit(); this._closeModalSidenav(); } _closeModalSidenav() { - if (this._start != null && this._start.mode != 'side') { - this._start.close(); - } - if (this._end != null && this._end.mode != 'side') { - this._end.close(); - } + // Close all open sidenav's where closing is not disabled and the mode is not `side`. + [this._start, this._end] + .filter(sidenav => sidenav && !sidenav.disableClose && sidenav.mode !== 'side') + .forEach(sidenav => sidenav.close()); } _isShowingBackdrop(): boolean {