mirror of
https://github.com/tuxis-ie/nsedit.git
synced 2025-06-07 00:47:00 +03:00
Merge commit 'd32092c1f0' as 'jquery-ui'
This commit is contained in:
Mark Schouten
commit
b23131fdc2
717 changed files with 518330 additions and 0 deletions
26
jquery-ui/tests/unit/effects/all.html
Normal file
26
jquery-ui/tests/unit/effects/all.html
Normal file
|
|
@ -0,0 +1,26 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>jQuery UI Effects Test Suite</title>
|
||||
|
||||
<script src="../../../external/jquery/jquery.js"></script>
|
||||
|
||||
<link rel="stylesheet" href="../../../external/qunit/qunit.css">
|
||||
<link rel="stylesheet" href="../../../external/qunit-composite/qunit-composite.css">
|
||||
<script src="../../../external/qunit/qunit.js"></script>
|
||||
<script src="../../../external/qunit-composite/qunit-composite.js"></script>
|
||||
<script src="../subsuite.js"></script>
|
||||
|
||||
<script>
|
||||
testAllVersions( "effects" );
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="qunit"></div>
|
||||
<div id="qunit-fixture">
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
386
jquery-ui/tests/unit/effects/core.js
vendored
Normal file
386
jquery-ui/tests/unit/effects/core.js
vendored
Normal file
|
|
@ -0,0 +1,386 @@
|
|||
define( [
|
||||
"qunit",
|
||||
"jquery",
|
||||
"lib/common",
|
||||
"ui/effect",
|
||||
"ui/effects/effect-blind",
|
||||
"ui/effects/effect-bounce",
|
||||
"ui/effects/effect-clip",
|
||||
"ui/effects/effect-drop",
|
||||
"ui/effects/effect-explode",
|
||||
"ui/effects/effect-fade",
|
||||
"ui/effects/effect-fold",
|
||||
"ui/effects/effect-highlight",
|
||||
"ui/effects/effect-puff",
|
||||
"ui/effects/effect-pulsate",
|
||||
"ui/effects/effect-scale",
|
||||
"ui/effects/effect-shake",
|
||||
"ui/effects/effect-size",
|
||||
"ui/effects/effect-slide",
|
||||
"ui/effects/effect-transfer"
|
||||
], function( QUnit, $, common ) {
|
||||
|
||||
QUnit.assert.present = function( value, array, message ) {
|
||||
this.push( jQuery.inArray( value, array ) !== -1, value, array, message );
|
||||
};
|
||||
|
||||
QUnit.assert.notPresent = function( value, array, message ) {
|
||||
this.push( jQuery.inArray( value, array ) === -1, value, array, message );
|
||||
};
|
||||
|
||||
// MinDuration is used for "short" animate tests where we are only concerned about the final
|
||||
var minDuration = 15,
|
||||
|
||||
// Duration is used for "long" animates where we plan on testing properties during animation
|
||||
duration = 200;
|
||||
|
||||
QUnit.module( "effects.core" );
|
||||
|
||||
// TODO: test all signatures of .show(), .hide(), .toggle().
|
||||
// Look at core's signatures and UI's signatures.
|
||||
QUnit.test( ".hide() with step", function( assert ) {
|
||||
var ready = assert.async();
|
||||
assert.expect( 1 );
|
||||
var element = $( "#elem" ),
|
||||
step = function() {
|
||||
assert.ok( true, "step callback invoked" );
|
||||
step = $.noop;
|
||||
};
|
||||
|
||||
element.hide( {
|
||||
step: function() {
|
||||
step();
|
||||
},
|
||||
complete: ready
|
||||
} );
|
||||
} );
|
||||
|
||||
QUnit.test( "Immediate Return Conditions", function( assert ) {
|
||||
var hidden = $( "div.hidden" ),
|
||||
count = 0;
|
||||
assert.expect( 3 );
|
||||
hidden.hide( "blind", function() {
|
||||
assert.equal( ++count, 1, "Hide on hidden returned immediately" );
|
||||
} ).show().show( "blind", function() {
|
||||
assert.equal( ++count, 2, "Show on shown returned immediately" );
|
||||
} );
|
||||
assert.equal( ++count, 3, "Both Functions worked properly" );
|
||||
} );
|
||||
|
||||
QUnit.test( ".hide() with hidden parent", function( assert ) {
|
||||
assert.expect( 1 );
|
||||
var element = $( "div.hidden" ).children();
|
||||
element.hide( "blind", function() {
|
||||
assert.equal( element.css( "display" ), "none", "display: none" );
|
||||
} );
|
||||
} );
|
||||
|
||||
QUnit.test( "Parse of null for options", function( assert ) {
|
||||
var ready = assert.async();
|
||||
var hidden = $( "div.hidden" ),
|
||||
count = 0;
|
||||
assert.expect( 1 );
|
||||
hidden.show( "blind", null, 1, function() {
|
||||
assert.equal( ++count, 1, "null for options still works" );
|
||||
ready();
|
||||
} );
|
||||
} );
|
||||
|
||||
QUnit.test( "removeClass", function( assert ) {
|
||||
assert.expect( 3 );
|
||||
|
||||
var element = $( "<div>" );
|
||||
assert.equal( "", element[ 0 ].className );
|
||||
element.addClass( "destroyed" );
|
||||
assert.equal( "destroyed", element[ 0 ].className );
|
||||
element.removeClass();
|
||||
assert.equal( "", element[ 0 ].className );
|
||||
} );
|
||||
|
||||
QUnit.module( "effects.core: animateClass" );
|
||||
|
||||
QUnit.test( "animateClass works with borderStyle", function( assert ) {
|
||||
var ready = assert.async();
|
||||
var test = $( "div.animateClass" );
|
||||
assert.expect( 3 );
|
||||
test.toggleClass( "testAddBorder", minDuration, function() {
|
||||
test.toggleClass( "testAddBorder", minDuration, function() {
|
||||
assert.equal( test.css( "borderLeftStyle" ), "none", "None border set" );
|
||||
ready();
|
||||
} );
|
||||
assert.equal( test.css( "borderLeftStyle" ), "solid", "None border not immedately set" );
|
||||
} );
|
||||
assert.equal( test.css( "borderLeftStyle" ), "solid", "Solid border immedately set" );
|
||||
} );
|
||||
|
||||
QUnit.test( "animateClass works with colors", function( assert ) {
|
||||
var ready = assert.async();
|
||||
var test = $( "div.animateClass" ),
|
||||
oldStep = jQuery.fx.step.backgroundColor;
|
||||
|
||||
assert.expect( 2 );
|
||||
|
||||
// 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;
|
||||
assert.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() {
|
||||
assert.present( test.css( "backgroundColor" ), [ "#ffffff", "#fff", "rgb(255, 255, 255)" ], "Color is final" );
|
||||
ready();
|
||||
}
|
||||
} );
|
||||
} );
|
||||
|
||||
QUnit.test( "animateClass calls step option", function( assert ) {
|
||||
assert.expect( 1 );
|
||||
var ready = assert.async();
|
||||
var test = jQuery( "div.animateClass" ),
|
||||
step = function() {
|
||||
assert.ok( true, "Step Function Called" );
|
||||
test.stop();
|
||||
ready();
|
||||
step = $.noop;
|
||||
};
|
||||
test.toggleClass( "testChangeBackground", {
|
||||
step: function() {
|
||||
step();
|
||||
}
|
||||
} );
|
||||
} );
|
||||
|
||||
QUnit.test( "animateClass works with children", function( assert ) {
|
||||
assert.expect( 3 );
|
||||
var ready = assert.async();
|
||||
var animatedChild,
|
||||
test = $( "div.animateClass" ),
|
||||
h2 = test.find( "h2" );
|
||||
|
||||
test.toggleClass( "testChildren", {
|
||||
children: true,
|
||||
duration: duration,
|
||||
complete: function() {
|
||||
assert.equal( h2.css( "fontSize" ), "20px", "Text size is final during complete" );
|
||||
test.toggleClass( "testChildren", {
|
||||
duration: duration,
|
||||
complete: function() {
|
||||
assert.equal( h2.css( "fontSize" ), "10px", "Text size revertted after class removed" );
|
||||
|
||||
ready();
|
||||
},
|
||||
step: function( val, fx ) {
|
||||
if ( fx.elem === h2[ 0 ] ) {
|
||||
assert.ok( false, "Error - Animating property on h2" );
|
||||
}
|
||||
}
|
||||
} );
|
||||
},
|
||||
step: function( val, fx ) {
|
||||
if ( fx.prop === "fontSize" && fx.elem === h2[ 0 ] && !animatedChild ) {
|
||||
assert.equal( fx.end, 20, "animating font size on child" );
|
||||
animatedChild = true;
|
||||
}
|
||||
}
|
||||
} );
|
||||
} );
|
||||
|
||||
QUnit.test( "animateClass clears style properties when stopped", function( assert ) {
|
||||
var ready = assert.async();
|
||||
var test = $( "div.animateClass" ),
|
||||
style = test[ 0 ].style,
|
||||
orig = style.cssText;
|
||||
|
||||
assert.expect( 2 );
|
||||
|
||||
test.addClass( "testChangeBackground", duration );
|
||||
assert.notEqual( orig, style.cssText, "cssText is not the same after starting animation" );
|
||||
|
||||
test
|
||||
.stop( true, true )
|
||||
.promise()
|
||||
.then( function() {
|
||||
assert.equal( orig, $.trim( style.cssText ), "cssText is the same after stopping animation midway" );
|
||||
ready();
|
||||
} );
|
||||
} );
|
||||
|
||||
QUnit.test( "animateClass: css and class changes during animation are not lost (#7106)",
|
||||
function( assert ) {
|
||||
var ready = assert.async();
|
||||
assert.expect( 2 );
|
||||
var test = $( "div.ticket7106" );
|
||||
|
||||
// Ensure the class stays and that the css property stays
|
||||
function animationComplete() {
|
||||
assert.hasClasses( test, "testClass", "class change during animateClass was not lost" );
|
||||
assert.equal( test.height(), 100, "css change during animateClass was not lost" );
|
||||
ready();
|
||||
}
|
||||
|
||||
// Add a class and change a style property after starting an animated class
|
||||
test.addClass( "animate", minDuration, animationComplete )
|
||||
.addClass( "testClass" )
|
||||
.height( 100 );
|
||||
} );
|
||||
|
||||
QUnit.test( "createPlaceholder: only created for static or relative elements", function( assert ) {
|
||||
assert.expect( 4 );
|
||||
|
||||
assert.ok( $.effects.createPlaceholder( $( ".relative" ) ).length, "placeholder created for relative element" );
|
||||
assert.ok( $.effects.createPlaceholder( $( ".static" ) ).length, "placeholder created for static element" );
|
||||
assert.ok( !$.effects.createPlaceholder( $( ".absolute" ) ), "placeholder not created for absolute element" );
|
||||
assert.ok( !$.effects.createPlaceholder( $( ".fixed" ) ), "placeholder not created for fixed element" );
|
||||
} );
|
||||
|
||||
QUnit.test( "createPlaceholder: preserves layout affecting properties", function( assert ) {
|
||||
assert.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.
|
||||
assert.deepEqual( before.offset.top - position, placeholder.offset().top, "offset top preserved" );
|
||||
assert.deepEqual( before.offset.left - position, placeholder.offset().left, "offset left preserved" );
|
||||
assert.deepEqual( before.position.top - position, placeholder.position().top, "position top preserved" );
|
||||
assert.deepEqual( before.position.left - position, placeholder.position().left, "position left preserved" );
|
||||
|
||||
assert.deepEqual( before[ "float" ], placeholder.css( "float" ), "float preserved" );
|
||||
assert.deepEqual( before.outerWidth, placeholder.outerWidth( true ), "width preserved" );
|
||||
assert.deepEqual( before.outerHeight, placeholder.outerHeight( true ), "height preserved" );
|
||||
} );
|
||||
|
||||
QUnit.module( "transfer" );
|
||||
|
||||
QUnit.test( "transfer() without callback", function( assert ) {
|
||||
var ready = assert.async();
|
||||
assert.expect( 0 );
|
||||
|
||||
// Verify that the effect works without a callback
|
||||
$( "#elem" ).transfer( {
|
||||
to: ".animateClass",
|
||||
duration: 1
|
||||
} );
|
||||
setTimeout( function() {
|
||||
ready();
|
||||
}, 25 );
|
||||
} );
|
||||
|
||||
QUnit.test( "transfer() with callback", function( assert ) {
|
||||
var ready = assert.async();
|
||||
assert.expect( 1 );
|
||||
$( "#elem" ).transfer( {
|
||||
to: ".animateClass",
|
||||
duration: 1
|
||||
}, function() {
|
||||
assert.ok( true, "callback invoked" );
|
||||
ready();
|
||||
} );
|
||||
} );
|
||||
|
||||
$.each( $.effects.effect, function( effect ) {
|
||||
QUnit.module( "effects." + effect );
|
||||
|
||||
common.testJshint( "effects/effect-" + effect );
|
||||
|
||||
if ( effect === "transfer" ) {
|
||||
return;
|
||||
}
|
||||
QUnit.test( "show/hide", function( assert ) {
|
||||
var ready = assert.async();
|
||||
assert.expect( 12 );
|
||||
var hidden = $( "div.hidden" ),
|
||||
count = 0,
|
||||
test = 0;
|
||||
|
||||
function queueTest( fn ) {
|
||||
count++;
|
||||
var point = count;
|
||||
return function( next ) {
|
||||
test++;
|
||||
assert.equal( point, test, "Queue function fired in order" );
|
||||
if ( fn ) {
|
||||
fn();
|
||||
} else {
|
||||
setTimeout( next, minDuration );
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function duringTest( fn ) {
|
||||
return function( next ) {
|
||||
setTimeout( fn );
|
||||
next();
|
||||
};
|
||||
}
|
||||
|
||||
hidden
|
||||
.queue( queueTest() )
|
||||
.queue( duringTest( function() {
|
||||
assert.ok( hidden.is( ":animated" ),
|
||||
"Hidden is seen as animated during .show(\"" + effect + "\", time)" );
|
||||
} ) )
|
||||
.show( effect, minDuration, queueTest( function() {
|
||||
assert.equal( hidden.css( "display" ), "block",
|
||||
"Hidden is shown after .show(\"" + effect + "\", time)" );
|
||||
assert.ok( !$( ".ui-effects-placeholder" ).length,
|
||||
"No placeholder remains after .show(\"" + effect + "\", time)" );
|
||||
} ) )
|
||||
.queue( queueTest() )
|
||||
.queue( duringTest( function() {
|
||||
assert.ok( hidden.is( ":animated" ),
|
||||
"Hidden is seen as animated during .hide(\"" + effect + "\", time)" );
|
||||
} ) )
|
||||
.hide( effect, minDuration, queueTest( function() {
|
||||
assert.equal( hidden.css( "display" ), "none",
|
||||
"Back to hidden after .hide(\"" + effect + "\", time)" );
|
||||
assert.ok( !$( ".ui-effects-placeholder" ).length,
|
||||
"No placeholder remains after .hide(\"" + effect + "\", time)" );
|
||||
} ) )
|
||||
.queue( queueTest( function() {
|
||||
assert.deepEqual( hidden.queue(), [ "inprogress" ], "Only the inprogress sentinel remains" );
|
||||
ready();
|
||||
} ) );
|
||||
} );
|
||||
|
||||
QUnit.test( "relative width & height - properties are preserved", function( assert ) {
|
||||
var ready = assert.async();
|
||||
var test = $( "div.relWidth.relHeight" ),
|
||||
width = test.width(), height = test.height(),
|
||||
cssWidth = test[ 0 ].style.width, cssHeight = test[ 0 ].style.height;
|
||||
|
||||
assert.expect( 4 );
|
||||
test.toggle( effect, minDuration, function() {
|
||||
assert.equal( test[ 0 ].style.width, cssWidth, "Inline CSS Width has been reset after animation ended" );
|
||||
assert.equal( test[ 0 ].style.height, cssHeight, "Inline CSS Height has been rest after animation ended" );
|
||||
ready();
|
||||
} );
|
||||
assert.equal( test.width(), width, "Width is the same px after animation started" );
|
||||
assert.equal( test.height(), height, "Height is the same px after animation started" );
|
||||
} );
|
||||
} );
|
||||
|
||||
} );
|
||||
106
jquery-ui/tests/unit/effects/effects.html
Normal file
106
jquery-ui/tests/unit/effects/effects.html
Normal file
|
|
@ -0,0 +1,106 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>jQuery UI Effects Test Suite</title>
|
||||
|
||||
<script src="../../../external/requirejs/require.js"></script>
|
||||
<script src="../../lib/css.js"></script>
|
||||
<script src="../../lib/bootstrap.js" data-modules="core scale">
|
||||
</script>
|
||||
<style>
|
||||
#qunit-fixture {
|
||||
width: 1000px;
|
||||
height: 1000px;
|
||||
}
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
.test {
|
||||
background: #000;
|
||||
border: 0;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
.testAddBorder {
|
||||
border: 10px solid #000;
|
||||
}
|
||||
.testChildren,
|
||||
.testChangeBackground {
|
||||
background: #fff;
|
||||
}
|
||||
.test h2 {
|
||||
font-size: 10px;
|
||||
}
|
||||
.testChildren h2 {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.relWidth {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.relHeight {
|
||||
height: 50%;
|
||||
}
|
||||
|
||||
.testScale {
|
||||
border: 5px solid #000;
|
||||
padding: 5px;
|
||||
margin: 5px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.ticket7106 {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
.ticket7106.animate {
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.relative {
|
||||
position: relative;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
.absolute {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
.fixed {
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
.static {
|
||||
position: static;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="qunit"></div>
|
||||
<div id="qunit-fixture">
|
||||
<div id="elem" class="test"></div>
|
||||
<div class="hidden test">
|
||||
<div>.</div>
|
||||
</div>
|
||||
<div class="animateClass test">
|
||||
<h2>Child Element Test</h2>
|
||||
</div>
|
||||
<div class="relWidth relHeight testAddBorder">
|
||||
<h2>Slide with relative width</h2>
|
||||
</div>
|
||||
<div class="testScale"></div>
|
||||
<div class="ticket7106"></div>
|
||||
<div class="relative"></div>
|
||||
<div class="absolute"></div>
|
||||
<div class="fixed"></div>
|
||||
<div class="static"></div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
74
jquery-ui/tests/unit/effects/scale.js
vendored
Normal file
74
jquery-ui/tests/unit/effects/scale.js
vendored
Normal file
|
|
@ -0,0 +1,74 @@
|
|||
define( [
|
||||
"qunit",
|
||||
"jquery",
|
||||
"ui/effects/effect-scale"
|
||||
], function( QUnit, $ ) {
|
||||
|
||||
QUnit.module( "effect.scale: Scale" );
|
||||
|
||||
function run( position, v, h, vo, ho ) {
|
||||
var desc = "End Position Correct: " + position + " (" + v + "," + h + ") - origin: (" + vo + "," + ho + ")";
|
||||
QUnit.test( desc, function( assert ) {
|
||||
var ready = assert.async();
|
||||
assert.expect( 2 );
|
||||
function complete() {
|
||||
assert.close( parseInt( test.css( h ), 10 ), target[ h ], 1, "Horizontal Position Correct " + desc );
|
||||
assert.close( parseInt( test.css( v ), 10 ), target[ v ], 1, "Vertical Position Correct " + desc );
|
||||
ready();
|
||||
}
|
||||
var test = $( ".testScale" ),
|
||||
css = {
|
||||
position: position
|
||||
},
|
||||
effect = {
|
||||
effect: "scale",
|
||||
mode: "effect",
|
||||
percent: 200,
|
||||
origin: [ vo, ho ],
|
||||
complete: complete,
|
||||
duration: 1
|
||||
},
|
||||
target = {},
|
||||
relative = position === "relative";
|
||||
|
||||
css[ h ] = 33;
|
||||
css[ v ] = 33;
|
||||
target[ h ] = h === ho ? css[ h ] : ho === "center" ? css[ h ] - 35 : css[ h ] - 70;
|
||||
target[ v ] = v === vo ? css[ v ] : vo === "middle" ? css[ v ] - 35 : css[ v ] - 70;
|
||||
if ( relative && h === "right" ) {
|
||||
target[ h ] += 70;
|
||||
}
|
||||
if ( relative && v === "bottom" ) {
|
||||
target[ v ] += 70;
|
||||
}
|
||||
test.css( css );
|
||||
test.effect( effect );
|
||||
} );
|
||||
}
|
||||
|
||||
function suite( position ) {
|
||||
run( position, "top", "left", "top", "left" );
|
||||
run( position, "top", "left", "middle", "center" );
|
||||
run( position, "top", "left", "bottom", "right" );
|
||||
/* Firefox is currently not capable of supporting detection of bottom and right....
|
||||
run( position, "bottom", "right", "top", "left" );
|
||||
run( position, "bottom", "right", "middle", "center" );
|
||||
run( position, "bottom", "right", "bottom", "right" );
|
||||
*/
|
||||
}
|
||||
|
||||
$( function() {
|
||||
suite( "absolute" );
|
||||
suite( "relative" );
|
||||
var fixedElem = $( "<div>" )
|
||||
.css( {
|
||||
position: "fixed",
|
||||
top: 10
|
||||
} )
|
||||
.appendTo( "body" );
|
||||
if ( fixedElem.offset().top === 10 ) {
|
||||
suite( "fixed" );
|
||||
}
|
||||
} );
|
||||
|
||||
} );
|
||||
Loading…
Add table
Add a link
Reference in a new issue