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

Draggable Tests: consolidate drag tests and provide error messages for all assertions.

Browse Source
This commit is contained in:
Mike Sherov 2013-10-20 09:35:12 -04:00
parent 0144b270c8
commit c9b0e28d8d
3 changed files with 64 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
tests/unit/draggable/draggable_core.js
View File

@ -44,12 +44,12 @@ test( "element types", function() {
test( "No options, relative", function() { test( "No options, relative", function() {
expect( 1 ); expect( 1 );
TestHelpers.draggable.shouldMove( $( "#draggable1" ).draggable() ); TestHelpers.draggable.shouldMove( $( "#draggable1" ).draggable(), "no options, relative" );
}); });
test( "No options, absolute", function() { test( "No options, absolute", function() {
expect( 1 ); expect( 1 );
TestHelpers.draggable.shouldMove( $( "#draggable2" ).draggable() ); TestHelpers.draggable.shouldMove( $( "#draggable2" ).draggable(), "no options, absolute" );
}); });
test( "resizable handle with complex markup (#8756 / #8757)", function() { test( "resizable handle with complex markup (#8756 / #8757)", function() {
@ -199,7 +199,7 @@ test( "#5727: draggable from iframe" , function() {
equal( draggable1.closest( iframeBody ).length, 1 ); equal( draggable1.closest( iframeBody ).length, 1 );
TestHelpers.draggable.shouldMove( draggable1 ); TestHelpers.draggable.shouldMove( draggable1, "draggable from an iframe" );
}); });
test( "#8399: A draggable should become the active element after you are finished interacting with it, but not before.", function() { test( "#8399: A draggable should become the active element after you are finished interacting with it, but not before.", function() {

113
tests/unit/draggable/draggable_options.js
View File

@ -6,10 +6,10 @@ module( "draggable: options" );
test( "{ appendTo: 'parent' }, default, no clone", function() { test( "{ appendTo: 'parent' }, default, no clone", function() {
expect( 2 ); expect( 2 );
var element = $( "#draggable2" ).draggable({ appendTo: "parent" }); var element = $( "#draggable2" ).draggable({ appendTo: "parent" });
TestHelpers.draggable.shouldMove( element ); TestHelpers.draggable.shouldMove( element, "absolute appendTo: parent" );
element = $( "#draggable1" ).draggable({ appendTo: "parent" }); element = $( "#draggable1" ).draggable({ appendTo: "parent" });
TestHelpers.draggable.shouldMove( element ); TestHelpers.draggable.shouldMove( element, "relative appendTo: parent" );
}); });
// TODO: This doesn't actually test whether append happened, possibly remove // TODO: This doesn't actually test whether append happened, possibly remove
@ -17,20 +17,20 @@ test( "{ appendTo: Element }, no clone", function() {
expect( 2 ); expect( 2 );
var element = $( "#draggable2" ).draggable({ appendTo: $( "#draggable2" ).parent()[ 0 ] }); var element = $( "#draggable2" ).draggable({ appendTo: $( "#draggable2" ).parent()[ 0 ] });
TestHelpers.draggable.shouldMove( element ); TestHelpers.draggable.shouldMove( element, "absolute appendTo: Element" );
element = $( "#draggable1" ).draggable({ appendTo: $( "#draggable2" ).parent()[ 0 ] }); element = $( "#draggable1" ).draggable({ appendTo: $( "#draggable2" ).parent()[ 0 ] });
TestHelpers.draggable.shouldMove( element ); TestHelpers.draggable.shouldMove( element, "relative appendTo: Element" );
}); });
// TODO: This doesn't actually test whether append happened, possibly remove // TODO: This doesn't actually test whether append happened, possibly remove
test( "{ appendTo: Selector }, no clone", function() { test( "{ appendTo: Selector }, no clone", function() {
expect( 2 ); expect( 2 );
var element = $( "#draggable2" ).draggable({ appendTo: "#main" }); var element = $( "#draggable2" ).draggable({ appendTo: "#main" });
TestHelpers.draggable.shouldMove( element ); TestHelpers.draggable.shouldMove( element, "absolute appendTo: Selector" );
element = $( "#draggable1" ).draggable({ appendTo: "#main" }); element = $( "#draggable1" ).draggable({ appendTo: "#main" });
TestHelpers.draggable.shouldMove( element ); TestHelpers.draggable.shouldMove( element, "relative appendTo: Selector" );
}); });
test( "{ appendTo: 'parent' }, default", function() { test( "{ appendTo: 'parent' }, default", function() {
@ -102,19 +102,19 @@ test( "appendTo, default, switching after initialization", function() {
test( "{ axis: false }, default", function() { test( "{ axis: false }, default", function() {
expect( 1 ); expect( 1 );
var element = $( "#draggable2" ).draggable({ axis: false }); var element = $( "#draggable2" ).draggable({ axis: false });
TestHelpers.draggable.shouldMove( element ); TestHelpers.draggable.shouldMove( element, "axis: false" );
}); });
test( "{ axis: 'x' }", function() { test( "{ axis: 'x' }", function() {
expect( 1 ); expect( 1 );
var element = $( "#draggable2" ).draggable({ axis: "x" }); var element = $( "#draggable2" ).draggable({ axis: "x" });
TestHelpers.draggable.testDrag( element, element, 50, 50, 50, 0 ); TestHelpers.draggable.testDrag( element, element, 50, 50, 50, 0, "axis: x" );
}); });
test( "{ axis: 'y' }", function() { test( "{ axis: 'y' }", function() {
expect( 1 ); expect( 1 );
var element = $( "#draggable2" ).draggable({ axis: "y" }); var element = $( "#draggable2" ).draggable({ axis: "y" });
TestHelpers.draggable.testDrag( element, element, 50, 50, 0, 50 ); TestHelpers.draggable.testDrag( element, element, 50, 50, 0, 50, "axis: y" );
}); });
test( "{ axis: ? }, unexpected", function() { test( "{ axis: ? }, unexpected", function() {
@ -132,7 +132,7 @@ test( "{ axis: ? }, unexpected", function() {
$.each(unexpected, function(key, val) { $.each(unexpected, function(key, val) {
element = $( "#draggable2" ).draggable({ axis: val }); element = $( "#draggable2" ).draggable({ axis: val });
TestHelpers.draggable.testDrag( element, element, 50, 50, 50, 50, "axis: " + key ); TestHelpers.draggable.shouldMove( element, "axis: " + key );
element.draggable( "destroy" ); element.draggable( "destroy" );
}); });
}); });
@ -143,15 +143,15 @@ test( "axis, default, switching after initialization", function() {
var element = $( "#draggable1" ).draggable({ axis : false }); var element = $( "#draggable1" ).draggable({ axis : false });
// Any Direction // Any Direction
TestHelpers.draggable.testDrag( element, element, 50, 50, 50, 50 ); TestHelpers.draggable.shouldMove( element, "axis: default" );
// Only horizontal // Only horizontal
element.draggable( "option", "axis", "x" ); element.draggable( "option", "axis", "x" );
TestHelpers.draggable.testDrag( element, element, 50, 50, 50, 0 ); TestHelpers.draggable.testDrag( element, element, 50, 50, 50, 0, "axis: x as option" );
// Vertical only // Vertical only
element.draggable( "option", "axis", "y" ); element.draggable( "option", "axis", "y" );
TestHelpers.draggable.testDrag( element, element, 50, 50, 0, 50 ); TestHelpers.draggable.testDrag( element, element, 50, 50, 0, 50, "axis: y as option" );
}); });
@ -161,12 +161,12 @@ test( "{ cancel: 'input,textarea,button,select,option' }, default", function() {
$( "<div id='draggable-option-cancel-default'><input type='text'></div>" ).appendTo( "#main" ); $( "<div id='draggable-option-cancel-default'><input type='text'></div>" ).appendTo( "#main" );
var element = $( "#draggable-option-cancel-default" ).draggable({ cancel: "input,textarea,button,select,option" }); var element = $( "#draggable-option-cancel-default" ).draggable({ cancel: "input,textarea,button,select,option" });
TestHelpers.draggable.shouldMove( element ); TestHelpers.draggable.shouldMove( element, "cancel: default, element dragged" );
element.draggable( "destroy" ); element.draggable( "destroy" );
element = $( "#draggable-option-cancel-default" ).draggable({ cancel: "input,textarea,button,select,option" }); element = $( "#draggable-option-cancel-default" ).draggable({ cancel: "input,textarea,button,select,option" });
TestHelpers.draggable.testDrag( element, "#draggable-option-cancel-default input", 50, 50, 0, 0 ); TestHelpers.draggable.shouldNotMove( element, "cancel: default, input dragged", "#draggable-option-cancel-default input" );
element.draggable( "destroy" ); element.draggable( "destroy" );
}); });
@ -174,12 +174,12 @@ test( "{ cancel: 'span' }", function() {
expect( 2 ); expect( 2 );
var element = $( "#draggable2" ).draggable(); var element = $( "#draggable2" ).draggable();
TestHelpers.draggable.testDrag( element, "#draggable2 span", 50, 50, 50, 50 ); TestHelpers.draggable.shouldMove( element, "cancel: default, span dragged", "#draggable2 span" );
element.draggable( "destroy" ); element.draggable( "destroy" );
element = $( "#draggable2" ).draggable({ cancel: "span" }); element = $( "#draggable2" ).draggable({ cancel: "span" });
TestHelpers.draggable.testDrag( element, "#draggable2 span", 50, 50, 0, 0 ); TestHelpers.draggable.shouldNotMove( element, "cancel: span, span dragged","#draggable2 span" );
}); });
test( "{ cancel: ? }, unexpected", function() { test( "{ cancel: ? }, unexpected", function() {
@ -202,7 +202,7 @@ test( "{ cancel: ? }, unexpected", function() {
}); });
}); });
/** /*
test( "{ cancel: Selectors }, matching parent selector", function() { test( "{ cancel: Selectors }, matching parent selector", function() {
expect( 5 ); expect( 5 );
@ -215,17 +215,15 @@ test( "{ cancel: Selectors }, matching parent selector", function() {
$( "#wrapping a" ).append( element ); $( "#wrapping a" ).append( element );
TestHelpers.draggable.testDrag( element, "#draggable2 span", 50, 50, 50, 50, "drag span child" ); TestHelpers.draggable.shouldMove( element, "drag span child", "#draggable2 span" );
TestHelpers.draggable.shouldNotMove( $( "#draggable2 span a" ) ); TestHelpers.draggable.shouldNotMove( $( "#draggable2 span a" ), "drag span a" );
TestHelpers.draggable.shouldNotMove( $( "#wrapping a" ) ); TestHelpers.draggable.shouldNotMove( $( "#wrapping a" ), "drag wrapping a" );
$( "#draggable2" ).draggable( "option", "cancel", "span > a" ); $( "#draggable2" ).draggable( "option", "cancel", "span > a" );
$( "#draggable2" ).find( "a" ).append( "<a>" ); $( "#draggable2" ).find( "a" ).append( "<a>" );
TestHelpers.draggable.shouldMove( element, "drag span child", $( "#draggable2 span a" ).last() );
TestHelpers.draggable.testDrag( element, $( "#draggable2 span a" ).last(), 50, 50, 50, 50, "drag span child" ); TestHelpers.draggable.shouldNotMove( $( "#draggable2 span a" ).first(), "drag span a first child" );
TestHelpers.draggable.shouldNotMove( $( "#draggable2 span a" ).first() );
}); });
*/ */
@ -237,17 +235,16 @@ test( "cancelement, default, switching after initialization", function() {
var input = $( "#draggable-option-cancel-default input" ), var input = $( "#draggable-option-cancel-default input" ),
element = $( "#draggable-option-cancel-default" ).draggable(); element = $( "#draggable-option-cancel-default" ).draggable();
TestHelpers.draggable.testDrag( element, input, 50, 50, 0, 0 ); TestHelpers.draggable.shouldNotMove( element, "cancel: default, input dragged", input );
element.draggable( "option", "cancel", "textarea" ); element.draggable( "option", "cancel", "textarea" );
TestHelpers.draggable.testDrag( element, input, 50, 50, 50, 50 ); TestHelpers.draggable.shouldMove( element, "cancel: textarea, input dragged", input );
element.draggable( "option", "cancel", "input" ); element.draggable( "option", "cancel", "input" );
TestHelpers.draggable.testDrag( element, input, 50, 50, 0, 0 ); TestHelpers.draggable.shouldNotMove( element, "cancel: input, input dragged", input );
}); });
/* /*
test( "{ connectToSortable: selector }, default", function() { test( "{ connectToSortable: selector }, default", function() {
expect( 1 ); expect( 1 );
@ -303,7 +300,7 @@ test( "{ containment: [x1, y1, x2, y2] }", function() {
element.draggable( "option", "containment", [ eo.left, eo.top, eo.left + element.width() + 5, eo.top + element.height() + 5 ] ); element.draggable( "option", "containment", [ eo.left, eo.top, eo.left + element.width() + 5, eo.top + element.height() + 5 ] );
TestHelpers.draggable.testDrag( element, element, -100, -100, 0, 0 ); TestHelpers.draggable.testDrag( element, element, -100, -100, 0, 0, "containment: [x1, y1, x2, y2]" );
}); });
test( "{ containment: 'parent' }, relative", function() { test( "{ containment: 'parent' }, relative", function() {
@ -382,7 +379,7 @@ test( "containment, default, switching after initialization", function() {
var element = $( "#draggable1" ).draggable({ containment: false }); var element = $( "#draggable1" ).draggable({ containment: false });
TestHelpers.draggable.testDrag( element, element, -100, -100, -100, -100 ); TestHelpers.draggable.testDrag( element, element, -100, -100, -100, -100, "containment: default" );
element.draggable( "option", "containment", "parent" ) element.draggable( "option", "containment", "parent" )
.css({ .css({
@ -391,10 +388,10 @@ test( "containment, default, switching after initialization", function() {
}) })
.appendTo( $( "#main" ) ); .appendTo( $( "#main" ) );
TestHelpers.draggable.testDrag( element, element, -100, -100, 0, 0 ); TestHelpers.draggable.testDrag( element, element, -100, -100, 0, 0, "containment: parent as option" );
element.draggable( "option", "containment", false ); element.draggable( "option", "containment", false );
TestHelpers.draggable.testDrag( element, element, -100, -100, -100, -100 ); TestHelpers.draggable.testDrag( element, element, -100, -100, -100, -100, "containment: false as option" );
}); });
test( "{ cursor: 'auto' }, default", function() { test( "{ cursor: 'auto' }, default", function() {
@ -593,29 +590,29 @@ test( "disabled", function() {
var element = $( "#draggable1" ).draggable(); var element = $( "#draggable1" ).draggable();
TestHelpers.draggable.shouldMove( element ); TestHelpers.draggable.shouldMove( element, "disabled: default" );
element.draggable( "option", "disabled", true ); element.draggable( "option", "disabled", true );
TestHelpers.draggable.shouldNotMove( element ); TestHelpers.draggable.shouldNotMove( element, "option: disabled true" );
element.draggable( "option", "disabled", false ); element.draggable( "option", "disabled", false );
TestHelpers.draggable.shouldMove( element ); TestHelpers.draggable.shouldMove( element, "option: disabled false" );
}); });
test( "{ grid: [50, 50] }, relative", function() { test( "{ grid: [50, 50] }, relative", function() {
expect( 2 ); expect( 2 );
var element = $( "#draggable1" ).draggable({ grid: [ 50, 50 ] }); var element = $( "#draggable1" ).draggable({ grid: [ 50, 50 ] });
TestHelpers.draggable.testDrag( element, element, 24, 24, 0, 0 ); TestHelpers.draggable.testDrag( element, element, 24, 24, 0, 0, "grid: [50, 50] relative" );
TestHelpers.draggable.testDrag( element, element, 26, 25, 50, 50 ); TestHelpers.draggable.testDrag( element, element, 26, 25, 50, 50, "grid: [50, 50] relative" );
}); });
test( "{ grid: [50, 50] }, absolute", function() { test( "{ grid: [50, 50] }, absolute", function() {
expect( 2 ); expect( 2 );
var element = $( "#draggable2" ).draggable({ grid: [ 50, 50 ] }); var element = $( "#draggable2" ).draggable({ grid: [ 50, 50 ] });
TestHelpers.draggable.testDrag( element, element, 24, 24, 0, 0 ); TestHelpers.draggable.testDrag( element, element, 24, 24, 0, 0, "grid: [50, 50] absolute" );
TestHelpers.draggable.testDrag( element, element, 26, 25, 50, 50 ); TestHelpers.draggable.testDrag( element, element, 26, 25, 50, 50, "grid: [50, 50] absolute" );
}); });
test( "grid, switching after initialization", function() { test( "grid, switching after initialization", function() {
@ -624,13 +621,13 @@ test( "grid, switching after initialization", function() {
var element = $( "#draggable1" ).draggable(); var element = $( "#draggable1" ).draggable();
// Forward // Forward
TestHelpers.draggable.testDrag( element, element, 24, 24, 24, 24 ); TestHelpers.draggable.testDrag( element, element, 24, 24, 24, 24, "grid: default" );
TestHelpers.draggable.testDrag( element, element, 0, 0, 0, 0 ); TestHelpers.draggable.testDrag( element, element, 0, 0, 0, 0, "grid: default" );
element.draggable( "option", "grid", [ 50,50 ] ); element.draggable( "option", "grid", [ 50,50 ] );
TestHelpers.draggable.testDrag( element, element, 24, 24, 0, 0 ); TestHelpers.draggable.testDrag( element, element, 24, 24, 0, 0, "grid: [50, 50] as option" );
TestHelpers.draggable.testDrag( element, element, 26, 25, 50, 50 ); TestHelpers.draggable.testDrag( element, element, 26, 25, 50, 50, "grid: [50, 50] as option" );
}); });
test( "{ handle: 'span' }", function() { test( "{ handle: 'span' }", function() {
@ -638,9 +635,9 @@ test( "{ handle: 'span' }", function() {
var element = $( "#draggable2" ).draggable({ handle: "span" }); var element = $( "#draggable2" ).draggable({ handle: "span" });
TestHelpers.draggable.testDrag( element, "#draggable2 span", 50, 50, 50, 50, "drag span" ); TestHelpers.draggable.shouldMove( element, "handle: span", "#draggable2 span");
TestHelpers.draggable.testDrag( element, "#draggable2 span em", 50, 50, 50, 50, "drag span child" ); TestHelpers.draggable.shouldMove( element, "handle: span child", "#draggable2 span em" );
TestHelpers.draggable.shouldNotMove( element, "drag element" ); TestHelpers.draggable.shouldNotMove( element, "handle: span element" );
}); });
test( "handle, default, switching after initialization", function() { test( "handle, default, switching after initialization", function() {
@ -648,45 +645,45 @@ test( "handle, default, switching after initialization", function() {
var element = $( "#draggable2" ).draggable(); var element = $( "#draggable2" ).draggable();
TestHelpers.draggable.testDrag( element, element, 50, 50, 50, 50 ); TestHelpers.draggable.shouldMove( element, "handle: default, element dragged" );
TestHelpers.draggable.testDrag( element, "#draggable2 span", 100, 100, 100, 100 ); TestHelpers.draggable.shouldMove( element, "handle: default, span dragged", "#draggable2 span" );
// Switch // Switch
element.draggable( "option", "handle", "span" ); element.draggable( "option", "handle", "span" );
TestHelpers.draggable.testDrag( element, element, 50, 50, 0, 0 ); TestHelpers.draggable.shouldNotMove( element, "handle: span as option, element dragged" );
TestHelpers.draggable.testDrag( element, "#draggable2 span", 100, 100, 100, 100 ); TestHelpers.draggable.shouldMove( element, "handle: span as option, span dragged", "#draggable2 span" );
// And back // And back
element.draggable( "option", "handle", false ); element.draggable( "option", "handle", false );
TestHelpers.draggable.testDrag( element, element, 50, 50, 50, 50 ); TestHelpers.draggable.shouldMove( element, "handle: false as option, element dragged" );
TestHelpers.draggable.testDrag( element, "#draggable2 span", 100, 100, 100, 100 ); TestHelpers.draggable.shouldMove( element, "handle: false as option, span dragged", "#draggable2 span" );
}); });
test( "helper, default, switching after initialization", function() { test( "helper, default, switching after initialization", function() {
expect( 3 ); expect( 3 );
var element = $( "#draggable1" ).draggable(); var element = $( "#draggable1" ).draggable();
TestHelpers.draggable.shouldMove( element ); TestHelpers.draggable.shouldMove( element, "helper: default" );
element.draggable( "option", "helper", "clone" ); element.draggable( "option", "helper", "clone" );
TestHelpers.draggable.shouldNotMove( element ); TestHelpers.draggable.shouldNotMove( element, "helper: clone" );
element.draggable( "option", "helper", "original" ); element.draggable( "option", "helper", "original" );
TestHelpers.draggable.shouldMove( element ); TestHelpers.draggable.shouldMove( element, "helper: original" );
}); });
test( "{ helper: 'clone' }, relative", function() { test( "{ helper: 'clone' }, relative", function() {
expect( 1 ); expect( 1 );
var element = $( "#draggable1" ).draggable({ helper: "clone" }); var element = $( "#draggable1" ).draggable({ helper: "clone" });
TestHelpers.draggable.shouldNotMove( element ); TestHelpers.draggable.shouldNotMove( element, "helper: clone relative" );
}); });
test( "{ helper: 'clone' }, absolute", function() { test( "{ helper: 'clone' }, absolute", function() {
expect( 1 ); expect( 1 );
var element = $( "#draggable2" ).draggable({ helper: "clone" }); var element = $( "#draggable2" ).draggable({ helper: "clone" });
TestHelpers.draggable.shouldNotMove( element ); TestHelpers.draggable.shouldNotMove( element, "helper: clone absolute" );
}); });
test( "{ helper: 'original' }, relative, with scroll offset on parent", function() { test( "{ helper: 'original' }, relative, with scroll offset on parent", function() {

10
tests/unit/draggable/draggable_test_helpers.js
View File

@ -25,11 +25,13 @@ TestHelpers.draggable = {
msg = msg ? msg + "." : ""; msg = msg ? msg + "." : "";
deepEqual( actual, expected, "dragged[" + dx + ", " + dy + "] " + msg ); deepEqual( actual, expected, "dragged[" + dx + ", " + dy + "] " + msg );
}, },
shouldMove: function( el, why ) { shouldMove: function( el, why, handle ) {
TestHelpers.draggable.testDrag( el, el, 50, 50, 50, 50, why ); handle = handle || el;
TestHelpers.draggable.testDrag( el, handle, 50, 50, 50, 50, why );
}, },
shouldNotMove: function( el, why ) { shouldNotMove: function( el, why, handle ) {
TestHelpers.draggable.testDrag( el, el, 50, 50, 0, 0, why ); handle = handle || el;
TestHelpers.draggable.testDrag( el, handle, 50, 50, 0, 0, why );
}, },
testScroll: function( el, position ) { testScroll: function( el, position ) {
var oldPosition = $( "#main" ).css( "position" ); var oldPosition = $( "#main" ).css( "position" );