refactor(sidenav): switch to the angular animations API

[crisbeto]

Switches the sidenav to use the @angular/animations API. This saves us a lot of code that was involved in orchestrating the various animations, in addition to making it easier to follow. It also makes it possible for the consumer to disable the animations by using the NoopAnimationsModule.

[mmalerba]

since these are all void now the return isn't necessary

[mmalerba]

return not needed

[mmalerba]

I assume the animation API provides some way for people to still hook into these events without returning the promise?

[crisbeto]

We can have an observable that emits in the done callback, but I'm not sure that it's worth the trouble.

[mmalerba]

I'm just asking since I don't know much about the animations API, how do I as a user who is currently doing this:

snav.toggle().then(() => doStuff())

change it to work after this PR? I would guess something like this?

<md-sidenav (@transform.start)="doStuff()"></md-sidenav>

[crisbeto]

That won't work, because the Angular animation events don't propagate IIRC. The way to do it would be:

snav.onOpen.subscribe(() => doStuff());
snav.open();

I guess we could return the onOpen and onClose observables from the open/close methods, but I'm not sure whether it's necessary. The promises that were a part of the old API looked like they were there only there for synchronizing the animations internally.

[mmalerba]

Ok sg, just wanted to make sure we weren't taking away functionality

[mmalerba]

@crisbeto Let's add back these promises because they are used pretty extensively throughout Google's code. We can leave a comment to remove them in the future. (I can do so as part of my other upcoming breaking sidenav changes).

[crisbeto]

Done.

[crisbeto]

Addressed the feedback @mmalerba.

[kara]

Note: need to update some tests that rely on mat-sidenav-opening / mat-sidenav-closing classes before merging

[mmalerba]

Please rebase

[crisbeto]

Seems like the tests are failing after a rebase. Will look into it tomorrow.

[mmalerba]

sorry, needs more rebasing

[kara]

@crisbeto Lint is failing right now; can you update?

[mmalerba]

@andrewseguin Return values have been added back to toggle & friends, want to try another presubmit

[andrewseguin]

Not sure what I'm seeing here, but it looks like you need to rebase. I see this in your sidenav.ts

private _watchSidenavToggle(sidenav: MdSidenav): void {
    if (!sidenav || sidenav.mode === 'side') { return; }
    sidenav.onOpen.subscribe(() => this._setContainerClass(true));
    sidenav.onClose.subscribe(() => this._setContainerClass(false));
  }

which differs from master:

private _watchSidenavToggle(sidenav: MdSidenav): void {
    merge(sidenav.onOpenStart, sidenav.onCloseStart).subscribe(() => {
      this._changeDetectorRef.markForCheck();
    });

    if (sidenav.mode !== 'side') {
      sidenav.onOpen.subscribe(() => this._setContainerClass(true));
      sidenav.onClose.subscribe(() => this._setContainerClass(false));
    }
  }

[crisbeto]

Weird that GitHub didn't pick that one up as a conflict @andrewseguin. I've rebased it and fixed the issue.

[andrewseguin]

Sorry one more thing, the e2e is getting timeouts on the CI. I tried re-running and got the same error. Can you check it out?

[crisbeto]

Sorted out all the failures @andrewseguin.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}