Bug: MdSidenav [opened] causes unresolved event _openPromiseReject

[dima-gusyatiner]

Bug when using MdSidenav open as default:
<md-sidenav #demo opened="true">

The browser claims of an error when trying to close it with
<button md-button (click)="demo.close() / toggle()">Close</button>

core.umd.js:3427 EXCEPTION: Uncaught (in promise): undefinedErrorHandler.handleError @ core.umd.js:3427next @ core.umd.js:6901schedulerFn @ core.umd.js:6150SafeSubscriber.__tryOrUnsub @ Subscriber.ts:238SafeSubscriber.next @ Subscriber.ts:190Subscriber._next @ Subscriber.ts:135Subscriber.next @ Subscriber.ts:95Subject.next @ Subject.ts:61EventEmitter.emit @ core.umd.js:6142onError @ core.umd.js:6366onHandleError @ core.umd.js:6241ZoneDelegate.handleError @ zone.js:207Zone.runGuarded @ zone.js:113_loop_1 @ zone.js:379drainMicroTaskQueue @ zone.js:386ZoneTask.invoke @ zone.js:308
core.umd.js:3432 ORIGINAL STACKTRACE:ErrorHandler.handleError @ core.umd.js:3432next @ core.umd.js:6901schedulerFn @ core.umd.js:6150SafeSubscriber.__tryOrUnsub @ Subscriber.ts:238SafeSubscriber.next @ Subscriber.ts:190Subscriber._next @ Subscriber.ts:135Subscriber.next @ Subscriber.ts:95Subject.next @ Subject.ts:61EventEmitter.emit @ core.umd.js:6142onError @ core.umd.js:6366onHandleError @ core.umd.js:6241ZoneDelegate.handleError @ zone.js:207Zone.runGuarded @ zone.js:113_loop_1 @ zone.js:379drainMicroTaskQueue @ zone.js:386ZoneTask.invoke @ zone.js:308
core.umd.js:3433 Error: Uncaught (in promise): undefined
    at resolvePromise (zone.js:429)
    at MdSidenav.eval [as _openPromiseReject] (zone.js:406)
    at MdSidenav._onTransitionEnd (sidenav.js:164)
    at DebugAppView._View_AppComponent0._handle_transitionend_2_2 (AppComponent.ngfactory.js:732)
    at eval (core.umd.js:9678)
    at eval (platform-browser.umd.js:1813)
    at eval (platform-browser.umd.js:1926)
    at ZoneDelegate.invoke (zone.js:203)
    at Object.onInvoke (core.umd.js:6220)
    at ZoneDelegate.invoke (zone.js:202)ErrorHandler.handleError @ core.umd.js:3433next @ core.umd.js:6901schedulerFn @ core.umd.js:6150SafeSubscriber.__tryOrUnsub @ Subscriber.ts:238SafeSubscriber.next @ Subscriber.ts:190Subscriber._next @ Subscriber.ts:135Subscriber.next @ Subscriber.ts:95Subject.next @ Subject.ts:61EventEmitter.emit @ core.umd.js:6142onError @ core.umd.js:6366onHandleError @ core.umd.js:6241ZoneDelegate.handleError @ zone.js:207Zone.runGuarded @ zone.js:113_loop_1 @ zone.js:379drainMicroTaskQueue @ zone.js:386ZoneTask.invoke @ zone.js:308
zone.js:357 Error: Uncaught (in promise): undefined(…)

[rbaumi]

alpha.9-3 - same problem.

[leocaseiro]

It seems to be related to #1370

[leocaseiro]

I'm having similar issue even after the PR. It happens if I double click in a toggle sidenav open/close. It only happens if I double click pretty fast. Only on the transition phase.

The sidenab toggled normally, however, I'm getting an error on my console log:

core.umd.js:2840 Error: Uncaught (in promise): undefined
    at resolvePromise (http://localhost:3000/js/polyfills.js:9263:32)
    at MdSidenav._closePromiseReject (http://localhost:3000/js/polyfills.js:9240:14)
    at MdSidenav._onTransitionEnd (http://localhost:3000/js/vendor.js:50651:27)
    at Wrapper_MdSidenav.handleEvent (/MdSidenavModule/MdSidenav/wrapper.ngfactory.js:126:34)
    at CompiledTemplate.proxyViewClass.View_CoreApp0.handleEvent_31 (/CoreAppModule/CoreApp/component.ngfactory.js:459:34)
    at CompiledTemplate.proxyViewClass.<anonymous> (http://localhost:3000/js/vendor.js:27919:42)
    at HTMLElement.<anonymous> (http://localhost:3000/js/vendor.js:30653:41)
    at ZoneDelegate.invokeTask (http://localhost:3000/js/polyfills.js:9060:36)
    at Object.onInvokeTask (http://localhost:3000/js/vendor.js:24436:42)
    at ZoneDelegate.invokeTask (http://localhost:3000/js/polyfills.js:9059:41)
    at Zone.runTask (http://localhost:3000/js/polyfills.js:8949:48)
    at HTMLElement.ZoneTask.invoke (http://localhost:3000/js/polyfills.js:9130:34)
  -------------   Elapsed: 2209 ms; At: Wed Nov 16 2016 16:27:56 GMT+1100 (AEDT)   -------------  
    at Object.onScheduleTask (http://localhost:3000/js/polyfills.js:10383:19)
    at ZoneDelegate.scheduleTask (http://localhost:3000/js/polyfills.js:9037:50)
    at Zone.scheduleEventTask (http://localhost:3000/js/polyfills.js:8969:40)
    at zoneAwareAddListener (http://localhost:3000/js/polyfills.js:9619:15)
    at HTMLElement.addEventListener (eval at createNamedFn (http://localhost:3000/js/polyfills.js:9722:18), <anonymous>:3:43)
    at DomEventsPlugin.addEventListener (http://localhost:3000/js/vendor.js:30766:22)
    at EventManager.addEventListener (http://localhost:3000/js/vendor.js:30264:28)
    at DomRenderer.listen (http://localhost:3000/js/vendor.js:30557:53)
    at DebugDomRenderer.listen (http://localhost:3000/js/vendor.js:27248:36)
    at subscribeToRenderElement (http://localhost:3000/js/vendor.js:23470:45)
    at CompiledTemplate.proxyViewClass.View_CoreApp0.createInternal (/CoreAppModule/CoreApp/component.ngfactory.js:176:22)
    at CompiledTemplate.proxyViewClass.AppView.create (http://localhost:3000/js/vendor.js:27588:26)
    at CompiledTemplate.proxyViewClass.DebugAppView.create (http://localhost:3000/js/vendor.js:27841:49)
    at CompiledTemplate.proxyViewClass.View_CoreApp_Host0.createInternal (/CoreAppModule/CoreApp/host.ngfactory.js:26:19)
    at CompiledTemplate.proxyViewClass.AppView.createHostView (http://localhost:3000/js/vendor.js:27595:26)
    at CompiledTemplate.proxyViewClass.DebugAppView.createHostView (http://localhost:3000/js/vendor.js:27852:57)
    at ComponentFactory.create (http://localhost:3000/js/vendor.js:23951:30)
    at ViewContainerRef_.createComponent (http://localhost:3000/js/vendor.js:25599:50)
    at RouterOutlet.activate (http://localhost:3000/js/vendor.js:38425:45)
    at ActivateRoutes.placeComponentIntoOutlet (http://localhost:3000/js/vendor.js:37903:21)
    at ActivateRoutes.activateRoutes (http://localhost:3000/js/vendor.js:37877:27)
    at http://localhost:3000/js/vendor.js:37832:63
    at Array.forEach (native)
....

Eq:

<button md-button class="md-icon-button" aria-label="Open Menu" (click)="menu.toggle()">
    <md-icon>menu</md-icon>
</button>
<md-sidenav #menu [opened]="true" mode="side" layout-padding>
    My Sidenav
</md-sidenav>

I believe is something related to the method _onTransitionEnd().

I've commented the code inside _onTransitionEnd() and the animation is happenning normally without any warnings.

PS: After the first error on console.log. If I double click, I no longer get errors.

Update: This answer fix the error #1370 (comment)

[jelbourn]

@leocaseiro please file a new issue