mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-16 02:24:19 +02:00
Code Issues Releases Wiki Activity

update JS unit tests to future-proof QUnit 1.16.0 API

Browse Source 
[skip validator]
This commit is contained in:
Chris Rebert
2015-01-20 19:40:50 -08:00
parent a8139a0392
commit b56d97f210
11 changed files with 226 additions and 226 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
js/tests/unit/affix.js
View File

@@ -35,8 +35,8 @@ $(function () {
ok(!$affix.hasClass('affix'), 'affix class was not added') ok(!$affix.hasClass('affix'), 'affix class was not added')
}) })
test('should trigger affixed event after affix', function () { test('should trigger affixed event after affix', function (assert) {
stop() var done = assert.async()
var templateHTML = '<div id="affixTarget">' var templateHTML = '<div id="affixTarget">'
+ '<ul>' + '<ul>'
@@ -57,7 +57,7 @@ $(function () {
}).on('affixed.bs.affix', function () { }).on('affixed.bs.affix', function () {
ok(true, 'affixed event fired') ok(true, 'affixed event fired')
$('#affixTarget, #affixAfter').remove() $('#affixTarget, #affixAfter').remove()
start() done()
}) })
setTimeout(function () { setTimeout(function () {
@@ -69,8 +69,8 @@ $(function () {
}, 0) }, 0)
}) })
test('should affix-top when scrolling up to offset when parent has padding', function () { test('should affix-top when scrolling up to offset when parent has padding', function (assert) {
stop() var done = assert.async()
var templateHTML = '<div id="padding-offset" style="padding-top: 20px;">' var templateHTML = '<div id="padding-offset" style="padding-top: 20px;">'
+ '<div id="affixTopTarget">' + '<div id="affixTopTarget">'
@@ -87,7 +87,7 @@ $(function () {
.on('affixed-top.bs.affix', function () { .on('affixed-top.bs.affix', function () {
ok($('#affixTopTarget').hasClass('affix-top'), 'affix-top class applied') ok($('#affixTopTarget').hasClass('affix-top'), 'affix-top class applied')
$('#padding-offset').remove() $('#padding-offset').remove()
start() done()
}) })
setTimeout(function () { setTimeout(function () {

6
js/tests/unit/alert.js
View File

@@ -55,13 +55,13 @@ $(function () {
equal($('#qunit-fixture').find('.alert').length, 0, 'element removed from dom') equal($('#qunit-fixture').find('.alert').length, 0, 'element removed from dom')
}) })
test('should not fire closed when close is prevented', function () { test('should not fire closed when close is prevented', function (assert) {
stop() var done = assert.async()
$('<div class="alert"/>') $('<div class="alert"/>')
.on('close.bs.alert', function (e) { .on('close.bs.alert', function (e) {
e.preventDefault() e.preventDefault()
ok(true, 'close event fired') ok(true, 'close event fired')
start() done()
}) })
.on('closed.bs.alert', function () { .on('closed.bs.alert', function () {
ok(false, 'closed event fired') ok(false, 'closed event fired')

26
js/tests/unit/button.js
View File

@@ -29,57 +29,57 @@ $(function () {
strictEqual($button[0], $el[0], 'collection contains element') strictEqual($button[0], $el[0], 'collection contains element')
}) })
test('should return set state to loading', function () { test('should return set state to loading', function (assert) {
var $btn = $('<button class="btn" data-loading-text="fat">mdo</button>') var $btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
equal($btn.html(), 'mdo', 'btn text equals mdo') equal($btn.html(), 'mdo', 'btn text equals mdo')
$btn.bootstrapButton('loading') $btn.bootstrapButton('loading')
stop() var done = assert.async()
setTimeout(function () { setTimeout(function () {
equal($btn.html(), 'fat', 'btn text equals fat') equal($btn.html(), 'fat', 'btn text equals fat')
ok($btn[0].hasAttribute('disabled'), 'btn is disabled') ok($btn[0].hasAttribute('disabled'), 'btn is disabled')
ok($btn.hasClass('disabled'), 'btn has disabled class') ok($btn.hasClass('disabled'), 'btn has disabled class')
start() done()
}, 0) }, 0)
}) })
test('should return reset state', function () { test('should return reset state', function (assert) {
var $btn = $('<button class="btn" data-loading-text="fat">mdo</button>') var $btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
equal($btn.html(), 'mdo', 'btn text equals mdo') equal($btn.html(), 'mdo', 'btn text equals mdo')
$btn.bootstrapButton('loading') $btn.bootstrapButton('loading')
stop() var doneOne = assert.async()
setTimeout(function () { setTimeout(function () {
equal($btn.html(), 'fat', 'btn text equals fat') equal($btn.html(), 'fat', 'btn text equals fat')
ok($btn[0].hasAttribute('disabled'), 'btn is disabled') ok($btn[0].hasAttribute('disabled'), 'btn is disabled')
ok($btn.hasClass('disabled'), 'btn has disabled class') ok($btn.hasClass('disabled'), 'btn has disabled class')
start() doneOne()
stop() var doneTwo = assert.async()
$btn.bootstrapButton('reset') $btn.bootstrapButton('reset')
setTimeout(function () { setTimeout(function () {
equal($btn.html(), 'mdo', 'btn text equals mdo') equal($btn.html(), 'mdo', 'btn text equals mdo')
ok(!$btn[0].hasAttribute('disabled'), 'btn is not disabled') ok(!$btn[0].hasAttribute('disabled'), 'btn is not disabled')
ok(!$btn.hasClass('disabled'), 'btn does not have disabled class') ok(!$btn.hasClass('disabled'), 'btn does not have disabled class')
start() doneTwo()
}, 0) }, 0)
}, 0) }, 0)
}) })
test('should work with an empty string as reset state', function () { test('should work with an empty string as reset state', function (assert) {
var $btn = $('<button class="btn" data-loading-text="fat"/>') var $btn = $('<button class="btn" data-loading-text="fat"/>')
equal($btn.html(), '', 'btn text equals ""') equal($btn.html(), '', 'btn text equals ""')
$btn.bootstrapButton('loading') $btn.bootstrapButton('loading')
stop() var doneOne = assert.async()
setTimeout(function () { setTimeout(function () {
equal($btn.html(), 'fat', 'btn text equals fat') equal($btn.html(), 'fat', 'btn text equals fat')
ok($btn[0].hasAttribute('disabled'), 'btn is disabled') ok($btn[0].hasAttribute('disabled'), 'btn is disabled')
ok($btn.hasClass('disabled'), 'btn has disabled class') ok($btn.hasClass('disabled'), 'btn has disabled class')
start() doneOne()
stop() var doneTwo = assert.async()
$btn.bootstrapButton('reset') $btn.bootstrapButton('reset')
setTimeout(function () { setTimeout(function () {
equal($btn.html(), '', 'btn text equals ""') equal($btn.html(), '', 'btn text equals ""')
ok(!$btn[0].hasAttribute('disabled'), 'btn is not disabled') ok(!$btn[0].hasAttribute('disabled'), 'btn is not disabled')
ok(!$btn.hasClass('disabled'), 'btn does not have disabled class') ok(!$btn.hasClass('disabled'), 'btn does not have disabled class')
start() doneTwo()
}, 0) }, 0)
}, 0) }, 0)
}) })

54
js/tests/unit/carousel.js
View File

@@ -29,13 +29,13 @@ $(function () {
strictEqual($carousel[0], $el[0], 'collection contains element') strictEqual($carousel[0], $el[0], 'collection contains element')
}) })
test('should not fire slid when slide is prevented', function () { test('should not fire slid when slide is prevented', function (assert) {
stop() var done = assert.async()
$('<div class="carousel"/>') $('<div class="carousel"/>')
.on('slide.bs.carousel', function (e) { .on('slide.bs.carousel', function (e) {
e.preventDefault() e.preventDefault()
ok(true, 'slide event fired') ok(true, 'slide event fired')
start() done()
}) })
.on('slid.bs.carousel', function () { .on('slid.bs.carousel', function () {
ok(false, 'slid event fired') ok(false, 'slid event fired')
@@ -43,7 +43,7 @@ $(function () {
.bootstrapCarousel('next') .bootstrapCarousel('next')
}) })
test('should reset when slide is prevented', function () { test('should reset when slide is prevented', function (assert) {
var carouselHTML = '<div id="carousel-example-generic" class="carousel slide">' var carouselHTML = '<div id="carousel-example-generic" class="carousel slide">'
+ '<ol class="carousel-indicators">' + '<ol class="carousel-indicators">'
+ '<li data-target="#carousel-example-generic" data-slide-to="0" class="active"/>' + '<li data-target="#carousel-example-generic" data-slide-to="0" class="active"/>'
@@ -66,7 +66,7 @@ $(function () {
+ '</div>' + '</div>'
var $carousel = $(carouselHTML) var $carousel = $(carouselHTML)
stop() var done = assert.async()
$carousel $carousel
.one('slide.bs.carousel', function (e) { .one('slide.bs.carousel', function (e) {
e.preventDefault() e.preventDefault()
@@ -82,13 +82,13 @@ $(function () {
ok(!$carousel.find('.carousel-indicators li:eq(0)').is('.active'), 'first indicator still active') ok(!$carousel.find('.carousel-indicators li:eq(0)').is('.active'), 'first indicator still active')
ok($carousel.find('.item:eq(1)').is('.active'), 'second item active') ok($carousel.find('.item:eq(1)').is('.active'), 'second item active')
ok($carousel.find('.carousel-indicators li:eq(1)').is('.active'), 'second indicator active') ok($carousel.find('.carousel-indicators li:eq(1)').is('.active'), 'second indicator active')
start() done()
}, 0) }, 0)
}) })
.bootstrapCarousel('next') .bootstrapCarousel('next')
}) })
test('should fire slide event with direction', function () { test('should fire slide event with direction', function (assert) {
var carouselHTML = '<div id="myCarousel" class="carousel slide">' var carouselHTML = '<div id="myCarousel" class="carousel slide">'
+ '<div class="carousel-inner">' + '<div class="carousel-inner">'
+ '<div class="item active">' + '<div class="item active">'
@@ -124,7 +124,7 @@ $(function () {
+ '</div>' + '</div>'
var $carousel = $(carouselHTML) var $carousel = $(carouselHTML)
stop() var done = assert.async()
$carousel $carousel
.one('slide.bs.carousel', function (e) { .one('slide.bs.carousel', function (e) {
@@ -135,14 +135,14 @@ $(function () {
.one('slide.bs.carousel', function (e) { .one('slide.bs.carousel', function (e) {
ok(e.direction, 'direction present on prev') ok(e.direction, 'direction present on prev')
strictEqual(e.direction, 'right', 'direction is right on prev') strictEqual(e.direction, 'right', 'direction is right on prev')
start() done()
}) })
.bootstrapCarousel('prev') .bootstrapCarousel('prev')
}) })
.bootstrapCarousel('next') .bootstrapCarousel('next')
}) })
test('should fire slid event with direction', function () { test('should fire slid event with direction', function (assert) {
var carouselHTML = '<div id="myCarousel" class="carousel slide">' var carouselHTML = '<div id="myCarousel" class="carousel slide">'
+ '<div class="carousel-inner">' + '<div class="carousel-inner">'
+ '<div class="item active">' + '<div class="item active">'
@@ -178,7 +178,7 @@ $(function () {
+ '</div>' + '</div>'
var $carousel = $(carouselHTML) var $carousel = $(carouselHTML)
stop() var done = assert.async()
$carousel $carousel
.one('slid.bs.carousel', function (e) { .one('slid.bs.carousel', function (e) {
@@ -189,14 +189,14 @@ $(function () {
.one('slid.bs.carousel', function (e) { .one('slid.bs.carousel', function (e) {
ok(e.direction, 'direction present on prev') ok(e.direction, 'direction present on prev')
strictEqual(e.direction, 'right', 'direction is right on prev') strictEqual(e.direction, 'right', 'direction is right on prev')
start() done()
}) })
.bootstrapCarousel('prev') .bootstrapCarousel('prev')
}) })
.bootstrapCarousel('next') .bootstrapCarousel('next')
}) })
test('should fire slide event with relatedTarget', function () { test('should fire slide event with relatedTarget', function (assert) {
var template = '<div id="myCarousel" class="carousel slide">' var template = '<div id="myCarousel" class="carousel slide">'
+ '<div class="carousel-inner">' + '<div class="carousel-inner">'
+ '<div class="item active">' + '<div class="item active">'
@@ -231,18 +231,18 @@ $(function () {
+ '<a class="right carousel-control" href="#myCarousel" data-slide="next">&rsaquo;</a>' + '<a class="right carousel-control" href="#myCarousel" data-slide="next">&rsaquo;</a>'
+ '</div>' + '</div>'
stop() var done = assert.async()
$(template) $(template)
.on('slide.bs.carousel', function (e) { .on('slide.bs.carousel', function (e) {
ok(e.relatedTarget, 'relatedTarget present') ok(e.relatedTarget, 'relatedTarget present')
ok($(e.relatedTarget).hasClass('item'), 'relatedTarget has class "item"') ok($(e.relatedTarget).hasClass('item'), 'relatedTarget has class "item"')
start() done()
}) })
.bootstrapCarousel('next') .bootstrapCarousel('next')
}) })
test('should fire slid event with relatedTarget', function () { test('should fire slid event with relatedTarget', function (assert) {
var template = '<div id="myCarousel" class="carousel slide">' var template = '<div id="myCarousel" class="carousel slide">'
+ '<div class="carousel-inner">' + '<div class="carousel-inner">'
+ '<div class="item active">' + '<div class="item active">'
@@ -277,13 +277,13 @@ $(function () {
+ '<a class="right carousel-control" href="#myCarousel" data-slide="next">&rsaquo;</a>' + '<a class="right carousel-control" href="#myCarousel" data-slide="next">&rsaquo;</a>'
+ '</div>' + '</div>'
stop() var done = assert.async()
$(template) $(template)
.on('slid.bs.carousel', function (e) { .on('slid.bs.carousel', function (e) {
ok(e.relatedTarget, 'relatedTarget present') ok(e.relatedTarget, 'relatedTarget present')
ok($(e.relatedTarget).hasClass('item'), 'relatedTarget has class "item"') ok($(e.relatedTarget).hasClass('item'), 'relatedTarget has class "item"')
start() done()
}) })
.bootstrapCarousel('next') .bootstrapCarousel('next')
}) })
@@ -542,7 +542,7 @@ $(function () {
}) })
}) })
test('should wrap around from end to start when wrap option is true', function () { test('should wrap around from end to start when wrap option is true', function (assert) {
var carouselHTML = '<div id="carousel-example-generic" class="carousel slide" data-wrap="true">' var carouselHTML = '<div id="carousel-example-generic" class="carousel slide" data-wrap="true">'
+ '<ol class="carousel-indicators">' + '<ol class="carousel-indicators">'
+ '<li data-target="#carousel-example-generic" data-slide-to="0" class="active"/>' + '<li data-target="#carousel-example-generic" data-slide-to="0" class="active"/>'
@@ -566,7 +566,7 @@ $(function () {
var $carousel = $(carouselHTML) var $carousel = $(carouselHTML)
var getActiveId = function () { return $carousel.find('.item.active').attr('id') } var getActiveId = function () { return $carousel.find('.item.active').attr('id') }
stop() var done = assert.async()
$carousel $carousel
.one('slid.bs.carousel', function () { .one('slid.bs.carousel', function () {
@@ -577,7 +577,7 @@ $(function () {
$carousel $carousel
.one('slid.bs.carousel', function () { .one('slid.bs.carousel', function () {
strictEqual(getActiveId(), 'one', 'carousel wrapped around and slid from 3rd to 1st slide') strictEqual(getActiveId(), 'one', 'carousel wrapped around and slid from 3rd to 1st slide')
start() done()
}) })
.bootstrapCarousel('next') .bootstrapCarousel('next')
}) })
@@ -586,7 +586,7 @@ $(function () {
.bootstrapCarousel('next') .bootstrapCarousel('next')
}) })
test('should wrap around from start to end when wrap option is true', function () { test('should wrap around from start to end when wrap option is true', function (assert) {
var carouselHTML = '<div id="carousel-example-generic" class="carousel slide" data-wrap="true">' var carouselHTML = '<div id="carousel-example-generic" class="carousel slide" data-wrap="true">'
+ '<ol class="carousel-indicators">' + '<ol class="carousel-indicators">'
+ '<li data-target="#carousel-example-generic" data-slide-to="0" class="active"/>' + '<li data-target="#carousel-example-generic" data-slide-to="0" class="active"/>'
@@ -609,17 +609,17 @@ $(function () {
+ '</div>' + '</div>'
var $carousel = $(carouselHTML) var $carousel = $(carouselHTML)
stop() var done = assert.async()
$carousel $carousel
.on('slid.bs.carousel', function () { .on('slid.bs.carousel', function () {
strictEqual($carousel.find('.item.active').attr('id'), 'three', 'carousel wrapped around and slid from 1st to 3rd slide') strictEqual($carousel.find('.item.active').attr('id'), 'three', 'carousel wrapped around and slid from 1st to 3rd slide')
start() done()
}) })
.bootstrapCarousel('prev') .bootstrapCarousel('prev')
}) })
test('should stay at the end when the next method is called and wrap is false', function () { test('should stay at the end when the next method is called and wrap is false', function (assert) {
var carouselHTML = '<div id="carousel-example-generic" class="carousel slide" data-wrap="false">' var carouselHTML = '<div id="carousel-example-generic" class="carousel slide" data-wrap="false">'
+ '<ol class="carousel-indicators">' + '<ol class="carousel-indicators">'
+ '<li data-target="#carousel-example-generic" data-slide-to="0" class="active"/>' + '<li data-target="#carousel-example-generic" data-slide-to="0" class="active"/>'
@@ -643,7 +643,7 @@ $(function () {
var $carousel = $(carouselHTML) var $carousel = $(carouselHTML)
var getActiveId = function () { return $carousel.find('.item.active').attr('id') } var getActiveId = function () { return $carousel.find('.item.active').attr('id') }
stop() var done = assert.async()
$carousel $carousel
.one('slid.bs.carousel', function () { .one('slid.bs.carousel', function () {
@@ -657,7 +657,7 @@ $(function () {
}) })
.bootstrapCarousel('next') .bootstrapCarousel('next')
strictEqual(getActiveId(), 'three', 'carousel did not wrap around and stayed on 3rd slide') strictEqual(getActiveId(), 'three', 'carousel did not wrap around and stayed on 3rd slide')
start() done()
}) })
.bootstrapCarousel('next') .bootstrapCarousel('next')
}) })

84
js/tests/unit/collapse.js
View File

@@ -43,14 +43,14 @@ $(function () {
ok(/height/i.test($el.attr('style')), 'has height set') ok(/height/i.test($el.attr('style')), 'has height set')
}) })
test('should not fire shown when show is prevented', function () { test('should not fire shown when show is prevented', function (assert) {
stop() var done = assert.async()
$('<div class="collapse"/>') $('<div class="collapse"/>')
.on('show.bs.collapse', function (e) { .on('show.bs.collapse', function (e) {
e.preventDefault() e.preventDefault()
ok(true, 'show event fired') ok(true, 'show event fired')
start() done()
}) })
.on('shown.bs.collapse', function () { .on('shown.bs.collapse', function () {
ok(false, 'shown event fired') ok(false, 'shown event fired')
@@ -58,8 +58,8 @@ $(function () {
.bootstrapCollapse('show') .bootstrapCollapse('show')
}) })
test('should reset style to auto after finishing opening collapse', function () { test('should reset style to auto after finishing opening collapse', function (assert) {
stop() var done = assert.async()
$('<div class="collapse" style="height: 0px"/>') $('<div class="collapse" style="height: 0px"/>')
.on('show.bs.collapse', function () { .on('show.bs.collapse', function () {
@@ -67,13 +67,13 @@ $(function () {
}) })
.on('shown.bs.collapse', function () { .on('shown.bs.collapse', function () {
strictEqual(this.style.height, '', 'height is auto') strictEqual(this.style.height, '', 'height is auto')
start() done()
}) })
.bootstrapCollapse('show') .bootstrapCollapse('show')
}) })
test('should remove "collapsed" class from target when collapse is shown', function () { test('should remove "collapsed" class from target when collapse is shown', function (assert) {
stop() var done = assert.async()
var $target = $('<a data-toggle="collapse" class="collapsed" href="#test1"/>').appendTo('#qunit-fixture') var $target = $('<a data-toggle="collapse" class="collapsed" href="#test1"/>').appendTo('#qunit-fixture')
@@ -81,14 +81,14 @@ $(function () {
.appendTo('#qunit-fixture') .appendTo('#qunit-fixture')
.on('shown.bs.collapse', function () { .on('shown.bs.collapse', function () {
ok(!$target.hasClass('collapsed')) ok(!$target.hasClass('collapsed'))
start() done()
}) })
$target.click() $target.click()
}) })
test('should add "collapsed" class to target when collapse is hidden', function () { test('should add "collapsed" class to target when collapse is hidden', function (assert) {
stop() var done = assert.async()
var $target = $('<a data-toggle="collapse" href="#test1"/>').appendTo('#qunit-fixture') var $target = $('<a data-toggle="collapse" href="#test1"/>').appendTo('#qunit-fixture')
@@ -96,14 +96,14 @@ $(function () {
.appendTo('#qunit-fixture') .appendTo('#qunit-fixture')
.on('hidden.bs.collapse', function () { .on('hidden.bs.collapse', function () {
ok($target.hasClass('collapsed')) ok($target.hasClass('collapsed'))
start() done()
}) })
$target.click() $target.click()
}) })
test('should not close a collapse when initialized with "show" if already shown', function () { test('should not close a collapse when initialized with "show" if already shown', function (assert) {
stop() var done = assert.async()
expect(0) expect(0)
@@ -115,11 +115,11 @@ $(function () {
$test.bootstrapCollapse('show') $test.bootstrapCollapse('show')
setTimeout(start, 0) setTimeout(done, 0)
}) })
test('should open a collapse when initialized with "show" if not already shown', function () { test('should open a collapse when initialized with "show" if not already shown', function (assert) {
stop() var done = assert.async()
expect(1) expect(1)
@@ -131,11 +131,11 @@ $(function () {
$test.bootstrapCollapse('show') $test.bootstrapCollapse('show')
setTimeout(start, 0) setTimeout(done, 0)
}) })
test('should remove "collapsed" class from active accordion target', function () { test('should remove "collapsed" class from active accordion target', function (assert) {
stop() var done = assert.async()
var accordionHTML = '<div class="panel-group" id="accordion">' var accordionHTML = '<div class="panel-group" id="accordion">'
+ '<div class="panel"/>' + '<div class="panel"/>'
@@ -161,14 +161,14 @@ $(function () {
ok($target2.hasClass('collapsed'), 'inactive target 2 does have class "collapsed"') ok($target2.hasClass('collapsed'), 'inactive target 2 does have class "collapsed"')
ok(!$target3.hasClass('collapsed'), 'active target 3 does not have class "collapsed"') ok(!$target3.hasClass('collapsed'), 'active target 3 does not have class "collapsed"')
start() done()
}) })
$target3.click() $target3.click()
}) })
test('should allow dots in data-parent', function () { test('should allow dots in data-parent', function (assert) {
stop() var done = assert.async()
var accordionHTML = '<div class="panel-group accordion">' var accordionHTML = '<div class="panel-group accordion">'
+ '<div class="panel"/>' + '<div class="panel"/>'
@@ -194,14 +194,14 @@ $(function () {
ok($target2.hasClass('collapsed'), 'inactive target 2 does have class "collapsed"') ok($target2.hasClass('collapsed'), 'inactive target 2 does have class "collapsed"')
ok(!$target3.hasClass('collapsed'), 'active target 3 does not have class "collapsed"') ok(!$target3.hasClass('collapsed'), 'active target 3 does not have class "collapsed"')
start() done()
}) })
$target3.click() $target3.click()
}) })
test('should set aria-expanded="true" on target when collapse is shown', function () { test('should set aria-expanded="true" on target when collapse is shown', function (assert) {
stop() var done = assert.async()
var $target = $('<a data-toggle="collapse" class="collapsed" href="#test1" aria-expanded="false"/>').appendTo('#qunit-fixture') var $target = $('<a data-toggle="collapse" class="collapsed" href="#test1" aria-expanded="false"/>').appendTo('#qunit-fixture')
@@ -209,14 +209,14 @@ $(function () {
.appendTo('#qunit-fixture') .appendTo('#qunit-fixture')
.on('shown.bs.collapse', function () { .on('shown.bs.collapse', function () {
equal($target.attr('aria-expanded'), 'true', 'aria-expanded on target is "true"') equal($target.attr('aria-expanded'), 'true', 'aria-expanded on target is "true"')
start() done()
}) })
$target.click() $target.click()
}) })
test('should set aria-expanded="false" on target when collapse is hidden', function () { test('should set aria-expanded="false" on target when collapse is hidden', function (assert) {
stop() var done = assert.async()
var $target = $('<a data-toggle="collapse" href="#test1" aria-expanded="true"/>').appendTo('#qunit-fixture') var $target = $('<a data-toggle="collapse" href="#test1" aria-expanded="true"/>').appendTo('#qunit-fixture')
@@ -224,14 +224,14 @@ $(function () {
.appendTo('#qunit-fixture') .appendTo('#qunit-fixture')
.on('hidden.bs.collapse', function () { .on('hidden.bs.collapse', function () {
equal($target.attr('aria-expanded'), 'false', 'aria-expanded on target is "false"') equal($target.attr('aria-expanded'), 'false', 'aria-expanded on target is "false"')
start() done()
}) })
$target.click() $target.click()
}) })
test('should change aria-expanded from active accordion target to "false" and set the newly active one to "true"', function () { test('should change aria-expanded from active accordion target to "false" and set the newly active one to "true"', function (assert) {
stop() var done = assert.async()
var accordionHTML = '<div class="panel-group" id="accordion">' var accordionHTML = '<div class="panel-group" id="accordion">'
+ '<div class="panel"/>' + '<div class="panel"/>'
@@ -257,14 +257,14 @@ $(function () {
equal($target2.attr('aria-expanded'), 'false', 'inactive target 2 has aria-expanded="false"') equal($target2.attr('aria-expanded'), 'false', 'inactive target 2 has aria-expanded="false"')
equal($target3.attr('aria-expanded'), 'true', 'active target 3 has aria-expanded="false"') equal($target3.attr('aria-expanded'), 'true', 'active target 3 has aria-expanded="false"')
start() done()
}) })
$target3.click() $target3.click()
}) })
test('should not fire show event if show is prevented because other element is still transitioning', function () { test('should not fire show event if show is prevented because other element is still transitioning', function (assert) {
stop() var done = assert.async()
var accordionHTML = '<div id="accordion">' var accordionHTML = '<div id="accordion">'
+ '<div class="panel"/>' + '<div class="panel"/>'
@@ -294,12 +294,12 @@ $(function () {
setTimeout(function () { setTimeout(function () {
ok(!showFired, 'show event didn\'t fire') ok(!showFired, 'show event didn\'t fire')
start() done()
}, 1) }, 1)
}) })
test('should add "collapsed" class to target when collapse is hidden via manual invocation', function () { test('should add "collapsed" class to target when collapse is hidden via manual invocation', function (assert) {
stop() var done = assert.async()
var $target = $('<a data-toggle="collapse" href="#test1"/>').appendTo('#qunit-fixture') var $target = $('<a data-toggle="collapse" href="#test1"/>').appendTo('#qunit-fixture')
@@ -307,13 +307,13 @@ $(function () {
.appendTo('#qunit-fixture') .appendTo('#qunit-fixture')
.on('hidden.bs.collapse', function () { .on('hidden.bs.collapse', function () {
ok($target.hasClass('collapsed')) ok($target.hasClass('collapsed'))
start() done()
}) })
.bootstrapCollapse('hide') .bootstrapCollapse('hide')
}) })
test('should remove "collapsed" class from target when collapse is shown via manual invocation', function () { test('should remove "collapsed" class from target when collapse is shown via manual invocation', function (assert) {
stop() var done = assert.async()
var $target = $('<a data-toggle="collapse" class="collapsed" href="#test1"/>').appendTo('#qunit-fixture') var $target = $('<a data-toggle="collapse" class="collapsed" href="#test1"/>').appendTo('#qunit-fixture')
@@ -321,7 +321,7 @@ $(function () {
.appendTo('#qunit-fixture') .appendTo('#qunit-fixture')
.on('shown.bs.collapse', function () { .on('shown.bs.collapse', function () {
ok(!$target.hasClass('collapsed')) ok(!$target.hasClass('collapsed'))
start() done()
}) })
.bootstrapCollapse('show') .bootstrapCollapse('show')
}) })

18
js/tests/unit/dropdown.js
View File

@@ -157,7 +157,7 @@ $(function () {
strictEqual($('#qunit-fixture .open').length, 0, '"open" class removed') strictEqual($('#qunit-fixture .open').length, 0, '"open" class removed')
}) })
test('should fire show and hide event', function () { test('should fire show and hide event', function (assert) {
var dropdownHTML = '<ul class="tabs">' var dropdownHTML = '<ul class="tabs">'
+ '<li class="dropdown">' + '<li class="dropdown">'
+ '<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>' + '<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>'
@@ -174,7 +174,7 @@ $(function () {
.find('[data-toggle="dropdown"]') .find('[data-toggle="dropdown"]')
.bootstrapDropdown() .bootstrapDropdown()
stop() var done = assert.async()
$dropdown $dropdown
.parent('.dropdown') .parent('.dropdown')
@@ -183,7 +183,7 @@ $(function () {
}) })
.on('hide.bs.dropdown', function () { .on('hide.bs.dropdown', function () {
ok(true, 'hide was fired') ok(true, 'hide was fired')
start() done()
}) })
$dropdown.click() $dropdown.click()
@@ -191,7 +191,7 @@ $(function () {
}) })
test('should fire shown and hidden event', function () { test('should fire shown and hidden event', function (assert) {
var dropdownHTML = '<ul class="tabs">' var dropdownHTML = '<ul class="tabs">'
+ '<li class="dropdown">' + '<li class="dropdown">'
+ '<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>' + '<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>'
@@ -208,7 +208,7 @@ $(function () {
.find('[data-toggle="dropdown"]') .find('[data-toggle="dropdown"]')
.bootstrapDropdown() .bootstrapDropdown()
stop() var done = assert.async()
$dropdown $dropdown
.parent('.dropdown') .parent('.dropdown')
@@ -217,15 +217,15 @@ $(function () {
}) })
.on('hidden.bs.dropdown', function () { .on('hidden.bs.dropdown', function () {
ok(true, 'hidden was fired') ok(true, 'hidden was fired')
start() done()
}) })
$dropdown.click() $dropdown.click()
$(document.body).click() $(document.body).click()
}) })
test('should ignore keyboard events within <input>s and <textarea>s', function () { test('should ignore keyboard events within <input>s and <textarea>s', function (assert) {
stop() var done = assert.async()
var dropdownHTML = '<ul class="tabs">' var dropdownHTML = '<ul class="tabs">'
+ '<li class="dropdown">' + '<li class="dropdown">'
@@ -259,7 +259,7 @@ $(function () {
$textarea.focus().trigger($.Event('keydown', { which: 38 })) $textarea.focus().trigger($.Event('keydown', { which: 38 }))
ok($(document.activeElement).is($textarea), 'textarea still focused') ok($(document.activeElement).is($textarea), 'textarea still focused')
start() done()
}) })
$dropdown.click() $dropdown.click()

84
js/tests/unit/modal.js
View File

@@ -33,36 +33,36 @@ $(function () {
ok($.fn.bootstrapModal.Constructor.DEFAULTS, 'default object exposed') ok($.fn.bootstrapModal.Constructor.DEFAULTS, 'default object exposed')
}) })
test('should insert into dom when show method is called', function () { test('should insert into dom when show method is called', function (assert) {
stop() var done = assert.async()
$('<div id="modal-test"/>') $('<div id="modal-test"/>')
.on('shown.bs.modal', function () { .on('shown.bs.modal', function () {
notEqual($('#modal-test').length, 0, 'modal inserted into dom') notEqual($('#modal-test').length, 0, 'modal inserted into dom')
start() done()
}) })
.bootstrapModal('show') .bootstrapModal('show')
}) })
test('should fire show event', function () { test('should fire show event', function (assert) {
stop() var done = assert.async()
$('<div id="modal-test"/>') $('<div id="modal-test"/>')
.on('show.bs.modal', function () { .on('show.bs.modal', function () {
ok(true, 'show event fired') ok(true, 'show event fired')
start() done()
}) })
.bootstrapModal('show') .bootstrapModal('show')
}) })
test('should not fire shown when show was prevented', function () { test('should not fire shown when show was prevented', function (assert) {
stop() var done = assert.async()
$('<div id="modal-test"/>') $('<div id="modal-test"/>')
.on('show.bs.modal', function (e) { .on('show.bs.modal', function (e) {
e.preventDefault() e.preventDefault()
ok(true, 'show event fired') ok(true, 'show event fired')
start() done()
}) })
.on('shown.bs.modal', function () { .on('shown.bs.modal', function () {
ok(false, 'shown event fired') ok(false, 'shown event fired')
@@ -70,8 +70,8 @@ $(function () {
.bootstrapModal('show') .bootstrapModal('show')
}) })
test('should hide modal when hide is called', function () { test('should hide modal when hide is called', function (assert) {
stop() var done = assert.async()
$('<div id="modal-test"/>') $('<div id="modal-test"/>')
.on('shown.bs.modal', function () { .on('shown.bs.modal', function () {
@@ -81,13 +81,13 @@ $(function () {
}) })
.on('hidden.bs.modal', function () { .on('hidden.bs.modal', function () {
ok(!$('#modal-test').is(':visible'), 'modal hidden') ok(!$('#modal-test').is(':visible'), 'modal hidden')
start() done()
}) })
.bootstrapModal('show') .bootstrapModal('show')
}) })
test('should toggle when toggle is called', function () { test('should toggle when toggle is called', function (assert) {
stop() var done = assert.async()
$('<div id="modal-test"/>') $('<div id="modal-test"/>')
.on('shown.bs.modal', function () { .on('shown.bs.modal', function () {
@@ -97,13 +97,13 @@ $(function () {
}) })
.on('hidden.bs.modal', function () { .on('hidden.bs.modal', function () {
ok(!$('#modal-test').is(':visible'), 'modal hidden') ok(!$('#modal-test').is(':visible'), 'modal hidden')
start() done()
}) })
.bootstrapModal('toggle') .bootstrapModal('toggle')
}) })
test('should remove from dom when click [data-dismiss="modal"]', function () { test('should remove from dom when click [data-dismiss="modal"]', function (assert) {
stop() var done = assert.async()
$('<div id="modal-test"><span class="close" data-dismiss="modal"/></div>') $('<div id="modal-test"><span class="close" data-dismiss="modal"/></div>')
.on('shown.bs.modal', function () { .on('shown.bs.modal', function () {
@@ -113,13 +113,13 @@ $(function () {
}) })
.on('hidden.bs.modal', function () { .on('hidden.bs.modal', function () {
ok(!$('#modal-test').is(':visible'), 'modal hidden') ok(!$('#modal-test').is(':visible'), 'modal hidden')
start() done()
}) })
.bootstrapModal('toggle') .bootstrapModal('toggle')
}) })
test('should allow modal close with "backdrop:false"', function () { test('should allow modal close with "backdrop:false"', function (assert) {
stop() var done = assert.async()
$('<div id="modal-test" data-backdrop="false"/>') $('<div id="modal-test" data-backdrop="false"/>')
.on('shown.bs.modal', function () { .on('shown.bs.modal', function () {
@@ -128,13 +128,13 @@ $(function () {
}) })
.on('hidden.bs.modal', function () { .on('hidden.bs.modal', function () {
ok(!$('#modal-test').is(':visible'), 'modal hidden') ok(!$('#modal-test').is(':visible'), 'modal hidden')
start() done()
}) })
.bootstrapModal('show') .bootstrapModal('show')
}) })
test('should close modal when clicking outside of modal-content', function () { test('should close modal when clicking outside of modal-content', function (assert) {
stop() var done = assert.async()
$('<div id="modal-test"><div class="contents"/></div>') $('<div id="modal-test"><div class="contents"/></div>')
.on('shown.bs.modal', function () { .on('shown.bs.modal', function () {
@@ -145,13 +145,13 @@ $(function () {
}) })
.on('hidden.bs.modal', function () { .on('hidden.bs.modal', function () {
ok(!$('#modal-test').is(':visible'), 'modal hidden') ok(!$('#modal-test').is(':visible'), 'modal hidden')
start() done()
}) })
.bootstrapModal('show') .bootstrapModal('show')
}) })
test('should close modal when escape key is pressed via keydown', function () { test('should close modal when escape key is pressed via keydown', function (assert) {
stop() var done = assert.async()
var div = $('<div id="modal-test"/>') var div = $('<div id="modal-test"/>')
div div
@@ -163,14 +163,14 @@ $(function () {
setTimeout(function () { setTimeout(function () {
ok(!$('#modal-test').is(':visible'), 'modal hidden') ok(!$('#modal-test').is(':visible'), 'modal hidden')
div.remove() div.remove()
start() done()
}, 0) }, 0)
}) })
.bootstrapModal('show') .bootstrapModal('show')
}) })
test('should not close modal when escape key is pressed via keyup', function () { test('should not close modal when escape key is pressed via keyup', function (assert) {
stop() var done = assert.async()
var div = $('<div id="modal-test"/>') var div = $('<div id="modal-test"/>')
div div
@@ -182,14 +182,14 @@ $(function () {
setTimeout(function () { setTimeout(function () {
ok($('#modal-test').is(':visible'), 'modal still visible') ok($('#modal-test').is(':visible'), 'modal still visible')
div.remove() div.remove()
start() done()
}, 0) }, 0)
}) })
.bootstrapModal('show') .bootstrapModal('show')
}) })
test('should trigger hide event once when clicking outside of modal-content', function () { test('should trigger hide event once when clicking outside of modal-content', function (assert) {
stop() var done = assert.async()
var triggered var triggered
@@ -201,13 +201,13 @@ $(function () {
.on('hide.bs.modal', function () { .on('hide.bs.modal', function () {
triggered += 1 triggered += 1
strictEqual(triggered, 1, 'modal hide triggered once') strictEqual(triggered, 1, 'modal hide triggered once')
start() done()
}) })
.bootstrapModal('show') .bootstrapModal('show')
}) })
test('should close reopened modal with [data-dismiss="modal"] click', function () { test('should close reopened modal with [data-dismiss="modal"] click', function (assert) {
stop() var done = assert.async()
$('<div id="modal-test"><div class="contents"><div id="close" data-dismiss="modal"/></div></div>') $('<div id="modal-test"><div class="contents"><div id="close" data-dismiss="modal"/></div></div>')
.on('shown.bs.modal', function () { .on('shown.bs.modal', function () {
@@ -217,15 +217,15 @@ $(function () {
.one('hidden.bs.modal', function () { .one('hidden.bs.modal', function () {
$(this) $(this)
.one('hidden.bs.modal', function () { .one('hidden.bs.modal', function () {
start() done()
}) })
.bootstrapModal('show') .bootstrapModal('show')
}) })
.bootstrapModal('show') .bootstrapModal('show')
}) })
test('should restore focus to toggling element when modal is hidden after having been opened via data-api', function () { test('should restore focus to toggling element when modal is hidden after having been opened via data-api', function (assert) {
stop() var done = assert.async()
var $toggleBtn = $('<button data-toggle="modal" data-target="#modal-test"/>').appendTo('#qunit-fixture') var $toggleBtn = $('<button data-toggle="modal" data-target="#modal-test"/>').appendTo('#qunit-fixture')
@@ -233,7 +233,7 @@ $(function () {
.on('hidden.bs.modal', function () { .on('hidden.bs.modal', function () {
setTimeout(function () { setTimeout(function () {
ok($(document.activeElement).is($toggleBtn), 'toggling element is once again focused') ok($(document.activeElement).is($toggleBtn), 'toggling element is once again focused')
start() done()
}, 0) }, 0)
}) })
.on('shown.bs.modal', function () { .on('shown.bs.modal', function () {
@@ -244,8 +244,8 @@ $(function () {
$toggleBtn.click() $toggleBtn.click()
}) })
test('should not restore focus to toggling element if the associated show event gets prevented', function () { test('should not restore focus to toggling element if the associated show event gets prevented', function (assert) {
stop() var done = assert.async()
var $toggleBtn = $('<button data-toggle="modal" data-target="#modal-test"/>').appendTo('#qunit-fixture') var $toggleBtn = $('<button data-toggle="modal" data-target="#modal-test"/>').appendTo('#qunit-fixture')
var $otherBtn = $('<button id="other-btn"/>').appendTo('#qunit-fixture') var $otherBtn = $('<button id="other-btn"/>').appendTo('#qunit-fixture')
@@ -260,7 +260,7 @@ $(function () {
.on('hidden.bs.modal', function () { .on('hidden.bs.modal', function () {
setTimeout(function () { setTimeout(function () {
ok($(document.activeElement).is($otherBtn), 'focus returned to toggling element') ok($(document.activeElement).is($otherBtn), 'focus returned to toggling element')
start() done()
}, 0) }, 0)
}) })
.on('shown.bs.modal', function () { .on('shown.bs.modal', function () {

6
js/tests/unit/popover.js
View File

@@ -188,7 +188,7 @@ $(function () {
equal($('.popover').length, 0, 'popover was removed') equal($('.popover').length, 0, 'popover was removed')
}) })
test('should detach popover content rather than removing it so that event handlers are left intact', function () { test('should detach popover content rather than removing it so that event handlers are left intact', function (assert) {
var $content = $('<div class="content-with-handler"><a class="btn btn-warning">Button with event handler</a></div>').appendTo('#qunit-fixture') var $content = $('<div class="content-with-handler"><a class="btn btn-warning">Button with event handler</a></div>').appendTo('#qunit-fixture')
var handlerCalled = false var handlerCalled = false
@@ -207,7 +207,7 @@ $(function () {
} }
}) })
stop() var done = assert.async()
$div $div
.one('shown.bs.popover', function () { .one('shown.bs.popover', function () {
$div $div
@@ -217,7 +217,7 @@ $(function () {
$('.content-with-handler .btn').click() $('.content-with-handler .btn').click()
$div.bootstrapPopover('destroy') $div.bootstrapPopover('destroy')
ok(handlerCalled, 'content\'s event handler still present') ok(handlerCalled, 'content\'s event handler still present')
start() done()
}) })
.bootstrapPopover('show') .bootstrapPopover('show')
}) })

24
js/tests/unit/scrollspy.js
View File

@@ -29,8 +29,8 @@ $(function () {
strictEqual($scrollspy[0], $el[0], 'collection contains element') strictEqual($scrollspy[0], $el[0], 'collection contains element')
}) })
test('should only switch "active" class on current target', function () { test('should only switch "active" class on current target', function (assert) {
stop() var done = assert.async()
var sectionHTML = '<div id="root" class="active">' var sectionHTML = '<div id="root" class="active">'
+ '<div class="topbar">' + '<div class="topbar">'
@@ -67,14 +67,14 @@ $(function () {
$scrollspy.on('scroll.bs.scrollspy', function () { $scrollspy.on('scroll.bs.scrollspy', function () {
ok($section.hasClass('active'), '"active" class still on root node') ok($section.hasClass('active'), '"active" class still on root node')
start() done()
}) })
$scrollspy.scrollTop(350) $scrollspy.scrollTop(350)
}) })
test('should correctly select middle navigation option when large offset is used', function () { test('should correctly select middle navigation option when large offset is used', function (assert) {
stop() var done = assert.async()
var sectionHTML = '<div id="header" style="height: 500px;"></div>' var sectionHTML = '<div id="header" style="height: 500px;"></div>'
+ '<nav id="navigation" class="navbar">' + '<nav id="navigation" class="navbar">'
@@ -100,13 +100,13 @@ $(function () {
ok(!$section.find('#one-link').parent().hasClass('active'), '"active" class removed from first section') ok(!$section.find('#one-link').parent().hasClass('active'), '"active" class removed from first section')
ok($section.find('#two-link').parent().hasClass('active'), '"active" class on middle section') ok($section.find('#two-link').parent().hasClass('active'), '"active" class on middle section')
ok(!$section.find('#three-link').parent().hasClass('active'), '"active" class not on last section') ok(!$section.find('#three-link').parent().hasClass('active'), '"active" class not on last section')
start() done()
}) })
$scrollspy.scrollTop(550) $scrollspy.scrollTop(550)
}) })
test('should add the active class to the correct element', function () { test('should add the active class to the correct element', function (assert) {
var navbarHtml = var navbarHtml =
'<nav class="navbar">' '<nav class="navbar">'
+ '<ul class="nav">' + '<ul class="nav">'
@@ -128,10 +128,10 @@ $(function () {
var testElementIsActiveAfterScroll = function (element, target) { var testElementIsActiveAfterScroll = function (element, target) {
var deferred = $.Deferred() var deferred = $.Deferred()
var scrollHeight = Math.ceil($content.scrollTop() + $(target).position().top) var scrollHeight = Math.ceil($content.scrollTop() + $(target).position().top)
stop() var done = assert.async()
$content.one('scroll', function () { $content.one('scroll', function () {
ok($(element).hasClass('active'), 'target:' + target + ', element' + element) ok($(element).hasClass('active'), 'target:' + target + ', element' + element)
start() done()
deferred.resolve() deferred.resolve()
}) })
$content.scrollTop(scrollHeight) $content.scrollTop(scrollHeight)
@@ -142,8 +142,8 @@ $(function () {
.then(function () { return testElementIsActiveAfterScroll('#li-2', '#div-2') }) .then(function () { return testElementIsActiveAfterScroll('#li-2', '#div-2') })
}) })
test('should clear selection if above the first section', function () { test('should clear selection if above the first section', function (assert) {
stop() var done = assert.async()
var sectionHTML = '<div id="header" style="height: 500px;"></div>' var sectionHTML = '<div id="header" style="height: 500px;"></div>'
+ '<nav id="navigation" class="navbar">' + '<nav id="navigation" class="navbar">'
@@ -176,7 +176,7 @@ $(function () {
$scrollspy $scrollspy
.one('scroll.bs.scrollspy', function () { .one('scroll.bs.scrollspy', function () {
strictEqual($('.active').length, 0, 'selection cleared') strictEqual($('.active').length, 0, 'selection cleared')
start() done()
}) })
.scrollTop(0) .scrollTop(0)
}) })

30
js/tests/unit/tab.js
View File

@@ -59,14 +59,14 @@ $(function () {
equal($('#qunit-fixture').find('.active').attr('id'), 'home') equal($('#qunit-fixture').find('.active').attr('id'), 'home')
}) })
test('should not fire shown when show is prevented', function () { test('should not fire shown when show is prevented', function (assert) {
stop() var done = assert.async()
$('<div class="tab"/>') $('<div class="tab"/>')
.on('show.bs.tab', function (e) { .on('show.bs.tab', function (e) {
e.preventDefault() e.preventDefault()
ok(true, 'show event fired') ok(true, 'show event fired')
start() done()
}) })
.on('shown.bs.tab', function () { .on('shown.bs.tab', function () {
ok(false, 'shown event fired') ok(false, 'shown event fired')
@@ -74,8 +74,8 @@ $(function () {
.bootstrapTab('show') .bootstrapTab('show')
}) })
test('show and shown events should reference correct relatedTarget', function () { test('show and shown events should reference correct relatedTarget', function (assert) {
stop() var done = assert.async()
var dropHTML = '<ul class="drop">' var dropHTML = '<ul class="drop">'
+ '<li class="dropdown"><a data-toggle="dropdown" href="#">1</a>' + '<li class="dropdown"><a data-toggle="dropdown" href="#">1</a>'
@@ -93,7 +93,7 @@ $(function () {
.find('ul > li:last a') .find('ul > li:last a')
.on('show.bs.tab', function (e) { .on('show.bs.tab', function (e) {
equal(e.relatedTarget.hash, '#1-1', 'references correct element as relatedTarget') equal(e.relatedTarget.hash, '#1-1', 'references correct element as relatedTarget')
start() done()
}) })
.on('shown.bs.tab', function (e) { .on('shown.bs.tab', function (e) {
equal(e.relatedTarget.hash, '#1-1', 'references correct element as relatedTarget') equal(e.relatedTarget.hash, '#1-1', 'references correct element as relatedTarget')
@@ -101,8 +101,8 @@ $(function () {
.bootstrapTab('show') .bootstrapTab('show')
}) })
test('should fire hide and hidden events', function () { test('should fire hide and hidden events', function (assert) {
stop() var done = assert.async()
var tabsHTML = '<ul class="tabs">' var tabsHTML = '<ul class="tabs">'
+ '<li><a href="#home">Home</a></li>' + '<li><a href="#home">Home</a></li>'
@@ -123,7 +123,7 @@ $(function () {
.find('li:first a') .find('li:first a')
.on('hidden.bs.tab', function () { .on('hidden.bs.tab', function () {
ok(true, 'hidden event fired') ok(true, 'hidden event fired')
start() done()
}) })
.bootstrapTab('show') .bootstrapTab('show')
.end() .end()
@@ -131,8 +131,8 @@ $(function () {
.bootstrapTab('show') .bootstrapTab('show')
}) })
test('should not fire hidden when hide is prevented', function () { test('should not fire hidden when hide is prevented', function (assert) {
stop() var done = assert.async()
var tabsHTML = '<ul class="tabs">' var tabsHTML = '<ul class="tabs">'
+ '<li><a href="#home">Home</a></li>' + '<li><a href="#home">Home</a></li>'
@@ -144,7 +144,7 @@ $(function () {
.on('hide.bs.tab', function (e) { .on('hide.bs.tab', function (e) {
e.preventDefault() e.preventDefault()
ok(true, 'hide event fired') ok(true, 'hide event fired')
start() done()
}) })
.on('hidden.bs.tab', function () { .on('hidden.bs.tab', function () {
ok(false, 'hidden event fired') ok(false, 'hidden event fired')
@@ -155,8 +155,8 @@ $(function () {
.bootstrapTab('show') .bootstrapTab('show')
}) })
test('hide and hidden events contain correct relatedTarget', function () { test('hide and hidden events contain correct relatedTarget', function (assert) {
stop() var done = assert.async()
var tabsHTML = '<ul class="tabs">' var tabsHTML = '<ul class="tabs">'
+ '<li><a href="#home">Home</a></li>' + '<li><a href="#home">Home</a></li>'
@@ -170,7 +170,7 @@ $(function () {
}) })
.on('hidden.bs.tab', function (e) { .on('hidden.bs.tab', function (e) {
equal(e.relatedTarget.hash, '#profile', 'references correct element as relatedTarget') equal(e.relatedTarget.hash, '#profile', 'references correct element as relatedTarget')
start() done()
}) })
.bootstrapTab('show') .bootstrapTab('show')
.end() .end()

108
js/tests/unit/tooltip.js
View File

@@ -115,37 +115,37 @@ $(function () {
equal($('.tooltip').length, 0, 'tooltip removed') equal($('.tooltip').length, 0, 'tooltip removed')
}) })
test('should fire show event', function () { test('should fire show event', function (assert) {
stop() var done = assert.async()
$('<div title="tooltip title"/>') $('<div title="tooltip title"/>')
.on('show.bs.tooltip', function () { .on('show.bs.tooltip', function () {
ok(true, 'show event fired') ok(true, 'show event fired')
start() done()
}) })
.bootstrapTooltip('show') .bootstrapTooltip('show')
}) })
test('should fire shown event', function () { test('should fire shown event', function (assert) {
stop() var done = assert.async()
$('<div title="tooltip title"></div>') $('<div title="tooltip title"></div>')
.appendTo('#qunit-fixture') .appendTo('#qunit-fixture')
.on('shown.bs.tooltip', function () { .on('shown.bs.tooltip', function () {
ok(true, 'shown was called') ok(true, 'shown was called')
start() done()
}) })
.bootstrapTooltip('show') .bootstrapTooltip('show')
}) })
test('should not fire shown event when show was prevented', function () { test('should not fire shown event when show was prevented', function (assert) {
stop() var done = assert.async()
$('<div title="tooltip title"/>') $('<div title="tooltip title"/>')
.on('show.bs.tooltip', function (e) { .on('show.bs.tooltip', function (e) {
e.preventDefault() e.preventDefault()
ok(true, 'show event fired') ok(true, 'show event fired')
start() done()
}) })
.on('shown.bs.tooltip', function () { .on('shown.bs.tooltip', function () {
ok(false, 'shown event fired') ok(false, 'shown event fired')
@@ -153,8 +153,8 @@ $(function () {
.bootstrapTooltip('show') .bootstrapTooltip('show')
}) })
test('should fire hide event', function () { test('should fire hide event', function (assert) {
stop() var done = assert.async()
$('<div title="tooltip title"/>') $('<div title="tooltip title"/>')
.appendTo('#qunit-fixture') .appendTo('#qunit-fixture')
@@ -163,13 +163,13 @@ $(function () {
}) })
.on('hide.bs.tooltip', function () { .on('hide.bs.tooltip', function () {
ok(true, 'hide event fired') ok(true, 'hide event fired')
start() done()
}) })
.bootstrapTooltip('show') .bootstrapTooltip('show')
}) })
test('should fire hidden event', function () { test('should fire hidden event', function (assert) {
stop() var done = assert.async()
$('<div title="tooltip title"/>') $('<div title="tooltip title"/>')
.appendTo('#qunit-fixture') .appendTo('#qunit-fixture')
@@ -178,13 +178,13 @@ $(function () {
}) })
.on('hidden.bs.tooltip', function () { .on('hidden.bs.tooltip', function () {
ok(true, 'hidden event fired') ok(true, 'hidden event fired')
start() done()
}) })
.bootstrapTooltip('show') .bootstrapTooltip('show')
}) })
test('should not fire hidden event when hide was prevented', function () { test('should not fire hidden event when hide was prevented', function (assert) {
stop() var done = assert.async()
$('<div title="tooltip title"/>') $('<div title="tooltip title"/>')
.appendTo('#qunit-fixture') .appendTo('#qunit-fixture')
@@ -194,7 +194,7 @@ $(function () {
.on('hide.bs.tooltip', function (e) { .on('hide.bs.tooltip', function (e) {
e.preventDefault() e.preventDefault()
ok(true, 'hide event fired') ok(true, 'hide event fired')
start() done()
}) })
.on('hidden.bs.tooltip', function () { .on('hidden.bs.tooltip', function () {
ok(false, 'hidden event fired') ok(false, 'hidden event fired')
@@ -699,8 +699,8 @@ $(function () {
ok(passed, '.tooltip(\'show\') should not throw an error if element no longer is in dom') ok(passed, '.tooltip(\'show\') should not throw an error if element no longer is in dom')
}) })
test('should place tooltip on top of element', function () { test('should place tooltip on top of element', function (assert) {
stop() var done = assert.async()
var containerHTML = '<div>' var containerHTML = '<div>'
+ '<p style="margin-top: 200px">' + '<p style="margin-top: 200px">'
@@ -732,12 +732,12 @@ $(function () {
setTimeout(function () { setTimeout(function () {
ok(Math.round($tooltip.offset().top + $tooltip.outerHeight()) <= Math.round($trigger.offset().top)) ok(Math.round($tooltip.offset().top + $tooltip.outerHeight()) <= Math.round($trigger.offset().top))
start() done()
}, 0) }, 0)
}) })
test('should place tooltip inside viewport', function () { test('should place tooltip inside viewport', function (assert) {
stop() var done = assert.async()
var $container = $('<div/>') var $container = $('<div/>')
.css({ .css({
@@ -763,12 +763,12 @@ $(function () {
setTimeout(function () { setTimeout(function () {
ok($('.tooltip').offset().left >= 0) ok($('.tooltip').offset().left >= 0)
start() done()
}, 0) }, 0)
}) })
test('should show tooltip if leave event hasn\'t occurred before delay expires', function () { test('should show tooltip if leave event hasn\'t occurred before delay expires', function (assert) {
stop() var done = assert.async()
var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>') var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>')
.appendTo('#qunit-fixture') .appendTo('#qunit-fixture')
@@ -780,14 +780,14 @@ $(function () {
setTimeout(function () { setTimeout(function () {
ok($('.tooltip').is('.fade.in'), '200ms: tooltip is faded in') ok($('.tooltip').is('.fade.in'), '200ms: tooltip is faded in')
start() done()
}, 200) }, 200)
$tooltip.trigger('mouseenter') $tooltip.trigger('mouseenter')
}) })
test('should not show tooltip if leave event occurs before delay expires', function () { test('should not show tooltip if leave event occurs before delay expires', function (assert) {
stop() var done = assert.async()
var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>') var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>')
.appendTo('#qunit-fixture') .appendTo('#qunit-fixture')
@@ -800,14 +800,14 @@ $(function () {
setTimeout(function () { setTimeout(function () {
ok(!$('.tooltip').is('.fade.in'), '200ms: tooltip not faded in') ok(!$('.tooltip').is('.fade.in'), '200ms: tooltip not faded in')
start() done()
}, 200) }, 200)
$tooltip.trigger('mouseenter') $tooltip.trigger('mouseenter')
}) })
test('should not hide tooltip if leave event occurs and enter event occurs within the hide delay', function () { test('should not hide tooltip if leave event occurs and enter event occurs within the hide delay', function (assert) {
stop() var done = assert.async()
var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>') var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>')
.appendTo('#qunit-fixture') .appendTo('#qunit-fixture')
@@ -824,15 +824,15 @@ $(function () {
setTimeout(function () { setTimeout(function () {
ok($('.tooltip').is('.fade.in'), '200ms: tooltip still faded in') ok($('.tooltip').is('.fade.in'), '200ms: tooltip still faded in')
start() done()
}, 200) }, 200)
}, 0) }, 0)
$tooltip.trigger('mouseenter') $tooltip.trigger('mouseenter')
}) })
test('should not show tooltip if leave event occurs before delay expires', function () { test('should not show tooltip if leave event occurs before delay expires', function (assert) {
stop() var done = assert.async()
var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>') var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>')
.appendTo('#qunit-fixture') .appendTo('#qunit-fixture')
@@ -845,14 +845,14 @@ $(function () {
setTimeout(function () { setTimeout(function () {
ok(!$('.tooltip').is('.fade.in'), '200ms: tooltip not faded in') ok(!$('.tooltip').is('.fade.in'), '200ms: tooltip not faded in')
start() done()
}, 200) }, 200)
$tooltip.trigger('mouseenter') $tooltip.trigger('mouseenter')
}) })
test('should not show tooltip if leave event occurs before delay expires, even if hide delay is 0', function () { test('should not show tooltip if leave event occurs before delay expires, even if hide delay is 0', function (assert) {
stop() var done = assert.async()
var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>') var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>')
.appendTo('#qunit-fixture') .appendTo('#qunit-fixture')
@@ -865,14 +865,14 @@ $(function () {
setTimeout(function () { setTimeout(function () {
ok(!$('.tooltip').is('.fade.in'), '250ms: tooltip not faded in') ok(!$('.tooltip').is('.fade.in'), '250ms: tooltip not faded in')
start() done()
}, 250) }, 250)
$tooltip.trigger('mouseenter') $tooltip.trigger('mouseenter')
}) })
test('should wait 200ms before hiding the tooltip', function () { test('should wait 200ms before hiding the tooltip', function (assert) {
stop() var done = assert.async()
var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>') var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>')
.appendTo('#qunit-fixture') .appendTo('#qunit-fixture')
@@ -889,7 +889,7 @@ $(function () {
setTimeout(function () { setTimeout(function () {
ok(!$tooltip.data('bs.tooltip').$tip.is('.in'), '200ms: tooltip removed') ok(!$tooltip.data('bs.tooltip').$tip.is('.in'), '200ms: tooltip removed')
start() done()
}, 200) }, 200)
}, 0) }, 0)
@@ -897,14 +897,14 @@ $(function () {
$tooltip.trigger('mouseenter') $tooltip.trigger('mouseenter')
}) })
test('should correctly position tooltips on SVG elements', function () { test('should correctly position tooltips on SVG elements', function (assert) {
if (!window.SVGElement) { if (!window.SVGElement) {
// Skip IE8 since it doesn't support SVG // Skip IE8 since it doesn't support SVG
expect(0) expect(0)
return return
} }
stop() var done = assert.async()
var styles = '<style>' var styles = '<style>'
+ '.tooltip, .tooltip *, .tooltip *:before, .tooltip *:after { box-sizing: border-box; }' + '.tooltip, .tooltip *, .tooltip *:before, .tooltip *:after { box-sizing: border-box; }'
@@ -928,15 +928,15 @@ $(function () {
ok(Math.abs(offset.left - 88) <= 1, 'tooltip has correct horizontal location') ok(Math.abs(offset.left - 88) <= 1, 'tooltip has correct horizontal location')
$circle.bootstrapTooltip('hide') $circle.bootstrapTooltip('hide')
equal($('.tooltip').length, 0, 'tooltip removed from dom') equal($('.tooltip').length, 0, 'tooltip removed from dom')
start() done()
}) })
.bootstrapTooltip({ container: 'body', placement: 'top', trigger: 'manual' }) .bootstrapTooltip({ container: 'body', placement: 'top', trigger: 'manual' })
$circle.bootstrapTooltip('show') $circle.bootstrapTooltip('show')
}) })
test('should correctly determine auto placement based on container rather than parent', function () { test('should correctly determine auto placement based on container rather than parent', function (assert) {
stop() var done = assert.async()
var styles = '<style>' var styles = '<style>'
+ '.tooltip, .tooltip *, .tooltip *:before, .tooltip *:after { box-sizing: border-box; }' + '.tooltip, .tooltip *, .tooltip *:before, .tooltip *:after { box-sizing: border-box; }'
@@ -965,7 +965,7 @@ $(function () {
$styles.remove() $styles.remove()
$(this).remove() $(this).remove()
equal($('.tooltip').length, 0, 'tooltip removed from dom') equal($('.tooltip').length, 0, 'tooltip removed from dom')
start() done()
}) })
.bootstrapTooltip({ .bootstrapTooltip({
container: 'body', container: 'body',
@@ -1037,8 +1037,8 @@ $(function () {
equal(currentUid, $('#tt-content').text()) equal(currentUid, $('#tt-content').text())
}) })
test('should position arrow correctly when tooltip is moved to not appear offscreen', function () { test('should position arrow correctly when tooltip is moved to not appear offscreen', function (assert) {
stop() var done = assert.async()
var styles = '<style>' var styles = '<style>'
+ '.tooltip, .tooltip *, .tooltip *:before, .tooltip *:after { box-sizing: border-box; }' + '.tooltip, .tooltip *, .tooltip *:before, .tooltip *:after { box-sizing: border-box; }'
@@ -1059,7 +1059,7 @@ $(function () {
$styles.remove() $styles.remove()
$(this).remove() $(this).remove()
equal($('.tooltip').length, 0, 'tooltip removed from dom') equal($('.tooltip').length, 0, 'tooltip removed from dom')
start() done()
}) })
.bootstrapTooltip({ .bootstrapTooltip({
container: 'body', container: 'body',
@@ -1069,14 +1069,14 @@ $(function () {
.bootstrapTooltip('show') .bootstrapTooltip('show')
}) })
test('should correctly position tooltips on transformed elements', function () { test('should correctly position tooltips on transformed elements', function (assert) {
var styleProps = document.documentElement.style var styleProps = document.documentElement.style
if (!('transform' in styleProps) && !('webkitTransform' in styleProps) && !('msTransform' in styleProps)) { if (!('transform' in styleProps) && !('webkitTransform' in styleProps) && !('msTransform' in styleProps)) {
expect(0) expect(0)
return return
} }
stop() var done = assert.async()
var styles = '<style>' var styles = '<style>'
+ '#qunit-fixture { top: 0; left: 0; }' + '#qunit-fixture { top: 0; left: 0; }'
@@ -1096,7 +1096,7 @@ $(function () {
ok(Math.abs(offset.left - 88) <= 1, 'tooltip has correct horizontal location') ok(Math.abs(offset.left - 88) <= 1, 'tooltip has correct horizontal location')
ok(Math.abs(offset.top - 126) <= 1, 'tooltip has correct vertical location') ok(Math.abs(offset.top - 126) <= 1, 'tooltip has correct vertical location')
$element.bootstrapTooltip('hide') $element.bootstrapTooltip('hide')
start() done()
}) })
.bootstrapTooltip({ .bootstrapTooltip({
container: 'body', container: 'body',