fix(sidenav): notify child components when the element is opened (#9512)

Triggers a resize event whenever a sidenav is opened. This allows components like virtualRepeat and textarea to resize properly.

Fixes #7309.

Author: crisbeto

src/components/sidenav/sidenav.js

@@ -243,7 +243,8 @@ function SidenavFocusDirective() {
  *   - `<md-sidenav md-is-locked-open="$mdMedia('min-width: 1000px')"></md-sidenav>`
  *   - `<md-sidenav md-is-locked-open="$mdMedia('sm')"></md-sidenav>` (locks open on small screens)
  */
-function SidenavDirective($mdMedia, $mdUtil, $mdConstant, $mdTheming, $animate, $compile, $parse, $log, $q, $document) {
+function SidenavDirective($mdMedia, $mdUtil, $mdConstant, $mdTheming,
+  $animate, $compile, $parse, $log, $q, $document, $window) {
   return {
     restrict: 'E',
     scope: {
@@ -268,6 +269,7 @@ function SidenavDirective($mdMedia, $mdUtil, $mdConstant, $mdTheming, $animate,
     var previousContainerStyles;
     var promise = $q.when(true);
     var isLockedOpenParsed = $parse(attr.mdIsLockedOpen);
+    var ngWindow = angular.element($window);
     var isLocked = function() {
       return isLockedOpenParsed(scope.$parent, {
         $media: function(arg) {
@@ -365,6 +367,8 @@ function SidenavDirective($mdMedia, $mdUtil, $mdConstant, $mdTheming, $animate,
       ]).then(function() {
         // Perform focus when animations are ALL done...
         if (scope.isOpen) {
+          // Notifies child components that the sidenav was opened.
+          ngWindow.triggerHandler('resize');
           focusEl && focusEl.focus();
         }
 

src/components/sidenav/sidenav.spec.js

@@ -164,6 +164,22 @@ describe('mdSidenav', function() {
       });
     });
 
+    it('should trigger a resize event when opening',
+      inject(function($rootScope, $material, $window) {
+        var el = setup('md-is-open="show"');
+        var obj = { callback: function() {} };
+
+        spyOn(obj, 'callback');
+        angular.element($window).on('resize', obj.callback);
+
+        $rootScope.$apply('show = true');
+        $material.flushOutstandingAnimations();
+
+        expect(obj.callback).toHaveBeenCalled();
+        angular.element($window).off('resize', obj.callback);
+      })
+    );
+
     describe('parent scroll prevention', function() {
       it('should prevent scrolling on the parent element', inject(function($rootScope) {
         var parent = setup('md-is-open="isOpen"').parent()[0];