fix($animate): ensure that from styles are applied for class-based animations

matsko · matsko · commit 8f819d2cb5c8 · 2015-04-24T11:11:12.000-07:00
diff --git a/src/ngAnimate/animateCss.js b/src/ngAnimate/animateCss.js
@@ -699,9 +699,8 @@ var $AnimateCssProvider = ['$animateProvider', function($animateProvider) {
                                        stagger.animationDuration === 0;
       }
 
-      if (flags.blockTransition) {
-        applyAnimationFromStyles(element, options);
-      } else {
+      applyAnimationFromStyles(element, options);
+      if (!flags.blockTransition) {
         blockTransitions(node, false);
       }
 
diff --git a/test/ngAnimate/animateCssSpec.js b/test/ngAnimate/animateCssSpec.js
@@ -2116,6 +2116,26 @@ describe("ngAnimate $animateCss", function() {
           expect(element.css('height')).toBe('66px');
         }));
 
+        it("should always apply the from styles before the start function is called even if no transition is detected when started",
+          inject(function($animateCss, $rootElement) {
+
+          ss.addRule('.my-class', 'transition: 0s linear color');
+
+          var options = {
+            addClass: 'my-class',
+            from: { height: '26px' },
+            to: { height: '500px' }
+          };
+
+          var animator = $animateCss(element, options);
+          expect(element.css('height')).toBe('26px');
+
+          animator.start();
+          triggerAnimationStartFrame();
+
+          expect(element.css('height')).toBe('500px');
+        }));
+
         it("should apply an inline transition if [to] styles and a duration are provided",
           inject(function($animateCss, $rootElement) {
 

Original file line number	Diff line number	Diff line change
`@@ -699,9 +699,8 @@ var $AnimateCssProvider = ['$animateProvider', function($animateProvider) {`
`699`	`699`	`stagger.animationDuration === 0;`
`700`	`700`	`}`
`701`	`701`
`702`		`- if (flags.blockTransition) {`
`703`		`- applyAnimationFromStyles(element, options);`
`704`		`- } else {`
	`702`	`+ applyAnimationFromStyles(element, options);`
	`703`	`+ if (!flags.blockTransition) {`
`705`	`704`	`blockTransitions(node, false);`
`706`	`705`	`}`
`707`	`706`