library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2024-11-21 11:04:24 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Unit Tests: effects: adding some animateClass tests

Browse Source
This commit is contained in:
gnarf 2011-05-12 10:22:49 -05:00
parent 783f134aaa
commit e4204b129d
2 changed files with 63 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
tests/unit/effects/effects.html
View File

@ -35,6 +35,22 @@
.hidden { .hidden {
display: none; display: none;
} }
.test {
background: #000;
border: 0;
}
.testAddBorder {
border: 10px solid #000;
}
.testChangeBackground {
background: #fff;
}
.test h2 {
font-size: 10px;
}
.testChildren h2 {
font-size: 20px;
}
</style> </style>
</head> </head>
<body> <body>
@ -48,7 +64,9 @@
<div id="qunit-fixture"> <div id="qunit-fixture">
<div class="hidden test"></div> <div class="hidden test"></div>
<div class="shown test"></div> <div class="animateClass test">
<h2>Child Element Test</h2>
</div>
</div> </div>
</body> </body>

51
tests/unit/effects/effects_core.js
View File

@ -1,5 +1,13 @@
(function($) { (function($) {
function present( value, array, message ) {
QUnit.push( jQuery.inArray( value, array ) !== -1 , value, array, message );
}
function notPresent( value, array, message ) {
QUnit.push( jQuery.inArray( value, array ) === -1 , value, array, message );
}
var animateTime = 15; var animateTime = 15;
module( "effects.core" ); module( "effects.core" );
@ -8,12 +16,10 @@ $.each( $.effects.effect, function( effect ) {
if ( effect === "transfer" ) { if ( effect === "transfer" ) {
return; return;
} }
QUnit.reset();
module( "effect."+effect ); module( "effect."+effect );
test( "show/hide", function() { asyncTest( "show/hide", function() {
var hidden = $( "div.hidden" ); var hidden = $( "div.hidden" );
expect( 8 ); expect( 8 );
stop();
var count = 0, var count = 0,
test = 0; test = 0;
@ -23,13 +29,13 @@ $.each( $.effects.effect, function( effect ) {
var point = count; var point = count;
return function( next ) { return function( next ) {
test++; test++;
equals( point, test, "Queue function fired in order" ); equal( point, test, "Queue function fired in order" );
if ( fn ) { if ( fn ) {
fn () fn ();
} else { } else {
setTimeout( next, animateTime ); setTimeout( next, animateTime );
} }
} };
} }
hidden.queue( queueTest() ).show( effect, animateTime, queueTest(function() { hidden.queue( queueTest() ).show( effect, animateTime, queueTest(function() {
@ -37,10 +43,41 @@ $.each( $.effects.effect, function( effect ) {
})).queue( queueTest() ).hide( effect, animateTime, queueTest(function() { })).queue( queueTest() ).hide( effect, animateTime, queueTest(function() {
equal( hidden.css("display"), "none", "Back to hidden after .hide(\"" +effect+ "\", time)" ); equal( hidden.css("display"), "none", "Back to hidden after .hide(\"" +effect+ "\", time)" );
})).queue( queueTest(function(next) { })).queue( queueTest(function(next) {
deepEqual( hidden.queue(), ["inprogress"], "Only the inprogress sentinel remains") deepEqual( hidden.queue(), ["inprogress"], "Only the inprogress sentinel remains");
start(); start();
})); }));
}); });
}); });
module("animateClass");
asyncTest( "animateClass works with borderStyle", function() {
var test = $("div.animateClass"),
count = 0;
expect(3);
test.toggleClass("testAddBorder", 20, function() {
test.toggleClass("testAddBorder", 20, function() {
equal( test.css("borderLeftStyle"), "none", "None border set" );
start();
});
equal( test.css("borderLeftStyle"), "solid", "None border not immedately set" );
});
equal( test.css("borderLeftStyle"), "solid", "Solid border immedately set" );
});
asyncTest( "animateClass works with colors", function() {
var test = $("div.animateClass"),
count = 0;
expect(2);
test.toggleClass("testChangeBackground", 100, function() {
present( test.css("backgroundColor"), [ "#ffffff", "rgb(255, 255, 255)" ], "Color is final" );
start();
});
setTimeout(function() {
var color = test.css("backgroundColor");
notPresent( color, [ "#000000", "#ffffff", "rgb(0, 0, 0)", "rgb(255,255,255)" ],
"Color is not endpoints in middle." );
}, 50);
});
})(jQuery); })(jQuery);