Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.

Commit b54eefd

Browse files
committedJul 14, 2015
test($animateCss): ensure that transitionStyle by itself doesn't trigger anything
Using `transitionStyle` without any other properties does not trigger an animation so we could have a test to assert that it doesn't do that.
1 parent 768794b commit b54eefd

File tree

2 files changed

+28
-2
lines changed

2 files changed

+28
-2
lines changed
 

‎src/ngAnimate/animateCss.js

+4-1
Original file line numberDiff line numberDiff line change
@@ -560,7 +560,10 @@ var $AnimateCssProvider = ['$animateProvider', function($animateProvider) {
560560

561561
// there is no way we can trigger an animation since no styles and
562562
// no classes are being applied which would then trigger a transition
563-
if (!containsKeyframeAnimation && !hasToStyles && !setupClasses) {
563+
// is there a raw keyframe value that is applied to the element
564+
if (!containsKeyframeAnimation
565+
&& !hasToStyles
566+
&& !setupClasses) {
564567
return closeAndReturnNoopAnimator();
565568
}
566569

‎test/ngAnimate/animateCssSpec.js

+24-1
Original file line numberDiff line numberDiff line change
@@ -2017,7 +2017,7 @@ describe("ngAnimate $animateCss", function() {
20172017
});
20182018
});
20192019

2020-
describe("[transtionStyle]", function() {
2020+
describe("[transitionStyle]", function() {
20212021
it("should apply the transition directly onto the element and animate accordingly",
20222022
inject(function($animateCss, $rootElement) {
20232023

@@ -2092,6 +2092,29 @@ describe("ngAnimate $animateCss", function() {
20922092
expect(element.css('transition-property')).toMatch('color');
20932093
expect(style).toContain('ease-in');
20942094
}));
2095+
2096+
it("should only execute the animation if any CSS to styles are mixed into together",
2097+
inject(function($animateCss, $rootElement) {
2098+
2099+
var options = {
2100+
transitionStyle: '6s 4s ease-out all'
2101+
};
2102+
2103+
$animateCss(element, options).start();
2104+
triggerAnimationStartFrame();
2105+
2106+
expect(element.css(prefix + 'transition-delay')).toEqual('');
2107+
expect(element.css(prefix + 'transition-duration')).toEqual('');
2108+
expect(element.css(prefix + 'transition-timing-function')).toEqual('');
2109+
2110+
options.to = { color: 'brown' };
2111+
$animateCss(element, options).start();
2112+
triggerAnimationStartFrame();
2113+
2114+
expect(element.css(prefix + 'transition-delay')).toEqual('4s');
2115+
expect(element.css(prefix + 'transition-duration')).toEqual('6s');
2116+
expect(element.css(prefix + 'transition-timing-function')).toEqual('ease-out');
2117+
}));
20952118
});
20962119

20972120
describe("[keyframeStyle]", function() {

0 commit comments

Comments
 (0)
This repository has been archived.