Files
Phraseanet/resources/www/prod/js/tests/jquery.Selection.js.html
Florian BLOUET 60639d0e96 fix tests
2015-12-02 17:35:43 +01:00

164 lines
4.8 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="../../../../../www/assets/vendors/jquery/jquery.js"></script>
<script src="../../../../../www/bower_components/qunit/qunit/qunit.js"></script>
<script src="../jquery.Selection.js"></script>
<link type="text/css" rel="stylesheet" href="../../../../../www/bower_components/qunit/qunit/qunit.css"/>
<script> $(document).ready(function(){
test("Selection instanciation", function() {
var sel = new Selectable($('#test_box2'));
var array = new Array();
equal( typeof array, typeof sel.get(), "We expect the selection to be an Array" );
equal( array.length, sel.get().length, "We expect the selection to be empty" );
});
module("Add datas");
test("first test within module", function() {
var sel = new Selectable($('#test_box3'));
sel.push('a');
equal( 1, sel.get().length, "We expect the selection to be empty" );
equal( 'a', sel.get().pop(), "We expect the selection to be empty" );
});
module("Multiple selections");
test("first test within module", function() {
var sel1 = new Selectable($('#test_box4'));
var sel2 = new Selectable($('#test_box5'));
sel1.push('a');
sel2.push('b');
equal( 1, sel1.get().length, "We expect the selection to be empty" );
equal( 'a', sel1.get().pop(), "We expect the selection to be empty" );
equal( 1, sel2.get().length, "We expect the selection to be empty" );
equal( 'b', sel2.get().pop(), "We expect the selection to be empty" );
});
module("DOM selection");
test("DOM selection", function() {
var sel1 = new Selectable($('#test_box1'),
{
selector : 'li'
, allow_multiple : true
, callbackSelection : function(elem){
var lst = jQuery('li', $('#test_box1'));
var index = jQuery.inArray( elem[0], lst );
return 'item' + index;
}
}
);
equal(true, $('#test_box1').hasClass('selectionnable'));
equal(0, sel1.length(), 'Nothing is selected');
equal(0, sel1.size(), 'Nothing is selected');
sel1.selectAll();
equal(0, $('#test_box li:not(.selected)').length);
equal(10, sel1.length(), 'Everything is selected');
equal(10, sel1.size(), 'Everything is selected');
sel1.empty();
equal(sel1.length(), 0);
equal(sel1.size(), 0);
$('#test_box1 li:not(.selected):first').trigger('click');
equal(1, sel1.size(), 'First element selection');
var SKevent = jQuery.Event('click', { shiftKey : true });
$('#test_box1 li:not(.selected)').filter(':last').trigger(SKevent);
equal(sel1.length(), 10, 'Shift click selection');
equal(sel1.size(), 10);
sel1.empty();
equal(0, $('#test_box li:not(.selected)').length);
$('#test_box1 li:not(.selected):last').trigger('click');
equal(1, sel1.size(), 'Last element selection');
var SKevent = jQuery.Event('click', { shiftKey : true });
$('#test_box1 li:not(.selected)').filter(':first').trigger(SKevent);
equal(sel1.length(), 10, 'Shift click selection reversed');
equal(sel1.size(), 10);
$('#test_box1 li:first').trigger('click');
equal(sel1.length(), 1, 'Start new selection');
equal($('#test_box1 li:last').hasClass('selected'), false, 'last item does not have selected class');
var CKevent = jQuery.Event('click', { ctrlKey : true });
$('#test_box1 li:last').trigger(CKevent);
equal(sel1.length(), 2, 'Ctrl click');
var CKevent = jQuery.Event('click', { ctrlKey : true });
$('#test_box1 li:last').trigger(CKevent);
equal(sel1.length(), 1, 'Ctrl click');
var CKevent = jQuery.Event('click', { ctrlKey : true });
$('#test_box1 li:last').trigger(CKevent);
equal(sel1.length(), 2, 'Ctrl click');
equal(sel1.serialize(), 'item0;item9');
equal(sel1.serialize('!u'), 'item0!uitem9');
});
});
</script>
</head>
<body>
<h1 id="qunit-header">QUnit example</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="qunit-fixture">test markup, will be hidden</div>
<div id="test_box1">
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
<div id="test_box2">
</div>
<div id="test_box3">
</div>
<div id="test_box4">
</div>
<div id="test_box5">
</div>
</body>
</html>