diff options
Diffstat (limited to 'tests/unit/effects/effects_core.js')
-rw-r--r-- | tests/unit/effects/effects_core.js | 100 |
1 files changed, 75 insertions, 25 deletions
diff --git a/tests/unit/effects/effects_core.js b/tests/unit/effects/effects_core.js index 05db494e6..0c4e5574f 100644 --- a/tests/unit/effects/effects_core.js +++ b/tests/unit/effects/effects_core.js @@ -1,11 +1,11 @@ (function($) { function present( value, array, message ) { - QUnit.push( jQuery.inArray( value, array ) !== -1 , 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 ); + QUnit.push( jQuery.inArray( value, array ) === -1, value, array, message ); } // minDuration is used for "short" animate tests where we are only concerned about the final @@ -75,20 +75,6 @@ test( "removeClass", function() { equal( "", element[ 0 ].className ); }); - -/* TODO: Disabled - Can't figure out why this is failing in IE 6/7 -test( "createWrapper and removeWrapper retain focused elements (#7595)", function() { - expect( 2 ); - var test = $( "div.hidden" ).show(), - input = $( "<input type='text'>" ).appendTo( test ).focus(); - - $.effects.createWrapper( test ); - equal( document.activeElement, input[ 0 ], "Active element is still input after createWrapper" ); - $.effects.removeWrapper( test ); - equal( document.activeElement, input[ 0 ], "Active element is still input after removeWrapper" ); -}); -*/ - module( "effects.core: animateClass" ); asyncTest( "animateClass works with borderStyle", function() { @@ -213,6 +199,44 @@ asyncTest( "animateClass: css and class changes during animation are not lost (# .height( 100 ); }); +test( "createPlaceholder: only created for static or relative elements", function() { + expect( 4 ); + + ok( $.effects.createPlaceholder( $( ".relative" ) ).length, "placeholder created for relative element" ); + ok( $.effects.createPlaceholder( $( ".static" ) ).length, "placeholder created for static element" ); + ok( !$.effects.createPlaceholder( $( ".absolute" ) ), "placeholder not created for absolute element" ); + ok( !$.effects.createPlaceholder( $( ".fixed" ) ), "placeholder not created for fixed element" ); +}); + +test( "createPlaceholder: preserves layout affecting properties", function() { + expect( 7 ); + + var position = 5, + element = $( ".relative" ).css({ + top: position, + left: position + }), + before = { + offset: element.offset(), + outerWidth: element.outerWidth( true ), + outerHeight: element.outerHeight( true ), + "float": element.css( "float" ), + position: element.position() + }, + placeholder = $.effects.createPlaceholder( element ); + + // Placeholders are only placed to preserve the effect on layout. Considering + // top and left do not change layout, they are not preserved, which makes some + // of the math simpler in the implementation. + deepEqual( before.offset.top - position, placeholder.offset().top, "offset top preserved" ); + deepEqual( before.offset.left - position, placeholder.offset().left, "offset left preserved" ); + deepEqual( before.position.top - position, placeholder.position().top, "position top preserved" ); + deepEqual( before.position.left - position, placeholder.position().left, "position left preserved" ); + + deepEqual( before[ "float" ], placeholder.css( "float" ), "float preserved" ); + deepEqual( before.outerWidth, placeholder.outerWidth( true ), "width preserved" ); + deepEqual( before.outerHeight, placeholder.outerHeight( true ), "height preserved" ); +}); $.each( $.effects.effect, function( effect ) { module( "effects." + effect ); @@ -223,7 +247,7 @@ $.each( $.effects.effect, function( effect ) { return; } asyncTest( "show/hide", function() { - expect( 8 ); + expect( 12 ); var hidden = $( "div.hidden" ), count = 0, test = 0; @@ -242,14 +266,40 @@ $.each( $.effects.effect, function( effect ) { }; } - hidden.queue( queueTest() ).show( effect, minDuration, queueTest(function() { - equal( hidden.css("display"), "block", "Hidden is shown after .show(\"" +effect+ "\", time)" ); - })).queue( queueTest() ).hide( effect, minDuration, queueTest(function() { - equal( hidden.css("display"), "none", "Back to hidden after .hide(\"" +effect+ "\", time)" ); - })).queue( queueTest(function() { - deepEqual( hidden.queue(), ["inprogress"], "Only the inprogress sentinel remains"); - start(); - })); + function duringTest( fn ) { + return function( next ) { + setTimeout( fn ); + next(); + }; + } + + hidden + .queue( queueTest() ) + .queue( duringTest(function() { + ok( hidden.is( ":animated" ), + "Hidden is seen as animated during .show(\"" + effect + "\", time)" ); + }) ) + .show( effect, minDuration, queueTest(function() { + equal( hidden.css( "display" ), "block", + "Hidden is shown after .show(\"" + effect + "\", time)" ); + ok( !$( ".ui-effects-placeholder" ).length, + "No placeholder remains after .show(\"" + effect + "\", time)" ); + }) ) + .queue( queueTest() ) + .queue( duringTest(function() { + ok( hidden.is( ":animated" ), + "Hidden is seen as animated during .hide(\"" + effect + "\", time)" ); + }) ) + .hide( effect, minDuration, queueTest(function() { + equal( hidden.css( "display" ), "none", + "Back to hidden after .hide(\"" + effect + "\", time)" ); + ok( !$( ".ui-effects-placeholder" ).length, + "No placeholder remains after .hide(\"" + effect + "\", time)" ); + }) ) + .queue( queueTest(function() { + deepEqual( hidden.queue(), [ "inprogress" ], "Only the inprogress sentinel remains" ); + start(); + }) ); }); asyncTest( "relative width & height - properties are preserved", function() { |