Draggable: Add battery of tests to cover connectToSortable

Refs #9481
Refs #9675
Closes gh-1323
This commit is contained in:
Mike Sherov 2014-08-26 08:50:50 -04:00
parent 52a1de5caa
commit bfb65076e4
2 changed files with 107 additions and 28 deletions

View File

@ -46,19 +46,11 @@
#draggable3, #draggable4 {
z-index: 100;
}
#sortable {
.sortable {
position: relative;
top: 8000px;
left: 10px;
}
#sortable2 {
position: relative;
top: 9000px;
left: 10px;
}
.sortable {
width: 300px;
height: 100px;
padding: 0;
margin: 0;
border: 0;
@ -117,13 +109,13 @@
<div style="width: 1px; height: 1000px;"></div>
<div style="position: absolute; width: 1px; height: 2000px;"></div>
<ul id="sortable" class="sortable">
<li>Item 0</li>
<li id="draggableSortable">Item 1</li>
<li id="draggableSortable">Item 0</li>
<li id="draggableSortable2">Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
<ul id="sortable2" class="sortable">
<li id="draggableSortableClone">Item 0</li>
<li id="draggableSortableClone" class="sortable2Item">Item 0</li>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>

View File

@ -244,23 +244,15 @@ test( "cancelement, default, switching after initialization", function() {
TestHelpers.draggable.shouldNotDrag( element, "cancel: input, input dragged", input );
});
/*
test( "{ connectToSortable: selector }, default", function() {
expect( 1 );
ok(false, "missing test - untested code is broken code" );
});
*/
test( "connectToSortable, dragging out of a sortable", function() {
expect( 3 );
expect( 4 );
var sortItem, dragHelper,
element = $( "#draggableSortable" ).draggable({
scroll: false,
connectToSortable: "#sortable"
}),
sortable = $( "#sortable" ).sortable(),
sortable = $( "#sortable" ).sortable({ revert: 100 }),
dx = 50,
dy = 50,
offsetBefore = element.offset(),
@ -286,6 +278,10 @@ test( "connectToSortable, dragging out of a sortable", function() {
// HTML IDs are removed when dragging to a Sortable
equal( sortItem[ 0 ], dragHelper[ 0 ], "both have the same helper" );
equal( sortItem.attr( "id" ), dragHelper.attr( "id" ), "both have the same id" );
// http://bugs.jqueryui.com/ticket/9481
// connectToSortable causes sortable revert to fail on second attempt
equal( sortable.sortable( "option", "revert" ), 100, "sortable revert behavior is preserved" );
});
element.simulate( "drag", {
@ -294,21 +290,31 @@ test( "connectToSortable, dragging out of a sortable", function() {
});
});
test( "connectToSortable, dragging clone into sortable", function() {
expect( 1 );
asyncTest( "connectToSortable, dragging clone into sortable", function() {
expect( 3 );
var element = $( "#draggableSortableClone" ).draggable({
var offsetPlaceholder,
element = $( "#draggableSortableClone" ).draggable({
scroll: false,
connectToSortable: "#sortable",
helper: "clone"
}),
sortable = $( "#sortable" ).sortable(),
sortable = $( "#sortable" ).sortable({ revert: 100 }),
offsetSortable = sortable.offset();
$( sortable ).one( "sort", function( event, ui ) {
offsetPlaceholder = ui.placeholder.offset();
// http://bugs.jqueryui.com/ticket/8809
// Position issue when connected to sortable
deepEqual( ui.helper.offset(), offsetSortable, "sortable offset is correct" );
notDeepEqual( ui.helper.offset(), offsetPlaceholder, "offset not equal to placeholder" );
});
$( sortable ).one( "sortstop", function( event, ui ) {
// http://bugs.jqueryui.com/ticket/9675
// Animation issue with revert and connectToSortable
deepEqual( ui.item.offset(), offsetPlaceholder, "offset eventually equals placeholder" );
start();
});
element.simulate( "drag", {
@ -318,6 +324,87 @@ test( "connectToSortable, dragging clone into sortable", function() {
});
});
test( "connectToSortable, dragging multiple elements in and out of sortable", function() {
expect( 1 );
var element = $( "#draggableSortableClone" ).draggable({
scroll: false,
connectToSortable: "#sortable",
helper: "clone"
}),
element2 = $( "#draggableSortable" ).draggable({
scroll: false,
connectToSortable: "#sortable"
}),
sortable = $( "#sortable" ).sortable({ revert: false }),
sortableOffset = sortable.offset();
// Move element into sortable
element.simulate( "drag", {
x: sortableOffset.left + 1,
y: sortableOffset.top + 1,
moves: 10
});
// Move element in sortable out
element2.simulate( "drag", {
dx: 200,
dy: 200,
moves: 10
});
// http://bugs.jqueryui.com/ticket/9675
// Animation issue with revert and connectToSortable
sortable.one( "sortstop", function( event, ui ) {
ok( !$.contains( document, ui.placeholder[ 0 ] ), "placeholder was removed" );
});
// Move the clone of the first element back out
$( "#sortable .sortable2Item" ).simulate( "drag", {
dx: 200,
dy: 200,
moves: 10
});
});
test( "connectToSortable, dragging through one sortable to a second", function() {
expect( 2 );
var overCount = 0,
element = $( "#draggableSortable" ).draggable({
scroll: false,
connectToSortable: ".sortable"
}),
delta = 200,
sortable = $( "#sortable" ).sortable({ revert: false }),
sortable2 = $( "#sortable2" ).sortable({ revert: false }),
sortable2Offset = sortable2.offset(),
dragParams = {
x: sortable2Offset.left + 25,
y: sortable2Offset.top + sortable.outerHeight() + delta,
moves: 10
};
$( sortable ).one( "sortover", function() {
overCount++;
sortable2.css( "top", "+=" + delta );
});
$( sortable2 ).on( "sortupdate", function() {
ok( true, "second sortable is updated" );
});
$( sortable2 ).one( "sortover", function() {
overCount++;
});
$( sortable2 ).one( "sortstop", function() {
equal( overCount, 2, "went over both sortables" );
});
element.simulate( "drag", dragParams );
});
test( "{ containment: Element }", function() {
expect( 1 );
@ -456,8 +543,8 @@ test( "containment, element cant be pulled out of container", function() {
})
.draggable({ containment: "parent" })
.simulate( "drag", {
dx: 200,
dy: 200
dx: 500,
dy: 500
});
offsetBefore = element.offset();