Permalink
Browse files

Effects: Updating unit tests to use some more stable logic hopefully

  • Loading branch information...
1 parent 1da2bf0 commit fe55b6cddb00b85a56f9eb8f753b0535690d8b95 @gnarf gnarf committed Apr 30, 2012
Showing with 76 additions and 36 deletions.
  1. +67 −26 tests/unit/effects/effects_core.js
  2. +9 −10 ui/jquery.effects.core.js
View
93 tests/unit/effects/effects_core.js
@@ -61,38 +61,79 @@ asyncTest( "animateClass works with borderStyle", function() {
asyncTest( "animateClass works with colors", function() {
var test = $("div.animateClass"),
- count = 0;
+ count = 0,
+ oldStep = jQuery.fx.step.backgroundColor;
expect(2);
- test.toggleClass("testChangeBackground", duration, function() {
- present( test.css("backgroundColor"), [ "#ffffff", "#fff", "rgb(255, 255, 255)" ], "Color is final" );
- start();
+
+ // we want to catch the first frame of animation
+ jQuery.fx.step.backgroundColor = function( fx ) {
+ oldStep.apply( this, arguments );
+
+ // make sure it has animated somewhere we can detect
+ if ( fx.pos > 255 / 2000 ) {
+ jQuery.fx.step.backgroundColor = oldStep;
+ notPresent( test.css("backgroundColor"),
+ [ "#000000", "#ffffff", "#000", "#fff", "rgb(0, 0, 0)", "rgb(255,255,255)" ],
+ "Color is not endpoints in middle." );
+ test.stop( true, true );
+ }
+ };
+
+ test.toggleClass("testChangeBackground", {
+ duration: 2000,
+ complete: function() {
+ present( test.css("backgroundColor"), [ "#ffffff", "#fff", "rgb(255, 255, 255)" ], "Color is final" );
+ start();
+ }
});
- setTimeout(function() {
- var color = test.css("backgroundColor");
- notPresent( color, [ "#000000", "#ffffff", "#000", "#fff", "rgb(0, 0, 0)", "rgb(255,255,255)" ],
- "Color is not endpoints in middle." );
- }, mid);
});
-asyncTest( "animateClass works with children", function() {
- var test = $("div.animateClass"),
- h2 = test.find("h2");
+asyncTest( "animateClass calls step option", 1, function() {
+ var test = jQuery("div.animateClass"),
+ done = function() {
+ done = jQuery.noop;
+ test.stop();
+ start();
+ };
+ test.toggleClass( "testChangeBackground", {
+ step: function( fx ) {
+ ok( true, "Step Function Called" );
+ setTimeout( done, 0 );
+ }
+ });
+});
- expect(4);
- setTimeout(function() {
- notPresent( h2.css("fontSize"), ["10px","20px"], "Font size is neither endpoint when in middle.");
- }, mid);
- test.toggleClass("testChildren", { children: true, duration: duration, complete: function() {
- equal( h2.css("fontSize"), "20px", "Text size is final during complete");
- test.toggleClass("testChildren", duration, function() {
- equal( h2.css("fontSize"), "10px", "Text size revertted after class removed");
+asyncTest( "animateClass works with children", 3, function() {
+ var animatedChild,
+ test = $("div.animateClass"),
+ h2 = test.find("h2");
- start();
- });
- setTimeout(function() {
- equal( h2.css("fontSize"), "20px", "Text size unchanged during animate with children: undefined" );
- }, mid);
- }});
+ test.toggleClass("testChildren", {
+ children: true,
+ duration: duration,
+ complete: function() {
+ equal( h2.css("fontSize"), "20px", "Text size is final during complete");
+ test.toggleClass("testChildren", {
+ duration: duration,
+ complete: function() {
+ equal( h2.css("fontSize"), "10px", "Text size revertted after class removed");
+
+ start();
+ },
+ step: function( val, fx ) {
+ if ( fx.elem === h2[ 0 ] ) {
+ ok( false, "Error - Animating property on h2" );
+ }
+ }
+ });
+ },
+ step: function( val, fx ) {
+ if ( fx.prop === "fontSize" && fx.elem === h2[ 0 ] && !animatedChild ) {
+ equal( fx.end, 20, "animating font size on child" );
+ animatedChild = true;
+ }
+ }
+ });
});
asyncTest( "animateClass clears style properties when stopped", function() {
View
19 ui/jquery.effects.core.js
@@ -268,16 +268,15 @@ $.effects.animateClass = function( value, duration, easing, callback ) {
// map all animated objects again - this time collecting a promise
allAnimations = allAnimations.map(function() {
var styleInfo = this,
- dfd = $.Deferred();
-
- this.el.animate( this.diff, {
- duration: o.duration,
- easing: o.easing,
- queue: false,
- complete: function() {
- dfd.resolve( styleInfo );
- }
- });
+ dfd = $.Deferred(),
+ opts = jQuery.extend({}, o, {
+ queue: false,
+ complete: function() {
+ dfd.resolve( styleInfo )
+ }
+ });
+
+ this.el.animate( this.diff, opts );
return dfd.promise();
});

0 comments on commit fe55b6c

Please sign in to comment.