aboutsummaryrefslogtreecommitdiffstats
path: root/test
diff options
context:
space:
mode:
authorDavid Serduke <davidserduke@gmail.com>2007-11-30 21:36:49 +0000
committerDavid Serduke <davidserduke@gmail.com>2007-11-30 21:36:49 +0000
commit5039a4bc5b951b9d28659f6f42f73c59e2e560fc (patch)
tree3ff4a38cfe5ffae14bd345d8b3eeb9dc6d13ccea /test
parent37902e86b158eaa90f44d0932063d22df3050326 (diff)
downloadjquery-5039a4bc5b951b9d28659f6f42f73c59e2e560fc.tar.gz
jquery-5039a4bc5b951b9d28659f6f42f73c59e2e560fc.zip
Added enchancement for #1994 by adding two parameters to .stop() which give additional functionality. The first parameter clearQueue will clear the queue on the necessary DOM elements so all animation will stop. The second parameter will cause the currently playing animation to immediately complete including reseting original styles on show and hide and calling the callback function. If no parameters are passed it will work as it always did.
While adding unit testing I noticed the stop() unit test wasn't working correctly because the element was hidden so I fixed it and added more unit tests around the new functionality. I also added a cursor:pointer to the css (because for a long time I didn't know they were clickable).
Diffstat (limited to 'test')
-rw-r--r--test/data/testsuite.css2
-rw-r--r--test/unit/fx.js106
2 files changed, 95 insertions, 13 deletions
diff --git a/test/data/testsuite.css b/test/data/testsuite.css
index b9d487bc4..b15f5ef7f 100644
--- a/test/data/testsuite.css
+++ b/test/data/testsuite.css
@@ -11,6 +11,8 @@ p.result { margin-left: 1em; }
h2.pass { background-color: green; }
h2.fail { background-color: red; }
+ol#tests > li > strong { cursor:pointer; }
+
div#fx-tests h4 {
background: red;
}
diff --git a/test/unit/fx.js b/test/unit/fx.js
index c20e39ceb..1204e261c 100644
--- a/test/unit/fx.js
+++ b/test/unit/fx.js
@@ -54,21 +54,101 @@ test("queue() defaults to 'fx' type", function () {
test("stop()", function() {
expect(3);
stop();
- reset();
- var foo = $("#foo")[0];
- var h = foo.style.height;
+ var $foo = $("#nothiddendiv");
+ var w = 0;
+ $foo.hide().width(200).width();
- $("#foo").slideUp(1000);
+ $foo.animate({ width:'show' }, 1000);
setTimeout(function(){
- var nh = foo.style.height;
- ok( nh != h, "An animation occurred " + nh + " " + h );
- $("#foo").stop();
+ var nw = $foo.width();
+ ok( nw != w, "An animation occurred " + nw + "px " + w + "px");
+ $foo.stop();
- nh = foo.style.height;
- ok( nh != h, "Stop didn't reset the animation " + nh + " " + h );
+ nw = $foo.width();
+ ok( nw != w, "Stop didn't reset the animation " + nw + "px " + w + "px");
setTimeout(function(){
- equals( nh, foo.style.height, "The animation didn't continue" );
+ equals( nw, $foo.width(), "The animation didn't continue" );
+ start();
+ }, 100);
+ }, 100);
+});
+
+test("stop() - several in queue", function() {
+ expect(4);
+ stop();
+
+ var $foo = $("#nothiddendiv");
+ var w = 0;
+ $foo.hide().width(200).width();
+
+ $foo.animate({ width:'show' }, 1000);
+ $foo.animate({ width:'hide' }, 1000);
+ $foo.animate({ width:'show' }, 1000);
+ setTimeout(function(){
+ equals( $foo.queue().length, 3, "All 3 still in the queue" );
+ var nw = $foo.width();
+ ok( nw != w, "An animation occurred " + nw + "px " + w + "px");
+ $foo.stop();
+
+ nw = $foo.width();
+ ok( nw != w, "Stop didn't reset the animation " + nw + "px " + w + "px");
+ equals( $foo.queue().length, 2, "The next animation continued" );
+ $foo.stop(true);
+ start();
+ }, 100);
+});
+
+test("stop(clearQueue)", function() {
+ expect(4);
+ stop();
+
+ var $foo = $("#nothiddendiv");
+ var w = 0;
+ $foo.hide().width(200).width();
+
+ $foo.animate({ width:'show' }, 1000);
+ $foo.animate({ width:'hide' }, 1000);
+ $foo.animate({ width:'show' }, 1000);
+ setTimeout(function(){
+ var nw = $foo.width();
+ ok( nw != w, "An animation occurred " + nw + "px " + w + "px");
+ $foo.stop(true);
+
+ nw = $foo.width();
+ ok( nw != w, "Stop didn't reset the animation " + nw + "px " + w + "px");
+
+ equals( $foo.queue().length, 0, "The animation queue was cleared" );
+ setTimeout(function(){
+ equals( nw, $foo.width(), "The animation didn't continue" );
+ start();
+ }, 100);
+ }, 100);
+});
+
+test("stop(clearQueue, gotoEnd)", function() {
+ expect(3);
+ stop();
+
+ var $foo = $("#nothiddendiv");
+ var w = 0;
+ $foo.hide().width(200).width();
+
+ $foo.animate({ width:'show' }, 1000);
+ $foo.animate({ width:'hide' }, 1000);
+ $foo.animate({ width:'show' }, 1000);
+ $foo.animate({ width:'hide' }, 1000);
+ setTimeout(function(){
+ var nw = $foo.width();
+ ok( nw != w, "An animation occurred " + nw + "px " + w + "px");
+ $foo.stop(false, true);
+
+ nw = $foo.width();
+ equals( nw, 200, "Stop() reset the animation" );
+
+ setTimeout(function(){
+ equals( $foo.queue().length, 3, "The next animation continued" );
+ $foo.stop(true);
start();
}, 100);
}, 100);
@@ -77,11 +157,11 @@ test("stop()", function() {
test("toggle()", function() {
expect(3);
var x = $("#foo");
- ok( x.is(":visible") );
+ ok( x.is(":visible"), "is visible" );
x.toggle();
- ok( x.is(":hidden") );
+ ok( x.is(":hidden"), "is hidden" );
x.toggle();
- ok( x.is(":visible") );
+ ok( x.is(":visible"), "is visible again" );
});
var visible = {