feat(sidenav): open all sidenavs from MdSidenavContainer

- added `open` and `close` functions that applies to both sidenavs in the container and resolves when both are finished

fixes #2591

Author: EladBezalel

src/lib/sidenav/sidenav.spec.ts

@@ -1,12 +1,11 @@
 import {fakeAsync, async, tick, ComponentFixture, TestBed} from '@angular/core/testing';
-import {Component} from '@angular/core';
+import {Component, ViewChild} from '@angular/core';
 import {By} from '@angular/platform-browser';
-import {MdSidenav, MdSidenavModule, MdSidenavToggleResult} from './sidenav';
+import {MdSidenav, MdSidenavModule, MdSidenavToggleResult, MdSidenavContainer} from './sidenav';
 import {A11yModule} from '../core/a11y/index';
 import {PlatformModule} from '../core/platform/index';
 import {ESCAPE} from '../core/keyboard/keycodes';
 
-
 function endSidenavTransition(fixture: ComponentFixture<any>) {
   let sidenav: any = fixture.debugElement.query(By.directive(MdSidenav)).componentInstance;
   sidenav._onTransitionEnd(<any> {
@@ -23,7 +22,6 @@ describe('MdSidenav', () => {
       imports: [MdSidenavModule.forRoot(), A11yModule.forRoot(), PlatformModule.forRoot()],
       declarations: [
         BasicTestApp,
-        SidenavContainerTwoSidenavTestApp,
         SidenavContainerNoSidenavTestApp,
         SidenavSetToOpenedFalse,
         SidenavSetToOpenedTrue,
@@ -444,6 +442,43 @@ describe('MdSidenav', () => {
   });
 });
 
+describe('MdSidenavContainer', () => {
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [MdSidenavModule.forRoot(), A11yModule.forRoot(), PlatformModule.forRoot()],
+      declarations: [
+        SidenavContainerTwoSidenavTestApp
+      ],
+    });
+
+    TestBed.compileComponents();
+  }));
+
+  describe('methods', () => {
+    it('should be able to open and close', async(() => {
+      const fixture = TestBed.createComponent(SidenavContainerTwoSidenavTestApp);
+
+      fixture.detectChanges();
+
+      const testComponent: SidenavContainerTwoSidenavTestApp =
+        fixture.debugElement.componentInstance;
+      const sidenavs = fixture.debugElement.queryAll(By.directive(MdSidenav));
+
+      expect(sidenavs.every(sidenav => sidenav.componentInstance.opened)).toBeFalsy();
+
+      return testComponent.sidenavContainer.open()
+        .then(() => {
+          expect(sidenavs.every(sidenav => sidenav.componentInstance.opened)).toBeTruthy();
+
+          return testComponent.sidenavContainer.close();
+        })
+        .then(() => {
+          expect(sidenavs.every(sidenav => sidenav.componentInstance.opened)).toBeTruthy();
+        });
+    }));
+  });
+});
+
 
 /** Test component that contains an MdSidenavContainer but no MdSidenav. */
 @Component({template: `<md-sidenav-container></md-sidenav-container>`})
@@ -453,11 +488,14 @@ class SidenavContainerNoSidenavTestApp { }
 @Component({
   template: `
     <md-sidenav-container>
-      <md-sidenav> </md-sidenav>
-      <md-sidenav> </md-sidenav>
+      <md-sidenav align="start"> </md-sidenav>
+      <md-sidenav align="end"> </md-sidenav>
     </md-sidenav-container>`,
 })
-class SidenavContainerTwoSidenavTestApp { }
+class SidenavContainerTwoSidenavTestApp {
+  @ViewChild(MdSidenavContainer)
+  sidenavContainer: MdSidenavContainer;
+}
 
 /** Test component that contains an MdSidenavContainer and one MdSidenav. */
 @Component({

src/lib/sidenav/sidenav.ts

@@ -377,6 +377,16 @@ export class MdSidenavContainer implements AfterContentInit {
     this._ngZone.onMicrotaskEmpty.first().subscribe(() => this._enableTransitions = true);
   }
 
+  /** Calls `open` of both start and end sidenavs */
+  public open() {
+    return Promise.all([this._start, this._end].map(sidenav => sidenav && sidenav.open()));
+  }
+
+  /** Calls `close` of both start and end sidenavs */
+  public close() {
+    return Promise.all([this._start, this._end].map(sidenav => sidenav && sidenav.close()));
+  }
+
   /**
    * Subscribes to sidenav events in order to set a class on the main container element when the
    * sidenav is open and the backdrop is visible. This ensures any overflow on the container element