Mercurial > nebulaweb3

comparison default/node_modules/shoestring/test/unit/extensions.js @ 0:1d038bc9b3d2 default tip

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Up:default
author Liny <dev@neowd.com>
date Sat, 31 May 2025 09:21:51 +0800
parents
children
comparison
equal deleted inserted replaced
-1:000000000000 0:1d038bc9b3d2
1 (function(undefined){
2 var config, ss = shoestring;
3 var $fixture = shoestring( '#qunit-fixture' );
4
5 module( 'dom', config = {
6 setup: function() {
7 $fixture = shoestring( '#qunit-fixture' );
8 },
9
10 teardown: function() {
11 $fixture.unbind("foo");
12 $(document).unbind("foo");
13 }
14 });
15
16 test( '`.add()` adds selected elements to the set', function(){
17 var length, count;
18
19 length = $fixture.length;
20 count = shoestring( '.add' ).length;
21 $fixture = $fixture.add( '.add' );
22
23 ok( count > 0 );
24 equal( $fixture.length, length + count );
25 });
26
27 test( '`.addClass()` adds a classes when they doesnt exit', function(){
28 var $element = $fixture.find( '.add-class' );
29
30 $element.addClass( 'foo bar baz' );
31 equal( $element.attr( "class" ), "add-class foo bar baz" );
32 });
33
34 test( '`.addClass()` doesnt duplicate classes', function(){
35 var $element = $fixture.find( '.add-class' );
36
37 $element.addClass( 'add-class' );
38 equal( $element.attr( "class" ), "add-class" );
39 });
40
41 test( '`.after()` inserts a sibling after the current obj element', function(){
42 expect( 3 );
43 var $element = $fixture.find( '.after' );
44
45 equal( $fixture.find( '.foo-after' ).length, 0 );
46 $element.after( "<div class='foo-after'></div> ");
47 equal( $fixture.find( '.foo-after' ).length, 1 );
48
49 // sibling to .foo-after
50 $fixture.children().each(function(i) {
51 if( shoestring( this ).is( '.after' ) ){
52 equal( $fixture.children()[i+1].className, "foo-after" );
53 }
54 });
55 });
56
57 test( '`.after()` inserts siblings after the current obj element in the correct order', function(){
58 expect( 6 );
59 var $element = $fixture.find( '.after' );
60
61 equal( $fixture.find( '.foo-after' ).length, 0 );
62 equal( $fixture.find( '.foo-after2' ).length, 0 );
63 $element.after( "<div class='foo-after'></div><div class='foo-after2'></div> ");
64 equal( $fixture.find( '.foo-after' ).length, 1 );
65 equal( $fixture.find( '.foo-after2' ).length, 1 );
66
67 // sibling to .foo-after
68 $fixture.children().each(function(i) {
69 if( shoestring( this ).is( '.after' ) ){
70 equal( $fixture.children()[i+1].className, "foo-after" );
71 equal( $fixture.children()[i+2].className, "foo-after2" );
72 }
73 });
74 });
75
76 test( '`.insertAfter()` inserts after the selector', function(){
77 expect( 3 );
78
79 equal( $fixture.find( '.foo-after' ).length, 0 );
80 shoestring( "<div class='foo-after'></div> ").insertAfter( '.after' );
81 equal( $fixture.find( '.foo-after' ).length, 1 );
82
83 // sibling to .foo-after
84 $fixture.children().each(function(i) {
85 if( shoestring( this ).is( '.after' ) ){
86 equal( $fixture.children()[i+1].className, "foo-after" );
87 }
88 });
89 });
90
91 test( '`.append()` inserts a child in the current obj element', function(){
92 var $element = $fixture.find( '.append' );
93
94 equal( $element.find( '.foo-append' ).length, 0 );
95 $element.append( "<div class='foo-append'></div> ");
96 equal( $element.find( '.foo-append' ).length, 1 );
97 });
98
99 test( '`.insertAfter()` inserts after the selector', function(){
100 var $element = $fixture.find( '.append' );
101
102 equal( $element.find( '.foo-append' ).length, 0 );
103 shoestring( "<div class='foo-append'></div> ").appendTo( $element );
104 equal( $element.find( '.foo-append' ).length, 1 );
105 });
106
107 test( '`.attr()` returns undefined on empty set', function(){
108 var $element = $( '#this_will_not_match' );
109
110 equal( $element.attr( 'class' ), undefined );
111 });
112
113 test( '`.attr()` gets the attribute', function(){
114 var $element = $fixture.find( '.attr' );
115
116 equal( $element.attr( 'class' ), "attr" );
117 });
118
119 test( '`.attr()` sets the attribute', function(){
120 var $element = $fixture.find( '.attr' );
121
122 equal( $element.attr( 'class', "foo" ).attr( 'class' ), "foo" );
123 });
124
125 test( '`.before()` inserts a sibling before the current obj element', function(){
126 expect( 3 );
127 var $element = $fixture.find( '.before' );
128
129 equal( $fixture.find( '.foo-before' ).length, 0 );
130 $element.before( "<div class='foo-before'></div> ");
131 equal( $fixture.find( '.foo-before' ).length, 1 );
132
133 // sibling to .foo-before
134 $fixture.children().each(function(i) {
135 if( shoestring( this ).is( '.before' ) ){
136 equal( $fixture.children()[i-1].className, "foo-before" );
137 }
138 });
139 });
140
141 test( '`.data` and falsy values', function() {
142 var $fixture = shoestring( '#qunit-fixture' ),
143 $el;
144
145 $fixture.html( '<div id="el"></div>' );
146 $el = $( "#el" );
147
148 $el.data( "val-false", false );
149 strictEqual( $( '#el' ).data( "val-false" ), false );
150
151 $el.data( "val-zero", 0 );
152 strictEqual( $( '#el' ).data( "val-zero" ), 0 );
153
154 $el.data( "val-undefined", undefined );
155 strictEqual( $( '#el' ).data( "val-undefined" ), undefined );
156 });
157
158 test( '`.data` works on empty nodelists', function() {
159 var $fixture = shoestring( '#qunit-fixture' ),
160 $el;
161
162 $fixture.html( '<div id="el"></div>' );
163 $el = $( "#el" );
164
165 strictEqual( $( '#thiswontmatch' ).data(), undefined, 'should be undefined on an empty result set.' );
166 strictEqual( $( '#thiswontmatch' ).data( "somekey" ), undefined, 'should be undefined on an empty result set with a key passed in.' );
167
168 deepEqual( $( '#el' ).data(), {}, 'should be an empty object on an nonempty result set.' );
169 strictEqual( $( '#el' ).data( "somekey" ), undefined, 'should be undefined on an nonempty result set with a key passed in.' );
170 });
171
172 test( '`.data` does not alias to `data-` attributes', function() {
173 expect( 3 );
174 var $fixture = shoestring( '#qunit-fixture' ),
175 $el;
176
177 $fixture.html( '<div id="el" data-attr1 data-attr2="test"></div>' );
178 $el = $( "#el" );
179
180 strictEqual( $( '#el' ).data( "attr0" ), undefined, 'attribute does not exist, should not throw an error.' );
181
182 throws(function() {
183 $( '#el' ).data( "attr1" );
184 }, 'attribute exists but has no value, should have thrown a dev error.' );
185
186 throws(function() {
187 $( '#el' ).data( "attr2" );
188 }, 'attribute exists and has a value, should have thrown a dev error.' );
189 });
190
191 test( '`.insertBefore()` inserts before the selector', function(){
192 expect( 3 );
193
194 equal( $fixture.find( '.foo-before' ).length, 0 );
195 shoestring( "<div class='foo-before'></div> ").insertBefore( '.before' );
196 equal( $fixture.find( '.foo-before' ).length, 1 );
197
198 // sibling to .foo-before
199 $fixture.children().each(function(i) {
200 if( shoestring( this ).is( '.before' ) ){
201 equal( $fixture.children()[i-1].className, "foo-before" );
202 }
203 });
204 });
205
206 test( '`.clone()` prevents alteration of original', function() {
207 var $clone, $element;
208
209 $element = $fixture.find( ".clone" );
210 $clone = $element.clone();
211
212 equal( $element.attr( "class" ), "clone" );
213 equal( $clone.attr( "class" ), "clone" );
214 $clone.attr( "class", "foo" );
215 equal( $element.attr( "class" ), "clone" );
216 equal( $clone.attr( "class" ), "foo" );
217 });
218
219 test( '`.closest()`', function() {
220 var $fixture = shoestring( '#qunit-fixture' );
221
222 var $child = $fixture.find( '.closest .child' );
223
224 equal( $child[0], $child.closest( '.child' )[0], 'Closest returns current element on match' );
225
226 equal( $child.closest( '.parent' ).length, 1, 'Closest returns only one element when original nodelist has one element.' );
227
228 var $children = $fixture.find( '.closest .second-child' ).add( $child );
229
230 equal( $children.closest( '.parent' ).length, 2, 'Closest returns only two elements when original nodelist has two element.' );
231
232 ok( $child.closest( '.parent' ).is( '.first' ), 'Closest returns from the bottom up.' );
233
234 ok( $child.closest( '.parent.second' ).is( '.second' ), 'Closest will traverse at least two parents correctly.' );
235 });
236
237 test('`.css()`', function() {
238 var $css = $fixture.find( ".css" ),
239 $otherCss = $fixture.find( ".othercss" );
240
241 $css.css({
242 foo: "bar",
243 baz: "bak",
244 "float": "left",
245 "margin-right": "1px",
246 "transform": "rotateX(0)",
247 "WebkitTransform": "rotateX(0)",
248 "box-sizing": "border-box",
249 "WebkitBoxSizing": "border-box"
250 });
251
252 $css.css( 'margin-left', "2px" );
253
254 // computed style should ignore spurious styles
255 equal( ss._getStyle($css[0], 'baz'), undefined );
256
257 // width is defined in the page
258 equal( ss._getStyle($css[0], 'width'), "200px", "width should show value set from <style> tag." );
259
260 // margin-right is defined in the object assignment above
261 equal( ss._getStyle($css[0], 'margin-right'), "1px", "margin-right should be set" );
262
263 // margin-left is defined in the property assignment above
264 equal( ss._getStyle($css[0], 'margin-left'), "2px", "margin-left should be set" );
265
266 equal( ss._getStyle($css[0], "float"), "left", "float is a special case (cssFloat in JS)." );
267
268 equal( ss._getStyle($css[0], 'box-sizing'), 'border-box', 'Box-sizing should default to content-box.' );
269
270 if( document.defaultView ) { // CTM for this vendor prefix test.
271 notEqual( ss._getStyle($css[0], 'transform'), undefined, 'transform should **NOT** be undefined (get vendor prefixes correctly).' );
272 }
273
274 notEqual( ss._getStyle($otherCss[0], 'width'), undefined, 'Width should **NOT** have a value because it’s not set.' );
275 });
276
277 test('`.eq()`', function() {
278 equal( $fixture.eq( 0 )[0], $fixture[0] );
279 equal( $fixture.eq( 1000000 )[0], undefined );
280 });
281
282 test('`.filter( selector )`', function() {
283 var $divs = $fixture.find( "div" );
284
285 equal( $divs.filter( ".filter" ).length, 1 );
286 equal( $divs.filter( ".filter" )[0], $fixture.find( ".filter" )[0] );
287
288 var $withoutParent = $( "<div class='filter'></div><div></div>" );
289
290 equal( $withoutParent.filter( ".filter" ).length, 1 );
291 equal( $withoutParent.filter( ".filter" )[0], $withoutParent[0] );
292 });
293
294 test('`.add( document ).filter( selector )`', function() {
295 var $divs = $fixture.find( "div" );
296 var $addDoc = $divs.add( document );
297 equal( $addDoc.filter( ".filter" ).length, 1 );
298
299 var $doc = $( document );
300 equal( $doc.filter( document ).length, 1 );
301 });
302
303 test('`.filter( function )`', function() {
304 var $divs = $fixture.find( ".filter" );
305
306 equal( $divs.length, 1 );
307 equal( $divs.filter(function() { return false; }).length, 0 );
308 equal( $divs.filter(function() { return true; }).length, 1 );
309 });
310
311 test('`.first()`', function() {
312 equal( $fixture.eq( 0 )[0], $fixture.first()[0] );
313 });
314
315 test('`.get()`', function() {
316 equal( $fixture[0], $fixture.get(0) );
317 });
318
319 test('`.height()`', function() {
320 var $height = $fixture.find( ".height" );
321
322 // returns the value without param
323 equal( $height.height(), 200 );
324
325 // works with integers
326 $height.height( 300 );
327 equal( $height.height(), 300 );
328
329 // works with strings
330 $height.height( "400px" );
331 equal( $height.height(), 400 );
332 });
333
334 test( '`.html()`', function() {
335 var $old = shoestring( '.html .old' ),
336 $new = shoestring( '.html .new' ),
337 htmlStr = '<div id="sibling"></div>';
338
339 $old[0].innerHTML = htmlStr;
340 $new.html( htmlStr );
341
342 ok( !!$old[0].innerHTML );
343 equal( $new[0].innerHTML, $old[0].innerHTML, '.html(str) set properly.' );
344 equal( $new.html(), $old[0].innerHTML, '.html() get str properly.' );
345 });
346
347 test( '`.html(Number)`', function() {
348 var $old = shoestring( '.html .old' ),
349 $new = shoestring( '.html .new' ),
350 htmlStr = 2;
351
352 $old[0].innerHTML = htmlStr;
353 $new.html( htmlStr );
354
355 ok( !!$old[0].innerHTML );
356 equal( $new[0].innerHTML, $old[0].innerHTML, '.html(number) set a number properly.' );
357 equal( $new.html(), $old[0].innerHTML, '.html() get number properly.' );
358 });
359
360 test( '`.html(HTML Object)`', function() {
361 var $old = shoestring( '.html .old' ),
362 $new = shoestring( '.html .new' );
363
364 var div = document.createElement( "div" );
365 div.id = "sibling";
366
367 $old[0].innerHTML = "<div id='sibling'></div>";
368 $new.html( div );
369
370 ok( !!$old[0].innerHTML );
371 equal( $new[0].innerHTML, $old[0].innerHTML, '.html(obj) set properly.' );
372 equal( $new.html(), $old[0].innerHTML, '.html() get obj properly.' );
373 });
374
375 test( '`.html(HTML Object)`', function() {
376 var $old = shoestring( '.html .old' ),
377 $new = shoestring( '.html .new' );
378
379 var div = document.createElement( "div" );
380 div.id = "sibling";
381
382 $old[0].innerHTML = "<div id='sibling'></div>";
383 $new.html( div );
384
385 ok( !!$old[0].innerHTML );
386 equal( $new[0].innerHTML, $old[0].innerHTML, '.html(obj) set properly.' );
387 equal( $new.html(), $old[0].innerHTML, '.html() get properly.' );
388 });
389
390 test( '`.html(Array)`', function() {
391 var $old = shoestring( '.html .old' ),
392 $new = shoestring( '.html .new' );
393
394 var arr = [];
395
396 var div = document.createElement( "div" );
397 div.id = "sibling";
398 var div2 = document.createElement( "div" );
399 div2.id = "sibling2";
400
401 arr.push( div );
402 arr.push( div2 );
403
404 $old[0].innerHTML = "<div id='sibling'></div><div id='sibling2'></div>";
405 $new.html( arr );
406
407 ok( !!$old[0].innerHTML );
408 equal( $new[0].innerHTML, $old[0].innerHTML, '.html(Array) set properly.' );
409 equal( $new.html(), $old[0].innerHTML, '.html() get properly.' );
410 });
411
412 test('`.index()`', function() {
413 var $indexed = $fixture.find( ".index div" );
414 equal( $indexed.index( ".first" ), 0 );
415 equal( $indexed.index( ".second" ), 1 );
416
417 var $second = $fixture.find( ".index .second" );
418 equal( $second.index(), 1 );
419 equal( $indexed.index( $second.get( 0 ) ), 1, "index() DOM element argument" );
420
421 throws(function() {
422 equal( $indexed.index( $second ), 1, "index() shoestring argument" );
423 }, 'index(shoestring()) should throw a dev error.' );
424
425 });
426
427 test('empty set `.index()`', function() {
428 equal( $( ".this-set-will-be-empty" ).index(), -1 );
429 });
430
431 test('`.is()`', function() {
432 ok( $fixture.is("#qunit-fixture") );
433 ok( !$fixture.is(".jacky-jormp-jomp") );
434 ok( $("html").is("html") );
435 ok( $("body").is("body") );
436 ok( $("body").is(document.body), "body is document.body" );
437
438 // For some reason in IE8, document[0] returns the first form.
439 ok( !$("form[name=abc]").is( document ), "a form is not document" );
440
441 // element checks permitted, works at parent level
442 ok( $( document ).is( document ), "document should be document" );
443
444 ok( $fixture.is( $fixture ) );
445
446 // correctly matches the child/descendant selector combinators
447 ok( $fixture.find( ".is .child" ).is( ".is > .child" ) );
448 ok( $fixture.find( ".is .child" ).is( "body .child" ) );
449 });
450
451 test('`.last()`', function() {
452 equal( $fixture.eq( $fixture.length - 1 )[0], $fixture.last()[0] );
453 });
454
455 test( '`.next()`', function() {
456 var $first, $all;
457
458 $first = $fixture.find( ".next .first" );
459 $all = $fixture.find( ".next > div" );
460
461
462 equal( $first.next().length, 1 );
463 equal( $first.next()[0], $fixture.find(".next .second")[0]);
464
465 equal( $all.next().length, 2 );
466 equal( $all.next()[0], $fixture.find(".next .second")[0]);
467 equal( $all.next()[1], $fixture.find(".next .third")[0]);
468 equal( $all.next()[2], undefined );
469 });
470
471 test( '`.not()`', function() {
472 var $divs = $fixture.find( ".not div" );
473
474 equal( $divs.not( ".is-not" ).length, 1 );
475 equal( $divs.not( ".is-so" ).length, $divs.length - 1 );
476 });
477
478 test( '`.parent()`', function() {
479 var $children, $parent;
480
481 $parent = $( "#qunit-fixture > .parent" );
482 $children = $parent.find( ".child" );
483
484 // double parent
485 equal( $children.parent()[0], $parent[0] );
486 equal( $children.parent()[1], $parent[0] );
487
488 // default to document element
489 // NOTE: this behavior is to match the jQuery semantics
490 equal( $( "html" ).parent()[0], document );
491
492 $children.remove();
493
494 equal( $children.eq(0).parent().length, 0);
495 });
496
497 test( '`.parents()` ... with an s', function() {
498 var $children, $parent;
499
500 $parent = $( "#qunit-fixture > .parents" );
501 $children = $parent.find( ".child" );
502
503 // the shared parents of the first and second child
504 // +1 for the second parent which is unique
505 equal( $children.parents().length, 6);
506 equal( $children.parents()[0], $(".parents > .first-parent")[0] );
507 equal( $children.parents()[2], $("#qunit-fixture")[0] );
508 equal( $children.parents()[4], $("html")[0] );
509 equal( $children.parents()[5], $(".parents > .second-parent")[0] );
510 });
511
512 test( '`.prepend() adds a first child element', function() {
513 var tmp, $prepend = $fixture.find( ".prepend" );
514
515 tmp = $( "<div class='first'></div>" );
516 $prepend.append( tmp[0] );
517 $prepend.append( "<div class='second'></div>" );
518 $prepend.append( ".testel" );
519
520 equal( $prepend.find( ".first" )[0], tmp[0] );
521 equal( $prepend.find( ".second" ).length, 1 );
522 equal( $prepend.find( ".testel" ).length, 1 );
523 });
524
525 test( '`.prependTo() adds the all elements to the selected element` ', function() {
526 var tmp, $prepend = $fixture.find( ".prepend" );
527
528 tmp = $( "<div class='first'></div>" );
529
530 tmp.appendTo( "#qunit-fixture > .prepend" );
531
532 equal( $prepend.find( ".first" )[0], tmp[0] );
533 });
534
535 test( '`.prev()`', function() {
536 var $last, $all;
537
538 $last = $fixture.find( ".prev div.third" );
539 $all = $fixture.find( ".prev > div" );
540
541 equal( $last.prev().length, 1 );
542 equal( $last.prev()[0], $fixture.find(".prev .second")[0]);
543
544 // ordering correct according to jquery api
545 // http://api.jquery.com/prev/
546 equal( $all.prev().length, 2 );
547 equal( $all.prev()[0], $fixture.find(".prev .first")[0]);
548 equal( $all.prev()[1], $fixture.find(".prev .second")[0]);
549 equal( $all.prev()[2], undefined );
550 });
551
552 test( '`.prevAll()`', function() {
553 var $last;
554
555 $last = $fixture.find( ".prevall div.third" );
556
557 equal( $last.prevAll().length, 2 );
558
559 // ordering correct according to jquery api
560 // http://api.jquery.com/prevall/
561 equal( $last.prevAll()[0], $fixture.find(".prevall .second")[0]);
562 equal( $last.prevAll()[1], $fixture.find(".prevall .first")[0]);
563 equal( $last.prevAll()[2], undefined );
564 });
565
566 test( '`.prop()` returns undefined on empty set', function(){
567 var $element = $( '#this_will_not_match' );
568
569 equal( $element.prop( 'class' ), undefined );
570 });
571
572 test( '`.prop()` gets the attribute', function(){
573 var $element = $fixture.find( '.prop' );
574
575 equal( $element.prop( 'class' ), "prop" );
576 });
577
578 test( '`.prop()` sets the attribute', function(){
579 var $element = $fixture.find( '.prop' );
580
581 equal( $element.prop( 'class', "bar" )[0].className, "bar" );
582 });
583
584 test( '`.remove()`', function(){
585 var $el, $fixture;
586
587 $fixture = shoestring( '#qunit-fixture' );
588 $fixture.html( '<div id="el"></div>' );
589 $el = $( "#el" );
590
591 equal( $fixture.children().length, 1 );
592 $el.remove();
593
594 equal( $fixture.children().length, 0 );
595 });
596
597 test( '`.remove()` on unattached nodes', function(){
598 var $el;
599 $el = $( document.createElement( "div" ) );
600
601 $el.remove();
602 ok( true );
603 });
604
605 // here to test for ie8
606 test( '`.removeAttr()`', function() {
607 var $removeAttr = $fixture.find( ".remove-attr" );
608
609 equal( $removeAttr.attr( "data-foo" ), "bar" );
610 $removeAttr.removeAttr( "data-foo" );
611 equal( $removeAttr.attr( "data-foo" ), undefined );
612 });
613
614 test( '`.removeClass()` removes the class', function() {
615 var $removeClass = $fixture.find( ".remove-class" );
616
617 ok( $removeClass.is( ".foo" ) );
618 $removeClass.removeClass( "foo" );
619 ok( !$removeClass.is( ".foo" ) );
620 });
621
622 test( '`.removeClass()` leaves no extra whitespace', function() {
623 var $removeClass = $fixture.find( ".remove-class" );
624
625 $removeClass.addClass( "foo" );
626 $removeClass.removeClass( "foo" );
627 $removeClass.addClass( "foo" );
628 $removeClass.removeClass( "foo" );
629
630 equal( $removeClass[0].className, "remove-class" );
631 });
632
633 test( '`.removeProp()`', function() {
634 var $removeProp = $fixture.find( ".remove-prop" );
635
636 equal( $removeProp.attr( "class" ), "remove-prop" );
637 $removeProp.removeProp( "class" );
638
639 // NOTE this is bullshit, unquoted undefined works in everything but phantom
640 equal( $removeProp.attr( "class"), "undefined" );
641 });
642
643 test( '`.replaceWith()`', function() {
644 var $replaceWith = $fixture.find( ".replace-with" );
645
646 equal( $fixture.find( ".replace-with" ).length, 1 );
647
648 var old = $replaceWith.replaceWith( "<div class='replacement'></div>" );
649
650 equal( $fixture.find( ".replace-with" ).length, 0 );
651 equal( $fixture.find( ".replacement" ).length, 1 );
652 ok( old[0].className === "replace-with", "Returned element should be the original element copied" );
653 });
654
655 test( '`.replaceWith()` with multiple pieces', function() {
656 var $replaceWith = $fixture.find( ".replace-with-multiple" );
657
658 equal( $fixture.find( ".replace-with-multiple" ).length, 1 );
659
660 var old = $replaceWith.replaceWith( "<div class='replacement1'></div><div class='replacement2'></div>" );
661
662 equal( $fixture.find( ".replace-with-multiple" ).length, 0 );
663 equal( $fixture.find( ".replacement1" ).length, 1 );
664 equal( $fixture.find( ".replacement2" ).length, 1 );
665 ok( old[0].className === "replace-with-multiple", "Returned element should be the original element copied" );
666
667 $fixture.children().each(function(i) {
668 if( shoestring( this ).is( '.replacement1' ) ){
669 equal( $fixture.children()[i+1].className, "replacement2", "Elements should be in order" );
670 }
671 });
672 });
673
674 test( '`.replaceWith()` with no dom piece/missing parentNode', function() {
675 var $replaceWith = $( "<div class='replace-missing'></div>" );
676
677 equal( $replaceWith.length, 1 );
678
679 var old = $replaceWith.replaceWith( "<div class='replace-it'></div>" );
680
681 equal( $fixture.find( ".replace-it" ).length, 0 );
682 ok( old[0].className === "replace-missing", "Returned element should be the original element copied" );
683
684 });
685
686 // TODO make this suck less
687 test( '`.serialize()`', function() {
688 var data, input, type, $serialize = $fixture.find( ".serialize" );
689
690 for( var i = 0; i < shoestring.inputTypes.length; i++ ) {
691 type = shoestring.inputTypes[i];
692 input = "<input type='" + type + "'" +
693 "name='" + type + "'" +
694 "value='" + type + "'></input>";
695
696 $serialize.append( input );
697 }
698
699 data = $serialize.serialize();
700
701 for( var val in data ) {
702 ok( data[ val ] || data[ val ] === "" );
703 }
704 });
705
706 test( '`.siblings()`', function() {
707 var $fixture = shoestring( '#qunit-fixture' );
708 $fixture.html( '<div></div><div id="sibling"></div><div></div>' );
709
710 strictEqual( $( '#imaginary_element' ).siblings().length, 0, '.siblings runs on an empty set.' );
711 equal( $( '#sibling' ).siblings().length, 2, '.siblings returns non-empty set.' );
712 });
713
714 test( '`.text()` returns content properly', function(){
715 var container = $( "<div class='text-test'><div class='demo-box'>Demonstration Box</div><ul><li>list item 1</li><li>list <strong>item</strong> 2</li></ul></div></div>" );
716 var content = "Demonstration Boxlist item 1list item 2";
717
718 equal( container.text(), content, "should return nested text properly" );
719 });
720
721 test( '`.val()` returns correct value of element', function(){
722 var value = "happy";
723 var input = document.createElement( "input" );
724 input.type = "text";
725 input.value = value;
726
727 equal( $( input ).val(), value, ".val should return the equivalent of the input's value" );
728 });
729
730 test( '`.val()` returns correct value of select element', function(){
731 var select = document.createElement( "select" );
732 var option1 = document.createElement( "option" );
733 var option2 = document.createElement( "option" );
734
735 option1.value = "1";
736 option2.value = "2";
737
738 option2.selected = "selected";
739
740 select.appendChild( option1 );
741 select.appendChild( option2 );
742
743 equal( $( select ).val(), "2", ".val should return the equivalent of the select's selected option's value" );
744 });
745
746 test( '`.val()` returns correct value of select element', function(){
747 var select = document.createElement( "select" );
748 var option1 = document.createElement( "option" );
749 var option2 = document.createElement( "option" );
750
751 option1.value = "1";
752 option2.value = "2";
753
754
755 select.appendChild( option1 );
756 select.appendChild( option2 );
757
758 select.selectedIndex = -1;
759
760 equal( $( select ).val(), "", ".val should return empty string if nothing is selected" );
761 });
762
763 test( '`$( input ).val(value)` inserts value into input', function(){
764 var value = "happy";
765 var input = document.createElement( "input" );
766 input.type = "text";
767 $( input ).val( value );
768
769 equal( input.value, value, ".val should be the equivalent of setting the input's value" );
770 });
771
772 test( '`$( select ).val(value)` selects the option that matches the value', function(){
773 var select = document.createElement( "select" );
774 var option1 = document.createElement( "option" );
775 var option2 = document.createElement( "option" );
776 var option3 = document.createElement( "option" );
777
778 option1.value = "1";
779 option2.value = "2";
780 option3.value = "3";
781
782 option2.selected = "selected";
783
784 select.appendChild( option1 );
785 select.appendChild( option2 );
786 select.appendChild( option3 );
787
788 $( select ).val( "3" );
789
790
791 equal( $( select ).val(), "3", ".val should set the correct option" );
792 });
793
794 test('`.width()`', function() {
795 var $width = $fixture.find( ".width" );
796
797 // returns the value without param
798 equal( $width.width(), 200 );
799
800 // works with integers
801 $width.width( 300 );
802 equal( $width.width(), 300 );
803
804 // works with strings
805 $width.width( "400px" );
806 equal( $width.width(), 400 );
807 });
808
809 test('`.wrapInner()`', function() {
810 var $wrapInner = $fixture.find( ".wrap-inner" );
811
812 $wrapInner.wrapInner( "<div class='wrapper'></div>" );
813 equal( $wrapInner.find( ".wrapper > .inner" ).length, 1 );
814 equal( $wrapInner.find( ".wrapper" ).length, 1 );
815 });
816
817 module( 'events', config );
818
819 asyncTest( '`.bind()` and `.trigger()`', function() {
820 expect( 2 );
821
822 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
823
824 $( "#el" ).bind( "click", function( e ) {
825 ok( true, 'event callback should execute.' );
826 ok( e.target, 'event.target should exist.' );
827 start();
828 }).trigger( "click" );
829 });
830
831 test( '`.trigger("click")` checks a checkbox', function() {
832 expect( 2 );
833 shoestring( '#qunit-fixture' ).html( '<input id="cbx" type="checkbox" />' );
834
835 ok( !$( "#cbx" )[0].checked, "Checkbox shouldn't be checked" );
836 $( "#cbx" ).trigger( "click" );
837 ok( !!$( "#cbx" )[0].checked, "Checkbox should be checked" );
838 });
839
840 asyncTest( "custom event bindings get the right target", function() {
841 expect( 1 );
842
843 var $div = $fixture.find( "div" ).first();
844
845 $fixture.one( "foo", function( event ) {
846 equal( $div[0], event.target );
847 start();
848 });
849
850 $div.trigger( "foo" );
851 });
852
853 asyncTest( "custom event bindings get the right context (`this`)", function() {
854 expect( 1 );
855
856 var $div = $fixture.find( "div" ).first();
857
858 $fixture.one( "foo", function( event ) {
859 equal( this, $fixture[0] );
860 start();
861 });
862
863 $div.trigger( "foo" );
864 });
865
866 asyncTest( "`document` bindings get events triggered on `documentElement` children", function() {
867 expect( 1 );
868
869 $(document).one( "foo", function() {
870 ok( true );
871 start();
872 });
873
874 $fixture.trigger( "foo" );
875 });
876
877 asyncTest( "`document` bindings get events triggered on `document`", function() {
878 expect( 1 );
879
880 $(document).one( "foo", function() {
881 ok( true );
882 start();
883 });
884
885 $( document ).trigger( "foo" );
886 });
887
888 asyncTest( 'DOM Event `.bind()` and `.trigger()` with arguments', function() {
889 expect( 1 );
890
891 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
892
893 $( "#el" ).bind( "click", function( e, myArgument ) {
894 equal( myArgument, "Argument", 'a custom argument should exist.' );
895 start();
896 }).trigger( "click", [ "Argument" ] );
897 });
898
899 asyncTest( 'Custom Event `.bind()` and `.trigger()` with arguments', function() {
900 expect( 1 );
901
902 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
903
904 $( "#el" ).bind( "myCustomEvent", function( e, myArgument ) {
905 equal( myArgument, "Argument", 'a custom argument should exist.' );
906 start();
907 }).trigger( "myCustomEvent", [ "Argument" ] );
908 });
909
910 asyncTest( '`.bind()` and `.trigger()` with data', function() {
911 expect( 2 );
912
913 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
914
915 $( "#el" ).bind( "click", { key: "test-value" }, function( e ) {
916 ok( true, 'event callback should execute.' );
917 equal( e.data.key, "test-value", "Data should be present on event object" );
918 start();
919 }).trigger( "click" );
920 });
921
922 asyncTest( '`.on()` and click event bubbles to parent', function() {
923 expect( 1 );
924
925 shoestring( '#qunit-fixture' ).html( '<div id="parent"><div id="child"></div></div>' );
926
927 $( '#parent' ).on( "click", function() {
928 ok( true, 'event callback should execute.' );
929 start();
930 });
931
932 $( '#child' ).trigger( "click" );
933 });
934
935 asyncTest( '`.bind()` and `.trigger()` with custom events', function() {
936 expect( 1 );
937
938 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
939
940 $( "#el" ).bind( "aCustomEvent", function() {
941 ok( true, 'event callback should execute.' );
942 start();
943 }).trigger( "aCustomEvent" );
944
945 $( "#el" ).unbind( "aCustomEvent" );
946 });
947
948 asyncTest( '`.bind()` and `.trigger()` with custom events and data', function() {
949 expect( 2 );
950
951 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
952
953 $( "#el" ).bind( "aCustomEvent", { key: "custom" }, function(e) {
954 ok( true, 'event callback should execute.' );
955 equal( e.data.key, "custom" );
956 start();
957 }).trigger( "aCustomEvent" );
958
959 $( "#el" ).unbind( "aCustomEvent" );
960 });
961
962 asyncTest( '`.bind()` doesn’t execute callback without `.trigger()` with custom events', function() {
963 expect( 1 );
964
965 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
966
967 $( "#el" ).bind( "aCustomEvent", function() {
968 ok( false, "Should not execute without being triggered." );
969 }).bind( "anotherCustomEvent", function() {
970 ok( false, "Should not execute without being triggered." );
971 });
972
973 setTimeout(function() {
974 ok( true );
975
976 $( "#el" ).unbind( "aCustomEvent anotherCustomEvent" );
977
978 start();
979 }, 30);
980 });
981
982 asyncTest( '`.on()` and custom events bubble to parent', function() {
983 expect( 1 );
984
985 shoestring( '#qunit-fixture' ).html( '<div id="parent"><div id="child"></div></div>' );
986
987 $( '#parent' ).on( "aCustomEvent", function() {
988 ok( true, 'event callback should execute.' );
989
990 start();
991 });
992
993 $( '#child' ).trigger( "aCustomEvent" );
994 $( "#parent" ).unbind( "aCustomEvent" );
995 });
996
997 asyncTest( '`.bind()` and `.trigger()` with multiple of the same event on a single element', function() {
998 expect( 3 );
999 var counter = 0;
1000
1001 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1002
1003 $( "#el" ).bind( "click", function() {
1004 counter++;
1005 equal( counter, 1, 'event callback should execute first.' );
1006 }).bind( "click", function() {
1007 counter++;
1008 equal( counter, 2, 'event callback should execute second.' );
1009 }).bind( "click", function() {
1010 counter++;
1011 equal( counter, 3, 'event callback should execute third.' );
1012 start();
1013 }).trigger( "click" );
1014 });
1015
1016 asyncTest( '`.bind()` and `.trigger()` with multiple of the same event on a single element, bubbles to parent', function() {
1017 expect( 3 );
1018 var counter = 0;
1019
1020 shoestring( '#qunit-fixture' ).html( '<div id="parent"><div id="child"></div></div>' );
1021
1022 $( "#parent" ).bind( "click", function() {
1023 counter++;
1024 equal( counter, 1, 'event callback should execute first.' );
1025 }).bind( "click", function() {
1026 counter++;
1027 equal( counter, 2, 'event callback should execute second.' );
1028 }).bind( "click", function() {
1029 counter++;
1030 equal( counter, 3, 'event callback should execute third.' );
1031 start();
1032 });
1033
1034 $( "#child" ).trigger( "click" );
1035 });
1036
1037 asyncTest( '`.bind()` and `.trigger()` with multiple of the same event on different elements', function() {
1038 expect( 2 );
1039 var counter = 0;
1040
1041 shoestring( '#qunit-fixture' ).html( '<div id="el1"></div><div id="el2"></div>' );
1042
1043 $( "#el1" ).bind( "click", function() {
1044 counter++;
1045 equal( counter, 1, 'event callback should execute first.' );
1046 });
1047 $( "#el2" ).bind( "click", function() {
1048 counter++;
1049 equal( counter, 2, 'event callback should execute second.' );
1050 start();
1051 });
1052 $( "#el1" ).trigger( "click" );
1053 $( "#el2" ).trigger( "click" );
1054 });
1055
1056 asyncTest( '`.bind()` and `.trigger()` with multiple of the same custom event on a single element', function() {
1057 expect( 4 );
1058 var counter = 0;
1059
1060 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1061
1062 $( "#el" ).bind( "aCustomEvent", function() {
1063 counter++;
1064 equal( counter, 1, 'event callback should execute first.' );
1065 }).bind( "aCustomEvent", function() {
1066 counter++;
1067 equal( counter, 2, 'event callback should execute second.' );
1068 }).bind( "aCustomEvent", function() {
1069 counter++;
1070 equal( counter, 3, 'event callback should execute third.' );
1071 }).bind( "aCustomEvent", function() {
1072 counter++;
1073 equal( counter, 4, 'event callback should execute fourth.' );
1074 start();
1075 }).trigger( "aCustomEvent" );
1076
1077 $( "#el" ).unbind( "aCustomEvent" );
1078 });
1079
1080 asyncTest( '`.bind()` and `.trigger()` with multiple of the same custom event on a single element, bubbles to parent', function() {
1081 expect( 2 );
1082 var counter = 0;
1083
1084 shoestring( '#qunit-fixture' ).html( '<div id="parent"><div id="child"></div></div>' );
1085
1086 $( "#parent" ).bind( "aCustomEvent", function() {
1087 counter++;
1088 equal( counter, 1, 'event callback should execute first.' );
1089 }).bind( "aCustomEvent", function() {
1090 counter++;
1091 equal( counter, 2, 'event callback should execute second.' );
1092 start();
1093 });
1094
1095 $( "#child" ).trigger( "aCustomEvent" );
1096
1097 $( "#parent" ).unbind( "aCustomEvent" );
1098 });
1099
1100 asyncTest( '`.bind()` and `.trigger()` with multiple of the same custom event on different elements', function() {
1101 expect( 2 );
1102
1103 var counter = 0;
1104
1105 shoestring( '#qunit-fixture' ).html( '<div id="el1"></div><div id="el2"></div>' );
1106
1107 $( "#el1" ).bind( "aCustomEvent", function() {
1108 counter++;
1109 equal( counter, 1, 'event callback should execute first.' );
1110 });
1111 $( "#el2" ).bind( "aCustomEvent", function() {
1112 counter++;
1113 equal( counter, 2, 'event callback should execute second.' );
1114 start();
1115 });
1116 $( "#el1" ).trigger( "aCustomEvent" );
1117 $( "#el2" ).trigger( "aCustomEvent" );
1118
1119 $( "#el1" ).unbind( "aCustomEvent" );
1120 $( "#el2" ).unbind( "aCustomEvent" );
1121 });
1122
1123 asyncTest( '`.bind()` should not execute without trigger', function() {
1124 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1125
1126 $( '#el' )
1127 .bind( "dragmove.carousel", function( e, data ){
1128 ok( false, "Should not execute without being triggered.");
1129 });
1130
1131 setTimeout(function() {
1132 ok( true );
1133
1134 $( "#el" ).unbind( "dragmove.carousel" );
1135
1136 start();
1137 }, 30);
1138 });
1139
1140 asyncTest( '`.unbind("click", function)`', function() {
1141 expect( 1 );
1142 var counter = 0;
1143
1144 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1145 var f = function() {
1146 counter++;
1147 };
1148
1149 $( "#el" ).bind( "click", f )
1150 .trigger( "click" )
1151 .unbind( "click", f )
1152 .trigger( "click" );
1153
1154 setTimeout(function() {
1155 equal( counter, 1, "callback should have fired once." );
1156 start();
1157 }, 30);
1158 });
1159
1160 asyncTest( '`.unbind("mouseup mousedown", function) multiple dom events`', function() {
1161 expect( 1 );
1162 var counter = 0;
1163
1164 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1165 var f = function() {
1166 counter++;
1167 };
1168
1169 $( "#el" ).bind( "mouseup", f )
1170 .bind( "mousedown", f )
1171 .unbind( "mouseup mousedown", f )
1172 .trigger( "mouseup" )
1173 .trigger( "mousedown" );
1174
1175 setTimeout(function() {
1176 strictEqual( counter, 0, "callback should not have fired." );
1177 start();
1178 }, 30);
1179 });
1180
1181 asyncTest( '`.unbind("aCustomEvent anotherCustomEvent", function)`', function() {
1182 expect( 1 );
1183 var counter = 0;
1184
1185 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1186 var f = function() {
1187 counter++;
1188 };
1189
1190 $( "#el" ).bind( "aCustomEvent", f )
1191 .bind( "anotherCustomEvent", f )
1192 .unbind( "aCustomEvent anotherCustomEvent", f )
1193 .trigger( "aCustomEvent" )
1194 .trigger( "anotherCustomEvent" );
1195
1196 setTimeout(function() {
1197 strictEqual( counter, 0, "callback should not have fired." );
1198 start();
1199 }, 30);
1200 });
1201
1202 asyncTest( '`.unbind("click")`', function() {
1203 expect( 1 );
1204 var counter = 0;
1205
1206 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1207 var f = function() {
1208 counter++;
1209 };
1210
1211 $( "#el" ).bind( "click", f )
1212 .trigger( "click" )
1213 .unbind( "click" )
1214 .trigger( "click" );
1215
1216 setTimeout(function() {
1217 equal( counter, 1, "callback should have fired once." );
1218 start();
1219 }, 30);
1220 });
1221
1222 asyncTest( '`.unbind("aCustomEvent", function)`', function() {
1223 expect( 1 );
1224 var counter = 0;
1225
1226 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1227 var f = function() {
1228 counter++;
1229 };
1230
1231 $( "#el" ).bind( "aCustomEvent", f )
1232 .trigger( "aCustomEvent" )
1233 .unbind( "aCustomEvent", f )
1234 .trigger( "aCustomEvent" );
1235
1236 setTimeout(function() {
1237 equal( counter, 1, "callback should have fired once." );
1238 start();
1239 }, 30);
1240 });
1241
1242 asyncTest( '`.unbind("aCustomEvent")`', function() {
1243 expect( 1 );
1244 var counter = 0;
1245
1246 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1247 var f = function() {
1248 counter++;
1249 };
1250
1251 $( "#el" ).bind( "aCustomEvent", f )
1252 .trigger( "aCustomEvent" )
1253 .unbind( "aCustomEvent" )
1254 .trigger( "aCustomEvent" );
1255
1256 setTimeout(function() {
1257 equal( counter, 1, "callback should have fired once." );
1258 start();
1259 }, 30);
1260 });
1261
1262 asyncTest( '`.unbind()` all', function() {
1263 expect( 1 );
1264 var counter = 0;
1265
1266 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1267 var f = function() {
1268 counter++;
1269 };
1270
1271 $( "#el" ).bind( "aCustomEvent", f )
1272 .trigger( "aCustomEvent" )
1273 .unbind()
1274 .trigger( "aCustomEvent" );
1275
1276 setTimeout(function() {
1277 equal( counter, 1, "callback should have fired once." );
1278 start();
1279 }, 30);
1280 });
1281
1282 asyncTest( '`.unbind("aCustomEvent", function)` in a `.bind()` callback', function() {
1283 expect( 1 );
1284 var counter = 0;
1285
1286 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1287 var f = function() {
1288 counter++;
1289 $( this ).unbind( "aCustomEvent", f );
1290 };
1291
1292 $( "#el" ).bind( "aCustomEvent", f )
1293 .trigger( "aCustomEvent" )
1294 .trigger( "aCustomEvent" );
1295
1296 setTimeout(function() {
1297 equal( counter, 1, "callback should have fired once." );
1298 start();
1299 }, 30);
1300 });
1301
1302 asyncTest( '`.unbind("eventThatDoesntExist", function)` doesn\'t throw error, does nothing', function() {
1303 expect( 1 );
1304 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1305 $( "#el" ).unbind( "eventThatDoesntExist" );
1306 setTimeout(function() {
1307 ok( true, "No error thrown, nothing happened" );
1308 start();
1309 }, 30);
1310
1311 });
1312
1313 test( '`.one()` with multiple events (see #13)', function() {
1314 var $fixture = shoestring( '#qunit-fixture' ),
1315 triggerCount = 0,
1316 $el;
1317
1318 $fixture.html( '<div id="el"></div>' );
1319 $el = $( "#el" );
1320
1321 $el.one( "hover mousedown", function() {
1322 triggerCount++;
1323 });
1324
1325 $el.trigger( "hover" );
1326 $el.trigger( "mousedown" );
1327
1328 strictEqual( triggerCount, 1, 'only one event callback should execute.' );
1329 });
1330
1331 asyncTest( '`.one()` with multiple custom events', function() {
1332 expect( 1 );
1333 var $fixture = shoestring( '#qunit-fixture' ),
1334 triggerCount = 0,
1335 $el;
1336
1337 $fixture.html( '<div id="el"></div>' );
1338 $el = $( "#el" );
1339
1340 $el.one( "aCustomEvent anotherCustomEvent yetAnotherCustomEvent", function() {
1341 triggerCount++;
1342 });
1343
1344 $el.trigger( "aCustomEvent" );
1345 $el.trigger( "anotherCustomEvent" );
1346
1347 window.setTimeout(function() {
1348 strictEqual( triggerCount, 1, 'only one event callback should execute.' );
1349 start();
1350 }, 15);
1351 });
1352
1353 asyncTest( '`.bind()` bubbling event order', function() {
1354 expect( 2 );
1355
1356 var counter = 0;
1357
1358 shoestring( '#qunit-fixture' ).html( '<div id="parent"><div id="child"></div></div>' );
1359
1360 $( '#parent' ).bind( "click", function() {
1361 counter++;
1362 equal( counter, 2, 'event callback should execute second.' );
1363 });
1364
1365 $( '#child' ).bind( "click", function() {
1366 counter++;
1367 equal( counter, 1, 'event callback should execute first.' );
1368 }).trigger( "click" );
1369
1370 setTimeout(function() {
1371 start();
1372 }, 15);
1373 });
1374
1375
1376 asyncTest( '`.bind()` bubbling custom event order (parent first)', function() {
1377 expect( 2 );
1378
1379 var counter = 0;
1380
1381 shoestring( '#qunit-fixture' ).html( '<div id="parent"><div id="child"></div></div>' );
1382
1383 $( '#parent' ).bind( "aCustomEvent", function() {
1384 counter++;
1385 equal( counter, 2, 'parent event callback should execute second.' );
1386 });
1387
1388 $( '#child' ).bind( "aCustomEvent", function() {
1389 counter++;
1390 equal( counter, 1, 'child event callback should execute first.' );
1391 }).trigger( "aCustomEvent" );
1392
1393 setTimeout(function() {
1394 start();
1395 }, 15);
1396 });
1397
1398 asyncTest( '`.bind()` bubbling custom event order (child first)', function() {
1399 expect( 2 );
1400
1401 var counter = 0;
1402
1403 shoestring( '#qunit-fixture' ).html( '<div id="parent"><div id="child"></div></div>' );
1404
1405 $( '#child' ).bind( "aCustomEvent", function() {
1406 counter++;
1407 equal( counter, 1, 'child event callback should execute first.' );
1408 });
1409
1410 $( '#parent' ).bind( "aCustomEvent", function() {
1411 counter++;
1412 equal( counter, 2, 'parent event callback should execute second.' );
1413 });
1414
1415 $( '#child' ).trigger( "aCustomEvent" );
1416
1417 setTimeout(function() {
1418 start();
1419 }, 15);
1420 });
1421
1422 asyncTest( 'trigger click executes a native click', function() {
1423 var hash = location.hash;
1424
1425 expect( 1 );
1426 shoestring( '#qunit-fixture' ).html( '<a href="#test" id="el">Link</a>' );
1427
1428 $( '#el' ).trigger( "click" );
1429
1430 setTimeout(function() {
1431 notEqual( location.hash, hash, 'hash should have changed, link should have been clicked.' );
1432
1433 location.hash = "";
1434 start();
1435 }, 15);
1436 });
1437
1438 asyncTest( 'preventDefault on dom event', function() {
1439 var hash = location.hash;
1440
1441 expect( 1 );
1442 shoestring( '#qunit-fixture' ).html( '<a href="#test" id="el">Link</a>' );
1443
1444 $( '#el' ).bind( "click", function( e ) {
1445 e.preventDefault();
1446 }).trigger( "click" );
1447
1448 setTimeout(function() {
1449 equal( location.hash, hash, 'hash should not have changed, event should preventDefault' );
1450
1451 location.hash = "";
1452 start();
1453 }, 15);
1454 });
1455
1456 asyncTest( '`.isDefaultPrevented()`', function(){
1457 expect(1);
1458 var fn = function(e){
1459 e.preventDefault();
1460 ok(e.isDefaultPrevented());
1461 };
1462
1463 shoestring( '#qunit-fixture' ).html( '<div id="preventdefault"></div>' );
1464
1465 $( "#preventdefault" ).bind( "click", fn )
1466 .trigger( "click" );
1467
1468 setTimeout(function() {
1469 start();
1470 }, 15);
1471
1472 });
1473
1474 asyncTest( '`.isDefaultPrevented()` without `.preventDefault()`', function(){
1475 expect(1);
1476 var fn = function(e){
1477 ok(!e.isDefaultPrevented());
1478 };
1479
1480 shoestring( '#qunit-fixture' ).html( '<div id="preventdefault2"></div>' );
1481
1482 $( "#preventdefault2" ).bind( "click", fn )
1483 .trigger( "click" );
1484
1485 setTimeout(function() {
1486 start();
1487 }, 15);
1488
1489 });
1490
1491 asyncTest( 'return false prevents propagation', function() {
1492 expect( 1 ) ;
1493
1494 shoestring( '#qunit-fixture' ).html( '<div id="parent"><div id="child"></div></div>' );
1495
1496 $( "#child" ).one( "click", function() {
1497 ok( true, "one runs" );
1498
1499 setTimeout(function() {
1500 start();
1501 });
1502
1503 return false;
1504 });
1505
1506 $( "#parent" ).one( "click", function() {
1507 ok( false, "never runs" );
1508 });
1509
1510 $( "#child" ).trigger( "click" );
1511 });
1512
1513 asyncTest( 'stopPropagation prevents propagation', function() {
1514 expect( 1 ) ;
1515
1516 shoestring( '#qunit-fixture' ).html( '<div id="parent"><div id="child"></div></div>' );
1517
1518 $( "#child" ).one( "click", function(e) {
1519 e.stopPropagation();
1520 ok( true, "one runs" );
1521
1522 setTimeout(function() {
1523 start();
1524 });
1525
1526 });
1527
1528 $( "#parent" ).one( "click", function() {
1529 ok( false, "never runs" );
1530 });
1531
1532 $( "#child" ).trigger( "click" );
1533 });
1534
1535 asyncTest( 'no stopPropagation allows propagation', function() {
1536 expect( 2 ) ;
1537
1538 shoestring( '#qunit-fixture' ).html( '<div id="parent"><div id="child"></div></div>' );
1539
1540 $( "#child" ).one( "click", function(e) {
1541 ok( true, "one runs" );
1542
1543 setTimeout(function() {
1544 start();
1545 });
1546
1547 });
1548
1549 $( "#parent" ).one( "click", function() {
1550 ok( true, "also runs" );
1551 });
1552
1553 $( "#child" ).trigger( "click" );
1554 });
1555
1556 asyncTest( 'Custom Events: namespaced bind, namespaced trigger', function() {
1557 expect( 2 );
1558
1559 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1560
1561 $( "#el" ).bind( "customEvent.myNamespace", function( e ) {
1562 ok( true, 'event callback should execute.' );
1563 ok( e.namespace, 'namespace property should exist.' );
1564 })
1565 .trigger( "customEvent.myNamespace" );
1566
1567 setTimeout(function() {
1568 start();
1569 }, 15);
1570 });
1571
1572 asyncTest( 'Custom Events: namespaced bind, unnamespaced trigger', function() {
1573 expect( 2 );
1574
1575 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1576
1577 $( "#el" ).bind( "customEvent.myNamespace", function( e ) {
1578 ok( true, 'event callback should execute.' );
1579 ok( !e.namespace, 'namespace property should not exist.' );
1580 })
1581 .trigger( "customEvent" );
1582
1583 setTimeout(function() {
1584 start();
1585 }, 15);
1586 });
1587
1588 asyncTest( 'DOM Events: namespaced bind, namespaced trigger', function() {
1589 expect( 2 );
1590
1591 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1592
1593 $( "#el" ).bind( "click.myNamespace", function( e ) {
1594 ok( true, 'event callback should execute.' );
1595 ok( e.namespace, 'namespace property should exist.' );
1596 })
1597 .trigger( "click.myNamespace" );
1598
1599 setTimeout(function() {
1600 start();
1601 }, 15);
1602 });
1603
1604 asyncTest( 'DOM Events: namespaced bind, unnamespaced trigger', function() {
1605 expect( 2 );
1606
1607 shoestring( '#qunit-fixture' ).html( '<div id="el2"></div>' );
1608
1609 $( "#el2" ).bind( "click.myNamespace", function( e ) {
1610 ok( true, 'event callback should execute.' );
1611 ok( !e.namespace, 'namespace property should not exist.' );
1612 })
1613 .trigger( "click" );
1614
1615 setTimeout(function() {
1616 start();
1617 }, 15);
1618 });
1619
1620 asyncTest( 'DOM Events: unnamespaced bind, namespaced trigger', function() {
1621 expect( 0 );
1622
1623 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1624
1625 $( "#el" ).bind( "click", function( e ) {
1626 ok( true, 'event callback should not execute.' );
1627 }).trigger( "click.myNamespace" );
1628
1629 setTimeout(function() {
1630 start();
1631 }, 15);
1632 });
1633
1634 asyncTest( '`Custom Events: .bind("myCustomEvent.myNamespace") .unbind("myCustomEvent.myNamespace")`', function() {
1635 expect( 1 );
1636 var counter = 0;
1637
1638 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1639 var f = function() {
1640 counter++;
1641 };
1642
1643 $( "#el" ).bind( "myCustomEvent.myNamespace", f )
1644 .trigger( "myCustomEvent.myNamespace" )
1645 .unbind( "myCustomEvent.myNamespace" )
1646 .trigger( "myCustomEvent.myNamespace" );
1647
1648 setTimeout(function() {
1649 equal( counter, 1, "callback should have fired once." );
1650 start();
1651 }, 30);
1652 });
1653
1654 asyncTest( '`Custom Events: .bind("myCustomEvent.myNamespace") .unbind("myCustomEvent.myNamespace", function)`', function() {
1655 expect( 1 );
1656 var counter = 0;
1657
1658 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1659 var f = function() {
1660 counter++;
1661 };
1662
1663 $( "#el" ).bind( "myCustomEvent.myNamespace", f )
1664 .trigger( "myCustomEvent.myNamespace" )
1665 .unbind( "myCustomEvent.myNamespace", f )
1666 .trigger( "myCustomEvent.myNamespace" );
1667
1668 setTimeout(function() {
1669 equal( counter, 1, "callback should have fired once." );
1670 start();
1671 }, 30);
1672 });
1673
1674 asyncTest( '`Custom Events: .bind("myCustomEvent.myNamespace") .unbind("myCustomEvent")`', function() {
1675 expect( 1 );
1676 var counter = 0;
1677
1678 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1679 var f = function() {
1680 counter++;
1681 };
1682
1683 $( "#el" ).bind( "myCustomEvent.myNamespace", f )
1684 .trigger( "myCustomEvent.myNamespace" )
1685 .unbind( "myCustomEvent" )
1686 .trigger( "myCustomEvent.myNamespace" );
1687
1688 setTimeout(function() {
1689 equal( counter, 1, "callback should have fired once." );
1690 start();
1691 }, 30);
1692 });
1693
1694 asyncTest( '`Custom Events: .bind("myCustomEvent") .unbind("myCustomEvent.myNamespace", function)`', function() {
1695 expect( 1 );
1696 var counter = 0;
1697
1698 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1699 var f = function() {
1700 counter++;
1701 };
1702
1703 $( "#el" ).bind( "myCustomEvent", f )
1704 .trigger( "myCustomEvent" )
1705 .unbind( "myCustomEvent.myNamespace", f )
1706 .trigger( "myCustomEvent" );
1707
1708 setTimeout(function() {
1709 equal( counter, 2, "callback should fire twice. unbind should have not matched anything." );
1710 start();
1711 }, 30);
1712 });
1713
1714 asyncTest( '`DOM Events: .bind("click.myNamespace") .unbind("click.myNamespace")`', function() {
1715 expect( 1 );
1716 var counter = 0;
1717
1718 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1719 var f = function() {
1720 counter++;
1721 };
1722
1723 $( "#el" ).bind( "click.myNamespace", f )
1724 .trigger( "click.myNamespace" )
1725 .unbind( "click.myNamespace" )
1726 .trigger( "click.myNamespace" );
1727
1728 setTimeout(function() {
1729 equal( counter, 1, "callback should have fired once." );
1730 start();
1731 }, 30);
1732 });
1733
1734 asyncTest( '`DOM Events: .bind("click.myNamespace") .unbind("click.myNamespace", function)`', function() {
1735 expect( 1 );
1736 var counter = 0;
1737
1738 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1739 var f = function() {
1740 counter++;
1741 };
1742
1743 $( "#el" ).bind( "click.myNamespace", f )
1744 .trigger( "click.myNamespace" )
1745 .unbind( "click.myNamespace", f )
1746 .trigger( "click.myNamespace" );
1747
1748 setTimeout(function() {
1749 equal( counter, 1, "callback should have fired once." );
1750 start();
1751 }, 30);
1752 });
1753
1754 asyncTest( '`DOM Events: .bind("click.myNamespace") .unbind("click")`', function() {
1755 expect( 1 );
1756 var counter = 0;
1757
1758 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1759 var f = function() {
1760 counter++;
1761 };
1762
1763 $( "#el" ).bind( "click.myNamespace", f )
1764 .trigger( "click.myNamespace" )
1765 .unbind( "click" )
1766 .trigger( "click.myNamespace" );
1767
1768 setTimeout(function() {
1769 equal( counter, 1, "callback should have fired once." );
1770 start();
1771 }, 30);
1772 });
1773
1774 asyncTest( '`DOM Events: .bind("click") .unbind("click.myNamespace", function)`', function() {
1775 expect( 1 );
1776 var counter = 0;
1777
1778 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1779 var f = function() {
1780 counter++;
1781 };
1782
1783 $( "#el" ).bind( "click", f )
1784 .trigger( "click" )
1785 .unbind( "click.myNamespace", f )
1786 .trigger( "click" );
1787
1788 setTimeout(function() {
1789 equal( counter, 2, "callback should fire twice. unbind should have not matched anything." );
1790 start();
1791 }, 30);
1792 });
1793
1794 asyncTest( '`DOM Events: .unbind(".myNamespace")`', function() {
1795 expect( 1 );
1796 var counter = 0;
1797
1798 shoestring( '#qunit-fixture' ).html( '<div id="el"></div>' );
1799 var f = function() {
1800 counter++;
1801 };
1802
1803 $( "#el" ).bind( "click.myNamespace", f )
1804 .trigger( "click.myNamespace" )
1805 .unbind( ".myNamespace", f )
1806 .trigger( "click.myNamespace" );
1807
1808 setTimeout(function() {
1809 equal( counter, 1, "callback should fire once." );
1810 start();
1811 }, 30);
1812 });
1813
1814 if( window.JSON && 'localStorage' in window ) {
1815 module( "util", config );
1816
1817 test( "when a shoestring.fn method is called it gets tracked", function() {
1818 var tracked;
1819
1820 window.localStorage.setItem( shoestring.trackedMethodsKey, "{}" );
1821
1822 $fixture.find( "div" ).remove();
1823
1824 tracked = JSON.parse( window.localStorage.getItem(shoestring.trackedMethodsKey) );
1825
1826 ok( tracked.find );
1827 ok( tracked.remove );
1828 });
1829 }
1830
1831 module( 'ajax', config );
1832
1833 test( "ajax doesn't override default options", function() {
1834 equal( shoestring.ajax.settings.method, "GET" );
1835 shoestring.ajax( "foo", { method: "POST" } );
1836 equal( shoestring.ajax.settings.method, "GET" );
1837 });
1838
1839 var mockXHR = function() {
1840 var fakeXHR = sinon.useFakeXMLHttpRequest();
1841 var requests = sinon.requests = [];
1842
1843 fakeXHR.onCreate = function ( request ) {
1844 requests.push( request );
1845 };
1846
1847 return requests;
1848 };
1849
1850 test( ".ajax throws exception with data and url with params", function(){
1851 mockXHR();
1852
1853 throws(function() {
1854 shoestring.ajax( "/some/url?foo=bar", {
1855 data: { bar: 'baz' }
1856 });
1857 });
1858 });
1859
1860 test( ".ajax defaul headers", function(){
1861 var requests = mockXHR();
1862
1863 // call ajax method
1864 shoestring.ajax( "/some/url", { success: function() {} });
1865
1866 equal(requests[0].requestHeaders['X-Requested-With'], "XMLHttpRequest");
1867 });
1868
1869 test( ".ajax includes headers", function(){
1870 var requests = mockXHR();
1871
1872 // call ajax method
1873 shoestring.ajax( "/some/url", {
1874 data: { param1: "one", param2: "two" },
1875 headers: { foo: 'bar' },
1876 success: function() {}
1877 });
1878
1879 equal(requests[0].requestHeaders.foo, 'bar');
1880 });
1881
1882 test( ".ajax sends request with method GET and appends data elements to url", function(){
1883 var requests = mockXHR();
1884 var callback = sinon.spy();
1885
1886 // call ajax method
1887 shoestring.ajax( "/some/url", {
1888 data: { param1: "one", param2: "two" },
1889 success: callback
1890 });
1891
1892 // check that only one request is sent
1893 equal( sinon.requests.length, 1 );
1894 // check correct method is used
1895 equal( sinon.requests[0].method, "GET" );
1896 // check that parameter string was appended to url
1897 equal( sinon.requests[0].url, "/some/url?param1=one&param2=two" );
1898
1899 // mock response to test callback
1900 requests[0].respond( 200, { "Content-Type": "application/json" }, '{}' );
1901 // check that callback was called
1902 ok( callback.called );
1903 });
1904
1905 test( ".post sends request with method POST, send data in request body", function(){
1906 var requests = mockXHR();
1907
1908 var url = "/some/url";
1909 var callback = sinon.spy();
1910
1911 // call post method
1912 shoestring.post( url, { param1: "one", param2: "two" }, callback );
1913
1914 // check that only one request is sent
1915 equal( sinon.requests.length, 1 );
1916 // check correct method is used
1917 equal( sinon.requests[0].method, "POST" );
1918 // check that url has not been changed
1919 equal( sinon.requests[0].url, url );
1920 // check data elements are sent in request body
1921 equal( sinon.requests[0].requestBody, "param1=one&param2=two" );
1922 // check that only one request is sent
1923 ok( sinon.requests[0].requestHeaders['Content-type'].indexOf("application/x-www-form-urlencode") >= 0);
1924
1925 requests[0].respond( 200, { "Content-Type": "application/json" }, '[]' );
1926
1927 ok( callback.called );
1928 });
1929 })();