165 lines
		
	
	
		
			5.8 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			165 lines
		
	
	
		
			5.8 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
| $(function () {
 | |
| 
 | |
|     module('collapse')
 | |
| 
 | |
|       test('should provide no conflict', function () {
 | |
|         var collapse = $.fn.collapse.noConflict()
 | |
|         ok(!$.fn.collapse, 'collapse was set back to undefined (org value)')
 | |
|         $.fn.collapse = collapse
 | |
|       })
 | |
| 
 | |
|       test('should be defined on jquery object', function () {
 | |
|         ok($(document.body).collapse, 'collapse method is defined')
 | |
|       })
 | |
| 
 | |
|       test('should return element', function () {
 | |
|         ok($(document.body).collapse()[0] == document.body, 'document.body returned')
 | |
|       })
 | |
| 
 | |
|       test('should show a collapsed element', function () {
 | |
|         var el = $('<div class="collapse"></div>').collapse('show')
 | |
|         ok(el.hasClass('in'), 'has class in')
 | |
|         ok(/height/.test(el.attr('style')), 'has height set')
 | |
|       })
 | |
| 
 | |
|       test('should hide a collapsed element', function () {
 | |
|         var el = $('<div class="collapse"></div>').collapse('hide')
 | |
|         ok(!el.hasClass('in'), 'does not have class in')
 | |
|         ok(/height/.test(el.attr('style')), 'has height set')
 | |
|       })
 | |
| 
 | |
|       test('should not fire shown when show is prevented', function () {
 | |
|         $.support.transition = false
 | |
|         stop()
 | |
|         $('<div class="collapse"/>')
 | |
|           .on('show.bs.collapse', function (e) {
 | |
|             e.preventDefault();
 | |
|             ok(true);
 | |
|             start();
 | |
|           })
 | |
|           .on('shown.bs.collapse', function () {
 | |
|             ok(false);
 | |
|           })
 | |
|           .collapse('show')
 | |
|       })
 | |
| 
 | |
|       test('should reset style to auto after finishing opening collapse', function () {
 | |
|         $.support.transition = false
 | |
|         stop()
 | |
|         $('<div class="collapse" style="height: 0px"/>')
 | |
|           .on('show.bs.collapse', function () {
 | |
|             ok(this.style.height == '0px')
 | |
|           })
 | |
|           .on('shown.bs.collapse', function () {
 | |
|             ok(this.style.height == 'auto')
 | |
|             start()
 | |
|           })
 | |
|           .collapse('show')
 | |
|       })
 | |
| 
 | |
|       test('should add active class to target when collapse shown', function () {
 | |
|         $.support.transition = false
 | |
|         stop()
 | |
| 
 | |
|         var target = $('<a data-toggle="collapse" href="#test1"></a>')
 | |
|           .appendTo($('#qunit-fixture'))
 | |
| 
 | |
|         var collapsible = $('<div id="test1"></div>')
 | |
|           .appendTo($('#qunit-fixture'))
 | |
|           .on('show.bs.collapse', function () {
 | |
|             ok(!target.hasClass('collapsed'))
 | |
|             start()
 | |
|           })
 | |
| 
 | |
|         target.click()
 | |
|       })
 | |
| 
 | |
|       test('should remove active class to target when collapse hidden', function () {
 | |
|         $.support.transition = false
 | |
|         stop()
 | |
| 
 | |
|         var target = $('<a data-toggle="collapse" href="#test1"></a>')
 | |
|           .appendTo($('#qunit-fixture'))
 | |
| 
 | |
|         var collapsible = $('<div id="test1" class="in"></div>')
 | |
|           .appendTo($('#qunit-fixture'))
 | |
|           .on('hide.bs.collapse', function () {
 | |
|             ok(target.hasClass('collapsed'))
 | |
|             start()
 | |
|           })
 | |
| 
 | |
|         target.click()
 | |
|       })
 | |
| 
 | |
|       test('should remove active class from inactive accordion targets', function () {
 | |
|         $.support.transition = false
 | |
|         stop()
 | |
| 
 | |
|         var accordion = $('<div id="accordion"><div class="accordion-group"></div><div class="accordion-group"></div><div class="accordion-group"></div></div>')
 | |
|           .appendTo($('#qunit-fixture'))
 | |
| 
 | |
|         var target1 = $('<a data-toggle="collapse" href="#body1" data-parent="#accordion"></a>')
 | |
|           .appendTo(accordion.find('.accordion-group').eq(0))
 | |
| 
 | |
|         var collapsible1 = $('<div id="body1" class="in"></div>')
 | |
|           .appendTo(accordion.find('.accordion-group').eq(0))
 | |
| 
 | |
|         var target2 = $('<a class="collapsed" data-toggle="collapse" href="#body2" data-parent="#accordion"></a>')
 | |
|           .appendTo(accordion.find('.accordion-group').eq(1))
 | |
| 
 | |
|         var collapsible2 = $('<div id="body2"></div>')
 | |
|           .appendTo(accordion.find('.accordion-group').eq(1))
 | |
| 
 | |
|         var target3 = $('<a class="collapsed" data-toggle="collapse" href="#body3" data-parent="#accordion"></a>')
 | |
|           .appendTo(accordion.find('.accordion-group').eq(2))
 | |
| 
 | |
|         var collapsible3 = $('<div id="body3"></div>')
 | |
|           .appendTo(accordion.find('.accordion-group').eq(2))
 | |
|           .on('show.bs.collapse', function () {
 | |
|             ok(target1.hasClass('collapsed'))
 | |
|             ok(target2.hasClass('collapsed'))
 | |
|             ok(!target3.hasClass('collapsed'))
 | |
| 
 | |
|             start()
 | |
|           })
 | |
| 
 | |
|         target3.click()
 | |
|       })
 | |
| 
 | |
|       test('should allow dots in data-parent', function () {
 | |
|         $.support.transition = false
 | |
|         stop()
 | |
| 
 | |
|         var accordion = $('<div class="accordion"><div class="accordion-group"></div><div class="accordion-group"></div><div class="accordion-group"></div></div>')
 | |
|           .appendTo($('#qunit-fixture'))
 | |
| 
 | |
|         var target1 = $('<a data-toggle="collapse" href="#body1" data-parent=".accordion"></a>')
 | |
|           .appendTo(accordion.find('.accordion-group').eq(0))
 | |
| 
 | |
|         var collapsible1 = $('<div id="body1" class="in"></div>')
 | |
|           .appendTo(accordion.find('.accordion-group').eq(0))
 | |
| 
 | |
|         var target2 = $('<a class="collapsed" data-toggle="collapse" href="#body2" data-parent=".accordion"></a>')
 | |
|           .appendTo(accordion.find('.accordion-group').eq(1))
 | |
| 
 | |
|         var collapsible2 = $('<div id="body2"></div>')
 | |
|           .appendTo(accordion.find('.accordion-group').eq(1))
 | |
| 
 | |
|         var target3 = $('<a class="collapsed" data-toggle="collapse" href="#body3" data-parent=".accordion"></a>')
 | |
|           .appendTo(accordion.find('.accordion-group').eq(2))
 | |
| 
 | |
|         var collapsible3 = $('<div id="body3"></div>')
 | |
|           .appendTo(accordion.find('.accordion-group').eq(2))
 | |
|           .on('show.bs.collapse', function () {
 | |
|             ok(target1.hasClass('collapsed'))
 | |
|             ok(target2.hasClass('collapsed'))
 | |
|             ok(!target3.hasClass('collapsed'))
 | |
| 
 | |
|             start()
 | |
|           })
 | |
| 
 | |
|         target3.click()
 | |
|       })
 | |
| 
 | |
| })
 |