fix(ngView): accidentally compiling leaving content

closes: #2304
angular · May 2, 2013 · 9956bae · 9956bae
1 parent 1d8e11d
commit 9956bae
Show file tree

Hide file tree

Showing 3 changed files with 56 additions and 10 deletions.
diff --git a/src/ng/animator.js b/src/ng/animator.js
@@ -272,14 +272,17 @@ var $AnimatorProvider = function() {
 
                   var durationKey = 'Duration';
                   var duration = 0;
+
                   //we want all the styles defined before and after
                   forEach(element, function(element) {
-                    var globalStyles = $window.getComputedStyle(element) || {};
-                    duration = Math.max(
-                        parseFloat(globalStyles[w3cTransitionProp    + durationKey]) ||
-                        parseFloat(globalStyles[vendorTransitionProp + durationKey]) ||
-                        0,
-                        duration);
+                    if (element.nodeType == 1) {
+                      var globalStyles = $window.getComputedStyle(element) || {};
+                      duration = Math.max(
+                          parseFloat(globalStyles[w3cTransitionProp    + durationKey]) ||
+                          parseFloat(globalStyles[vendorTransitionProp + durationKey]) ||
+                          0,
+                          duration);
+                    }
                   });
                   $window.setTimeout(done, duration * 1000);
                 } else {

diff --git a/src/ng/directive/ngView.js b/src/ng/directive/ngView.js
@@ -194,9 +194,10 @@ var ngViewDirective = ['$http', '$templateCache', '$route', '$anchorScroll', '$c
 
         if (template) {
           clearContent();
-          animate.enter(jqLite('<div></div>').html(template).contents(), element);
+          var enterElements = jqLite('<div></div>').html(template).contents();
+          animate.enter(enterElements, element);
 
-          var link = $compile(element.contents()),
+          var link = $compile(enterElements),
               current = $route.current,
               controller;
 

diff --git a/test/ng/directive/ngViewSpec.js b/test/ng/directive/ngViewSpec.js
@@ -3,7 +3,8 @@
 describe('ngView', function() {
   var element;
 
-  beforeEach(module(function() {
+  beforeEach(module(function($provide) {
+    $provide.value('$window', angular.mock.createMockWindow());
     return function($rootScope, $compile, $animator) {
       element = $compile('<ng:view onload="load()"></ng:view>')($rootScope);
       $animator.enabled(true);
@@ -621,5 +622,46 @@ describe('ngView', function() {
       }
     }));
 
+
+    it('should not double compile when route changes', function() {
+      module(function($routeProvider, $animationProvider, $provide) {
+        $routeProvider.when('/foo', {template: '<div ng-repeat="i in [1,2]">{{i}}</div>'});
+        $routeProvider.when('/bar', {template: '<div ng-repeat="i in [3,4]">{{i}}</div>'});
+        $animationProvider.register('my-animation-leave', function() {
+          return {
+            start: function(element, done) {
+              done();
+            }
+          };
+        });
+      });
+
+      inject(function($rootScope, $compile, $location, $route, $window, $rootElement, $sniffer) {
+        element = $compile(html('<ng:view onload="load()" ng-animate="\'my-animation\'"></ng:view>'))($rootScope);
+
+        $location.path('/foo');
+        $rootScope.$digest();
+        if ($sniffer.supportsTransitions) {
+          $window.setTimeout.expect(1).process();
+          $window.setTimeout.expect(0).process();
+        }
+        expect(element.text()).toEqual('12');
+
+        $location.path('/bar');
+        $rootScope.$digest();
+        expect(n(element.text())).toEqual('1234');
+        if ($sniffer.supportsTransitions) {
+          $window.setTimeout.expect(1).process();
+          $window.setTimeout.expect(1).process();
+        } else {
+          $window.setTimeout.expect(1).process();
+        }
+        expect(element.text()).toEqual('34');
+
+        function n(text) {
+          return text.replace(/\r\n/m, '').replace(/\r\n/m, '');
+        }
+      });
+    });
   });
-});
+});