Zepto DOM unit tests
See the browser console for results.
yay
nay
Here is some text
And some more
1
2
34
56
1
2
34
56
test
hi
hi
test
hihi
').appendTo('body');
t.assert(window.someGlobalVariable);
window.someGlobalVariable = false;
$('<' + 'script>this.someGlobalVariable = true;').appendTo('body');
t.assert(window.someGlobalVariable);
},
testHtmlEval: function (t) {
window.someGlobalVariable = false;
var div = $('');
div
.appendTo('body')
.html('<' + 'script>window.someGlobalVariable = true;');
t.assert(window.someGlobalVariable);
},
testRemove: function (t) {
var newElement1 = $('');
newElement1
.appendTo('body')
.remove();
t.assertEqual( $('#some_new_element_1').length, 0 );
//
var newElement2 = $(''),
errorRaised = false;
newElement2.appendTo('body');
$('#some_new_element_2').remove();
try {
newElement2.remove();
} catch (e) {
errorRaised = true;
};
t.assert(!errorRaised);
},
testAddRemoveClass: function(t){
var el = $('#some_element').get(0);
$('#some_element').addClass('green');
t.assertEqual('green', el.className);
$('#some_element').addClass('green');
t.assertEqual('green', el.className);
$('#some_element').addClass('red');
t.assertEqual('green red', el.className);
$('#some_element').addClass('blue red');
t.assertEqual('green red blue', el.className);
$('#some_element').removeClass('green blue');
t.assertEqual('red', el.className);
$('#some_element').attr('class', ' red green blue ');
t.assertEqual(' red green blue ', el.className); // sanity check that WebKit doesn't change original input
$('#some_element').removeClass('green');
t.assertEqual('red blue', el.className);
//addClass with function argument
$('#some_element').addClass(function(idx,classes){
//test the value of "this"
t.assertEqualCollection($('#some_element'), $(this));
//test original classes are being passed
t.assertEqual('red blue', this.className);
return "green";
});
t.assertEqual('red blue green', el.className);
//removeClass with function argument
$('#some_element').removeClass(function(idx,classes){
//test the value of "this"
t.assertEqualCollection($('#some_element'), $(this));
//test original classes are being passed
t.assertEqual('red blue green', this.className);
return "blue";
});
t.assertEqual('red green', el.className);
$('#some_element').removeClass();
t.assertEqual('', el.className);
},
testHasClass: function(t){
var el = $('#some_element').get(0);
$('#some_element').addClass('green');
t.assert($('#some_element').hasClass('green'));
t.assert(!$('#some_element').hasClass('orange'));
$('#some_element').addClass('orange');
t.assert($('#some_element').hasClass('green'));
t.assert($('#some_element').hasClass('orange'));
},
testHasClassEmpty: function(t){
var z = $('#doesnotexist');
t.assertEqual(0, z.size());
t.assertFalse(z.hasClass('a'));
},
testToggleClass: function(t){
var el = $('#toggle_element').get(0);
$('#toggle_element').toggleClass('green');
t.assert($('#toggle_element').hasClass('green'));
t.assert(!$('#toggle_element').hasClass('orange'));
$('#toggle_element').toggleClass('orange');
t.assert($('#toggle_element').hasClass('green'));
t.assert($('#toggle_element').hasClass('orange'));
$('#toggle_element').toggleClass('green');
t.assert(!$('#toggle_element').hasClass('green'));
t.assert($('#toggle_element').hasClass('orange'));
$('#toggle_element').toggleClass('orange');
t.assert(!$('#toggle_element').hasClass('green'));
t.assert(!$('#toggle_element').hasClass('orange'));
$('#toggle_element').toggleClass('orange', false);
t.assert(!$('#toggle_element').hasClass('orange'));
$('#toggle_element').toggleClass('orange', true);
t.assert($('#toggle_element').hasClass('orange'));
//function argument
$('#toggle_element').toggleClass(function(idx,classes){
//test the value of "this"
t.assertEqualCollection($('#toggle_element'), $(this));
//test original classes are being passed
t.assertEqual('orange', this.className);
return "brown";
});
t.assert($('#toggle_element').hasClass('brown'));
$('#toggle_element').toggleClass(function(idx,classes){
return "yellow";
},false);
t.assert(!$('#toggle_element').hasClass('yellow'));
$('#toggle_element').toggleClass(function(idx,classes){
return "yellow";
},true);
t.assert($('#toggle_element').hasClass('yellow'));
},
testIndex: function(t){
t.assertEqual($("p > span").index("#nay"), 2);
t.assertEqual($("p > span").index(".yay"), 0);
t.assertEqual($("span").index("span"), 0);
t.assertEqual($("span").index("boo"), -1);
t.assertEqual($('#index_test > *').eq(-1).index(), 1);
},
testBoolAttr: function (t) {
t.assertEqual($('#BooleanInput').attr('required'), true);
t.assertEqual($('#BooleanInput').attr('non_existant_attr'), undefined);
},
testDocumentReady: function (t) {
// Check that if document is already loaded, ready() immediately executes callback
var foo = false;
$(document).ready(function () { $(document).ready(function () { foo = true; }) });
t.assert(foo);
},
testSlice: function (t) {
var $els = $("#slice_test div");
t.assertEqual($els.slice().length, 3);
t.assertEqual(typeof $els.slice().ready, 'function');
t.assertEqual($els.slice(-1)[0].className, 'slice3');
},
testEnd: function (t) {
t.assert($().end().length, 0);
var $endTest = $('#end_test');
var $endTest2 = $('#end_test').find('div').find('span').end().end();
t.assertEqual($endTest.length, $endTest2.length);
t.assertEqual($endTest.get(0), $endTest2.get(0));
},
testCustomEvents: function (t) {
var $body = $(document.body);
$body.bind('custom', function(evt, a, b) {
t.assertEqual(a, 1);
t.assertEqual(b, 2);
$body.unbind();
})
$body.trigger('custom', [1, 2]);
$body.bind('custom', function(evt, a) {
t.assertEqual(a, 1);
$body.unbind();
})
$body.trigger('custom', 1);
var eventData = {z: 1};
$body.bind('custom', function(evt, a) {
t.assertEqual(a, eventData);
$body.unbind();
})
$body.trigger('custom', eventData);
}
});