Skip to content

Commit fe55b6c

Browse files
committed
Effects: Updating unit tests to use some more stable logic hopefully
1 parent 1da2bf0 commit fe55b6c

File tree

2 files changed

+76
-36
lines changed

2 files changed

+76
-36
lines changed

tests/unit/effects/effects_core.js

Lines changed: 67 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -61,38 +61,79 @@ asyncTest( "animateClass works with borderStyle", function() {
6161

6262
asyncTest( "animateClass works with colors", function() {
6363
var test = $("div.animateClass"),
64-
count = 0;
64+
count = 0,
65+
oldStep = jQuery.fx.step.backgroundColor;
6566
expect(2);
66-
test.toggleClass("testChangeBackground", duration, function() {
67-
present( test.css("backgroundColor"), [ "#ffffff", "#fff", "rgb(255, 255, 255)" ], "Color is final" );
68-
start();
67+
68+
// we want to catch the first frame of animation
69+
jQuery.fx.step.backgroundColor = function( fx ) {
70+
oldStep.apply( this, arguments );
71+
72+
// make sure it has animated somewhere we can detect
73+
if ( fx.pos > 255 / 2000 ) {
74+
jQuery.fx.step.backgroundColor = oldStep;
75+
notPresent( test.css("backgroundColor"),
76+
[ "#000000", "#ffffff", "#000", "#fff", "rgb(0, 0, 0)", "rgb(255,255,255)" ],
77+
"Color is not endpoints in middle." );
78+
test.stop( true, true );
79+
}
80+
};
81+
82+
test.toggleClass("testChangeBackground", {
83+
duration: 2000,
84+
complete: function() {
85+
present( test.css("backgroundColor"), [ "#ffffff", "#fff", "rgb(255, 255, 255)" ], "Color is final" );
86+
start();
87+
}
6988
});
70-
setTimeout(function() {
71-
var color = test.css("backgroundColor");
72-
notPresent( color, [ "#000000", "#ffffff", "#000", "#fff", "rgb(0, 0, 0)", "rgb(255,255,255)" ],
73-
"Color is not endpoints in middle." );
74-
}, mid);
7589
});
7690

77-
asyncTest( "animateClass works with children", function() {
78-
var test = $("div.animateClass"),
79-
h2 = test.find("h2");
91+
asyncTest( "animateClass calls step option", 1, function() {
92+
var test = jQuery("div.animateClass"),
93+
done = function() {
94+
done = jQuery.noop;
95+
test.stop();
96+
start();
97+
};
98+
test.toggleClass( "testChangeBackground", {
99+
step: function( fx ) {
100+
ok( true, "Step Function Called" );
101+
setTimeout( done, 0 );
102+
}
103+
});
104+
});
80105

81-
expect(4);
82-
setTimeout(function() {
83-
notPresent( h2.css("fontSize"), ["10px","20px"], "Font size is neither endpoint when in middle.");
84-
}, mid);
85-
test.toggleClass("testChildren", { children: true, duration: duration, complete: function() {
86-
equal( h2.css("fontSize"), "20px", "Text size is final during complete");
87-
test.toggleClass("testChildren", duration, function() {
88-
equal( h2.css("fontSize"), "10px", "Text size revertted after class removed");
106+
asyncTest( "animateClass works with children", 3, function() {
107+
var animatedChild,
108+
test = $("div.animateClass"),
109+
h2 = test.find("h2");
89110

90-
start();
91-
});
92-
setTimeout(function() {
93-
equal( h2.css("fontSize"), "20px", "Text size unchanged during animate with children: undefined" );
94-
}, mid);
95-
}});
111+
test.toggleClass("testChildren", {
112+
children: true,
113+
duration: duration,
114+
complete: function() {
115+
equal( h2.css("fontSize"), "20px", "Text size is final during complete");
116+
test.toggleClass("testChildren", {
117+
duration: duration,
118+
complete: function() {
119+
equal( h2.css("fontSize"), "10px", "Text size revertted after class removed");
120+
121+
start();
122+
},
123+
step: function( val, fx ) {
124+
if ( fx.elem === h2[ 0 ] ) {
125+
ok( false, "Error - Animating property on h2" );
126+
}
127+
}
128+
});
129+
},
130+
step: function( val, fx ) {
131+
if ( fx.prop === "fontSize" && fx.elem === h2[ 0 ] && !animatedChild ) {
132+
equal( fx.end, 20, "animating font size on child" );
133+
animatedChild = true;
134+
}
135+
}
136+
});
96137
});
97138

98139
asyncTest( "animateClass clears style properties when stopped", function() {

ui/jquery.effects.core.js

Lines changed: 9 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -268,16 +268,15 @@ $.effects.animateClass = function( value, duration, easing, callback ) {
268268
// map all animated objects again - this time collecting a promise
269269
allAnimations = allAnimations.map(function() {
270270
var styleInfo = this,
271-
dfd = $.Deferred();
272-
273-
this.el.animate( this.diff, {
274-
duration: o.duration,
275-
easing: o.easing,
276-
queue: false,
277-
complete: function() {
278-
dfd.resolve( styleInfo );
279-
}
280-
});
271+
dfd = $.Deferred(),
272+
opts = jQuery.extend({}, o, {
273+
queue: false,
274+
complete: function() {
275+
dfd.resolve( styleInfo )
276+
}
277+
});
278+
279+
this.el.animate( this.diff, opts );
281280
return dfd.promise();
282281
});
283282

0 commit comments

Comments
 (0)