Skip to content

B
bootstrap
Commit b5d86ad0 authored by Jacob's avatar Jacob
Browse files
Options

Merge pull request #13853 from hnrch02/unit-tests-cleanup 

Major unit tests cleanup
parents 5e41a23e 58eb8b2a
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1398 additions and 1049 deletions
js/tests/index.html
View file @ b5d86ad0
......@@ -13,23 +13,22 @@
<script>
// See https://github.com/axemclion/grunt-saucelabs#test-result-details-with-qunit
var log = []
QUnit.done = function (test_results) {
var tests = log.map(function (details) {
return {
QUnit.done(function (testResults) {
var tests = []
for (var i = 0, len = log.length; i < len; i++) {
var details = log[i]
tests.push({
name: details.name,
result: details.result,
expected: details.expected,
actual: details.actual,
source: details.source
}
})
test_results.tests = tests
})
}
testResults.tests = tests
// Delaying results a bit because in real-world scenario you won't get them immediately
setTimeout(function () {
window.global_test_results = test_results
}, 2000)
}
window.global_test_results = testResults
})
QUnit.testStart(function (testDetails) {
QUnit.log = function (details) {
......@@ -39,6 +38,12 @@
}
}
})
// Cleanup
QUnit.testDone(function () {
$('#qunit-fixture').empty()
$('#modal-test, .modal-backdrop').remove()
})
</script>
<!-- Plugin sources -->
......@@ -70,7 +75,7 @@
</head>
<body>
<div>
<div id="qunit-container">
<div id="qunit"></div>
<div id="qunit-fixture"></div>
</div>
......
js/tests/unit/affix.js
View file @ b5d86ad0
......@@ -19,15 +19,18 @@ $(function () {
})
test('should provide no conflict', function () {
ok(!$.fn.affix, 'affix was set back to undefined (org value)')
strictEqual($.fn.affix, undefined, 'affix was set back to undefined (org value)')
})
test('should return element', function () {
ok($(document.body).bootstrapAffix()[0] == document.body, 'document.body returned')
test('should return jquery collection containing the element', function () {
var $el = $('<div/>')
var $affix = $el.bootstrapAffix()
ok($affix instanceof $, 'returns jquery collection')
strictEqual($affix[0], $el[0], 'collection contains element')
})
test('should exit early if element is not visible', function () {
var $affix = $('<div style="display: none"></div>').bootstrapAffix()
var $affix = $('<div style="display: none"/>').bootstrapAffix()
$affix.data('bs.affix').checkPosition()
ok(!$affix.hasClass('affix'), 'affix class was not added')
})
......@@ -35,8 +38,14 @@ $(function () {
test('should trigger affixed event after affix', function () {
stop()
var template = $('<div id="affixTarget"><ul><li>Please affix</li><li>And unaffix</li></ul></div><div id="affixAfter" style="height: 20000px; display:block;"></div>')
template.appendTo('body')
var templateHTML = '<div id="affixTarget">'
+ '<ul>'
+ '<li>Please affix</li>'
+ '<li>And unaffix</li>'
+ '</ul>'
+ '</div>'
+ '<div id="affixAfter" style="height: 20000px; display: block;"/>'
$(templateHTML).appendTo(document.body)
$('#affixTarget').bootstrapAffix({
offset: $('#affixTarget ul').position()
......@@ -44,19 +53,19 @@ $(function () {
$('#affixTarget')
.on('affix.bs.affix', function () {
ok(true, 'affix event triggered')
ok(true, 'affix event fired')
}).on('affixed.bs.affix', function () {
ok(true, 'affixed event triggered')
$('#affixTarget').remove()
$('#affixAfter').remove()
ok(true, 'affixed event fired')
$('#affixTarget, #affixAfter').remove()
start()
})
setTimeout(function () {
window.scrollTo(0, document.body.scrollHeight)
setTimeout(function () {
window.scroll(0, 0)
}, 0)
}, 16) // for testing in a browser
}, 0)
})
})
js/tests/unit/alert.js
View file @ b5d86ad0
......@@ -19,52 +19,52 @@ $(function () {
})
test('should provide no conflict', function () {
ok(!$.fn.alert, 'alert was set back to undefined (org value)')
strictEqual($.fn.alert, undefined, 'alert was set back to undefined (org value)')
})
test('should return element', function () {
ok($(document.body).bootstrapAlert()[0] == document.body, 'document.body returned')
test('should return jquery collection containing the element', function () {
var $el = $('<div/>')
var $alert = $el.bootstrapAlert()
ok($alert instanceof $, 'returns jquery collection')
strictEqual($alert[0], $el[0], 'collection contains element')
})
test('should fade element out on clicking .close', function () {
var alertHTML = '<div class="alert-message warning fade in">' +
'<a class="close" href="#" data-dismiss="alert">×</a>' +
'<p><strong>Holy guacamole!</strong> Best check yo self, you\'re not looking too good.</p>' +
'</div>'
var alert = $(alertHTML).bootstrapAlert()
var alertHTML = '<div class="alert-message warning fade in">'
+ '<a class="close" href="#" data-dismiss="alert">×</a>'
+ '<p><strong>Holy guacamole!</strong> Best check yo self, you\'re not looking too good.</p>'
+ '</div>'
var $alert = $(alertHTML).bootstrapAlert()
alert.find('.close').click()
$alert.find('.close').click()
ok(!alert.hasClass('in'), 'remove .in class on .close click')
equal($alert.hasClass('in'), false, 'remove .in class on .close click')
})
test('should remove element when clicking .close', function () {
$.support.transition = false
var alertHTML = '<div class="alert-message warning fade in">'
+ '<a class="close" href="#" data-dismiss="alert">×</a>'
+ '<p><strong>Holy guacamole!</strong> Best check yo self, you\'re not looking too good.</p>'
+ '</div>'
var $alert = $(alertHTML).appendTo('#qunit-fixture').bootstrapAlert()
var alertHTML = '<div class="alert-message warning fade in">' +
'<a class="close" href="#" data-dismiss="alert">×</a>' +
'<p><strong>Holy guacamole!</strong> Best check yo self, you\'re not looking too good.</p>' +
'</div>'
var alert = $(alertHTML).appendTo('#qunit-fixture').bootstrapAlert()
notEqual($('#qunit-fixture').find('.alert-message').length, 0, 'element added to dom')
ok($('#qunit-fixture').find('.alert-message').length, 'element added to dom')
$alert.find('.close').click()
alert.find('.close').click()
ok(!$('#qunit-fixture').find('.alert-message').length, 'element removed from dom')
equal($('#qunit-fixture').find('.alert-message').length, 0, 'element removed from dom')
})
test('should not fire closed when close is prevented', function () {
$.support.transition = false
stop()
$('<div class="alert"/>')
.on('close.bs.alert', function (e) {
e.preventDefault()
ok(true)
ok(true, 'close event fired')
start()
})
.on('closed.bs.alert', function () {
ok(false)
ok(false, 'closed event fired')
})
.bootstrapAlert('close')
})
......
js/tests/unit/button.js
View file @ b5d86ad0
......@@ -19,133 +19,133 @@ $(function () {
})
test('should provide no conflict', function () {
ok(!$.fn.button, 'button was set back to undefined (org value)')
strictEqual($.fn.button, undefined, 'button was set back to undefined (org value)')
})
test('should return element', function () {
ok($(document.body).bootstrapButton()[0] == document.body, 'document.body returned')
test('should return jquery collection containing the element', function () {
var $el = $('<div/>')
var $button = $el.bootstrapButton()
ok($button instanceof $, 'returns jquery collection')
strictEqual($button[0], $el[0], 'collection contains element')
})
test('should return set state to loading', function () {
var btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
equal(btn.html(), 'mdo', 'btn text equals mdo')
btn.bootstrapButton('loading')
equal(btn.html(), 'fat', 'btn text equals fat')
var $btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
equal($btn.html(), 'mdo', 'btn text equals mdo')
$btn.bootstrapButton('loading')
equal($btn.html(), 'fat', 'btn text equals fat')
stop()
setTimeout(function () {
ok(btn.attr('disabled'), 'btn is disabled')
ok(btn.hasClass('disabled'), 'btn has disabled class')
ok($btn[0].hasAttribute('disabled'), 'btn is disabled')
ok($btn.hasClass('disabled'), 'btn has disabled class')
start()
}, 0)
})
test('should return reset state', function () {
var btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
equal(btn.html(), 'mdo', 'btn text equals mdo')
btn.bootstrapButton('loading')
equal(btn.html(), 'fat', 'btn text equals fat')
var $btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
equal($btn.html(), 'mdo', 'btn text equals mdo')
$btn.bootstrapButton('loading')
equal($btn.html(), 'fat', 'btn text equals fat')
stop()
setTimeout(function () {
ok(btn.attr('disabled'), 'btn is disabled')
ok(btn.hasClass('disabled'), 'btn has disabled class')
ok($btn[0].hasAttribute('disabled'), 'btn is disabled')
ok($btn.hasClass('disabled'), 'btn has disabled class')
start()
stop()
btn.bootstrapButton('reset')
equal(btn.html(), 'mdo', 'btn text equals mdo')
$btn.bootstrapButton('reset')
equal($btn.html(), 'mdo', 'btn text equals mdo')
setTimeout(function () {
ok(!btn.attr('disabled'), 'btn is not disabled')
ok(!btn.hasClass('disabled'), 'btn does not have disabled class')
ok(!$btn[0].hasAttribute('disabled'), 'btn is not disabled')
ok(!$btn.hasClass('disabled'), 'btn does not have disabled class')
start()
}, 0)
}, 0)
})
test('should work with an empty string as reset state', function () {
var btn = $('<button class="btn" data-loading-text="fat"></button>')
equal(btn.html(), '', 'btn text equals ""')
btn.bootstrapButton('loading')
equal(btn.html(), 'fat', 'btn text equals fat')
var $btn = $('<button class="btn" data-loading-text="fat"/>')
equal($btn.html(), '', 'btn text equals ""')
$btn.bootstrapButton('loading')
equal($btn.html(), 'fat', 'btn text equals fat')
stop()
setTimeout(function () {
ok(btn.attr('disabled'), 'btn is disabled')
ok(btn.hasClass('disabled'), 'btn has disabled class')
ok($btn[0].hasAttribute('disabled'), 'btn is disabled')
ok($btn.hasClass('disabled'), 'btn has disabled class')
start()
stop()
btn.bootstrapButton('reset')
equal(btn.html(), '', 'btn text equals ""')
$btn.bootstrapButton('reset')
equal($btn.html(), '', 'btn text equals ""')
setTimeout(function () {
ok(!btn.attr('disabled'), 'btn is not disabled')
ok(!btn.hasClass('disabled'), 'btn does not have disabled class')
ok(!$btn[0].hasAttribute('disabled'), 'btn is not disabled')
ok(!$btn.hasClass('disabled'), 'btn does not have disabled class')
start()
}, 0)
}, 0)
})
test('should toggle active', function () {
var btn = $('<button class="btn">mdo</button>')
ok(!btn.hasClass('active'), 'btn does not have active class')
btn.bootstrapButton('toggle')
ok(btn.hasClass('active'), 'btn has class active')
var $btn = $('<button class="btn">mdo</button>')
ok(!$btn.hasClass('active'), 'btn does not have active class')
$btn.bootstrapButton('toggle')
ok($btn.hasClass('active'), 'btn has class active')
})
test('should toggle active when btn children are clicked', function () {
var btn = $('<button class="btn" data-toggle="button">mdo</button>')
var inner = $('<i></i>')
btn
.append(inner)
.appendTo($('#qunit-fixture'))
ok(!btn.hasClass('active'), 'btn does not have active class')
inner.click()
ok(btn.hasClass('active'), 'btn has class active')
var $btn = $('<button class="btn" data-toggle="button">mdo</button>')
var $inner = $('<i/>')
$btn
.append($inner)
.appendTo('#qunit-fixture')
ok(!$btn.hasClass('active'), 'btn does not have active class')
$inner.click()
ok($btn.hasClass('active'), 'btn has class active')
})
test('should toggle active when btn children are clicked within btn-group', function () {
var btngroup = $('<div class="btn-group" data-toggle="buttons"></div>')
var btn = $('<button class="btn">fat</button>')
var inner = $('<i></i>')
btngroup
.append(btn.append(inner))
.appendTo($('#qunit-fixture'))
ok(!btn.hasClass('active'), 'btn does not have active class')
inner.click()
ok(btn.hasClass('active'), 'btn has class active')
var $btngroup = $('<div class="btn-group" data-toggle="buttons"/>')
var $btn = $('<button class="btn">fat</button>')
var $inner = $('<i/>')
$btngroup
.append($btn.append($inner))
.appendTo('#qunit-fixture')
ok(!$btn.hasClass('active'), 'btn does not have active class')
$inner.click()
ok($btn.hasClass('active'), 'btn has class active')
})
test('should check for closest matching toggle', function () {
var group = '<div class="btn-group" data-toggle="buttons">' +
'<label class="btn btn-primary active">' +
'<input type="radio" name="options" id="option1" checked="true"> Option 1' +
'</label>' +
'<label class="btn btn-primary">' +
'<input type="radio" name="options" id="option2"> Option 2' +
'</label>' +
'<label class="btn btn-primary">' +
'<input type="radio" name="options" id="option3"> Option 3' +
'</label>' +
'</div>'
group = $(group)
var btn1 = $(group.children()[0])
var btn2 = $(group.children()[1])
group.appendTo($('#qunit-fixture'))
ok(btn1.hasClass('active'), 'btn1 has active class')
ok(btn1.find('input').prop('checked'), 'btn1 is checked')
ok(!btn2.hasClass('active'), 'btn2 does not have active class')
ok(!btn2.find('input').prop('checked'), 'btn2 is not checked')
btn2.find('input').click()
ok(!btn1.hasClass('active'), 'btn1 does not have active class')
ok(!btn1.find('input').prop('checked'), 'btn1 is checked')
ok(btn2.hasClass('active'), 'btn2 has active class')
ok(btn2.find('input').prop('checked'), 'btn2 is checked')
btn2.find('input').click() /* clicking an already checked radio should not un-check it */
ok(!btn1.hasClass('active'), 'btn1 does not have active class')
ok(!btn1.find('input').prop('checked'), 'btn1 is checked')
ok(btn2.hasClass('active'), 'btn2 has active class')
ok(btn2.find('input').prop('checked'), 'btn2 is checked')
var groupHTML = '<div class="btn-group" data-toggle="buttons">'
+ '<label class="btn btn-primary active">'
+ '<input type="radio" name="options" id="option1" checked="true"> Option 1'
+ '</label>'
+ '<label class="btn btn-primary">'
+ '<input type="radio" name="options" id="option2"> Option 2'
+ '</label>'
+ '<label class="btn btn-primary">'
+ '<input type="radio" name="options" id="option3"> Option 3'
+ '</label>'
+ '</div>'
var $group = $(groupHTML).appendTo('#qunit-fixture')
var $btn1 = $group.children().eq(0)
var $btn2 = $group.children().eq(1)
ok($btn1.hasClass('active'), 'btn1 has active class')
ok($btn1.find('input').prop('checked'), 'btn1 is checked')
ok(!$btn2.hasClass('active'), 'btn2 does not have active class')
ok(!$btn2.find('input').prop('checked'), 'btn2 is not checked')
$btn2.find('input').click()
ok(!$btn1.hasClass('active'), 'btn1 does not have active class')
ok(!$btn1.find('input').prop('checked'), 'btn1 is checked')
ok($btn2.hasClass('active'), 'btn2 has active class')
ok($btn2.find('input').prop('checked'), 'btn2 is checked')
$btn2.find('input').click() // clicking an already checked radio should not un-check it
ok(!$btn1.hasClass('active'), 'btn1 does not have active class')
ok(!$btn1.find('input').prop('checked'), 'btn1 is checked')
ok($btn2.hasClass('active'), 'btn2 has active class')
ok($btn2.find('input').prop('checked'), 'btn2 is checked')
})
})
js/tests/unit/carousel.js
View file @ b5d86ad0
This diff is collapsed.
js/tests/unit/collapse.js
View file @ b5d86ad0
......@@ -19,156 +19,153 @@ $(function () {
})
test('should provide no conflict', function () {
ok(!$.fn.collapse, 'collapse was set back to undefined (org value)')
strictEqual($.fn.collapse, undefined, 'collapse was set back to undefined (org value)')
})
test('should return element', function () {
ok($(document.body).bootstrapCollapse()[0] == document.body, 'document.body returned')
test('should return jquery collection containing the element', function () {
var $el = $('<div/>')
var $collapse = $el.bootstrapCollapse()
ok($collapse instanceof $, 'returns jquery collection')
strictEqual($collapse[0], $el[0], 'collection contains element')
})
test('should show a collapsed element', function () {
var el = $('<div class="collapse"></div>').bootstrapCollapse('show')
ok(el.hasClass('in'), 'has class in')
ok(!/height/.test(el.attr('style')), 'has height reset')
var $el = $('<div class="collapse"/>').bootstrapCollapse('show')
ok($el.hasClass('in'), 'has class "in"')
ok(!/height/.test($el.attr('style')), 'has height reset')
})
test('should hide a collapsed element', function () {
var el = $('<div class="collapse"></div>').bootstrapCollapse('hide')
ok(!el.hasClass('in'), 'does not have class in')
ok(/height/.test(el.attr('style')), 'has height set')
var $el = $('<div class="collapse"/>').bootstrapCollapse('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)
ok(true, 'show event fired')
start()
})
.on('shown.bs.collapse', function () {
ok(false)
ok(false, 'shown event fired')
})
.bootstrapCollapse('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')
equal(this.style.height, '0px', 'height is 0px')
})
.on('shown.bs.collapse', function () {
ok(this.style.height === '')
strictEqual(this.style.height, '', 'height is auto')
start()
})
.bootstrapCollapse('show')
})
test('should add active class to target when collapse shown', function () {
$.support.transition = false
test('should remove "collapsed" class from target when collapse is shown', function () {
stop()
var target = $('<a data-toggle="collapse" href="#test1"></a>')
.appendTo($('#qunit-fixture'))
var $target = $('<a data-toggle="collapse" href="#test1"/>').appendTo('#qunit-fixture')
$('<div id="test1"></div>')
.appendTo($('#qunit-fixture'))
$('<div id="test1"/>')
.appendTo('#qunit-fixture')
.on('show.bs.collapse', function () {
ok(!target.hasClass('collapsed'))
ok(!$target.hasClass('collapsed'))
start()
})
target.click()
$target.click()
})
test('should remove active class to target when collapse hidden', function () {
$.support.transition = false
test('should add "collapsed" class to target when collapse is hidden', function () {
stop()
var target = $('<a data-toggle="collapse" href="#test1"></a>')
.appendTo($('#qunit-fixture'))
var $target = $('<a data-toggle="collapse" href="#test1"/>').appendTo('#qunit-fixture')
$('<div id="test1" class="in"></div>')
.appendTo($('#qunit-fixture'))
$('<div id="test1" class="in"/>')
.appendTo('#qunit-fixture')
.on('hide.bs.collapse', function () {
ok(target.hasClass('collapsed'))
ok($target.hasClass('collapsed'))
start()
})
target.click()
$target.click()
})
test('should remove active class from inactive accordion targets', function () {
$.support.transition = false
test('should remove "collapsed" class from active accordion target', function () {
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 accordionHTML = '<div id="accordion">'
+ '<div class="accordion-group"/>'
+ '<div class="accordion-group"/>'
+ '<div class="accordion-group"/>'
+ '</div>'
var $groups = $(accordionHTML).appendTo('#qunit-fixture').find('.accordion-group')
var target1 = $('<a data-toggle="collapse" href="#body1" data-parent="#accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(0))
var $target1 = $('<a data-toggle="collapse" href="#body1" data-parent="#accordion"/>').appendTo($groups.eq(0))
$('<div id="body1" class="in"></div>')
.appendTo(accordion.find('.accordion-group').eq(0))
$('<div id="body1" class="in"/>').appendTo($groups.eq(0))
var target2 = $('<a class="collapsed" data-toggle="collapse" href="#body2" data-parent="#accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(1))
var $target2 = $('<a class="collapsed" data-toggle="collapse" href="#body2" data-parent="#accordion"/>').appendTo($groups.eq(1))
$('<div id="body2"></div>')
.appendTo(accordion.find('.accordion-group').eq(1))
$('<div id="body2"/>').appendTo($groups.eq(1))
var target3 = $('<a class="collapsed" data-toggle="collapse" href="#body3" data-parent="#accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(2))
var $target3 = $('<a class="collapsed" data-toggle="collapse" href="#body3" data-parent="#accordion"/>').appendTo($groups.eq(2))
$('<div id="body3"></div>')
.appendTo(accordion.find('.accordion-group').eq(2))
$('<div id="body3"/>')
.appendTo($groups.eq(2))
.on('show.bs.collapse', function () {
ok(target1.hasClass('collapsed'))
ok(target2.hasClass('collapsed'))
ok(!target3.hasClass('collapsed'))
ok($target1.hasClass('collapsed'), 'inactive target 1 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"')
start()
})
target3.click()
$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 accordionHTML = '<div class="accordion">'
+ '<div class="accordion-group"/>'
+ '<div class="accordion-group"/>'
+ '<div class="accordion-group"/>'
+ '</div>'
var $groups = $(accordionHTML).appendTo('#qunit-fixture').find('.accordion-group')
var target1 = $('<a data-toggle="collapse" href="#body1" data-parent=".accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(0))
var $target1 = $('<a data-toggle="collapse" href="#body1" data-parent=".accordion"/>').appendTo($groups.eq(0))
$('<div id="body1" class="in"></div>')
.appendTo(accordion.find('.accordion-group').eq(0))
$('<div id="body1" class="in"/>').appendTo($groups.eq(0))
var target2 = $('<a class="collapsed" data-toggle="collapse" href="#body2" data-parent=".accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(1))
var $target2 = $('<a class="collapsed" data-toggle="collapse" href="#body2" data-parent=".accordion"/>').appendTo($groups.eq(1))
$('<div id="body2"></div>')
.appendTo(accordion.find('.accordion-group').eq(1))
$('<div id="body2"/>').appendTo($groups.eq(1))
var target3 = $('<a class="collapsed" data-toggle="collapse" href="#body3" data-parent=".accordion"></a>')
.appendTo(accordion.find('.accordion-group').eq(2))
var $target3 = $('<a class="collapsed" data-toggle="collapse" href="#body3" data-parent=".accordion"/>').appendTo($groups.eq(2))
$('<div id="body3"></div>')
.appendTo(accordion.find('.accordion-group').eq(2))
$('<div id="body3"/>')
.appendTo($groups.eq(2))
.on('show.bs.collapse', function () {
ok(target1.hasClass('collapsed'))
ok(target2.hasClass('collapsed'))
ok(!target3.hasClass('collapsed'))
ok($target1.hasClass('collapsed'), 'inactive target 1 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"')
start()
})
target3.click()
$target3.click()
})
})
js/tests/unit/dropdown.js
View file @ b5d86ad0
This diff is collapsed.
js/tests/unit/modal.js
View file @ b5d86ad0
This diff is collapsed.
js/tests/unit/phantom.js
View file @ b5d86ad0
......@@ -2,7 +2,7 @@
* grunt-contrib-qunit
* http://gruntjs.com/
*
* Copyright (c) 2013 "Cowboy" Ben Alman, contributors
* Copyright (c) 2014 "Cowboy" Ben Alman, contributors
* Licensed under the MIT license.
*/
......@@ -21,48 +21,52 @@
}
// These methods connect QUnit to PhantomJS.
QUnit.log = function (obj) {
QUnit.log(function (obj) {
// What is this I don’t even
if (obj.message === '[object Object], undefined:undefined') { return }
// Parse some stuff before sending it.
var actual = QUnit.jsDump.parse(obj.actual)
var expected = QUnit.jsDump.parse(obj.expected)
var actual
var expected
if (!obj.result) {
// Dumping large objects can be very slow, and the dump isn't used for
// passing tests, so only dump if the test failed.
actual = QUnit.jsDump.parse(obj.actual)
expected = QUnit.jsDump.parse(obj.expected)
}
// Send it.
sendMessage('qunit.log', obj.result, actual, expected, obj.message, obj.source)
}
})
QUnit.testStart = function (obj) {
QUnit.testStart(function (obj) {
sendMessage('qunit.testStart', obj.name)
}
})
QUnit.testDone = function (obj) {
sendMessage('qunit.testDone', obj.name, obj.failed, obj.passed, obj.total)
}
QUnit.testDone(function (obj) {
sendMessage('qunit.testDone', obj.name, obj.failed, obj.passed, obj.total, obj.duration)
})
QUnit.moduleStart = function (obj) {
QUnit.moduleStart(function (obj) {
sendMessage('qunit.moduleStart', obj.name)
}
})
QUnit.begin = function () {
sendMessage('qunit.begin')
console.log('Starting test suite')
console.log('================================================\n')
}
QUnit.moduleDone = function (opts) {
if (opts.failed === 0) {
console.log('\r\u2714 All tests passed in "' + opts.name + '" module')
QUnit.moduleDone(function (obj) {
if (obj.failed === 0) {
console.log('\r\u2714 All tests passed in "' + obj.name + '" module')
} else {
console.log('\u2716 ' + opts.failed + ' tests failed in "' + opts.name + '" module')
console.log('\u2716 ' + obj.failed + ' tests failed in "' + obj.name + '" module')
}
sendMessage('qunit.moduleDone', opts.name, opts.failed, opts.passed, opts.total)
}
sendMessage('qunit.moduleDone', obj.name, obj.failed, obj.passed, obj.total)
})
QUnit.done = function (opts) {
console.log('\n================================================')
console.log('Tests completed in ' + opts.runtime + ' milliseconds')
console.log(opts.passed + ' tests of ' + opts.total + ' passed, ' + opts.failed + ' failed.')
sendMessage('qunit.done', opts.failed, opts.passed, opts.total, opts.runtime)
}
QUnit.begin(function () {
sendMessage('qunit.begin')
console.log('\n\nStarting test suite')
console.log('================================================\n')
})
QUnit.done(function (obj) {
sendMessage('qunit.done', obj.failed, obj.passed, obj.total, obj.runtime)
})
}())
js/tests/unit/popover.js
View file @ b5d86ad0
This diff is collapsed.
js/tests/unit/scrollspy.js
View file @ b5d86ad0
......@@ -19,100 +19,107 @@ $(function () {
})
test('should provide no conflict', function () {
ok(!$.fn.scrollspy, 'scrollspy was set back to undefined (org value)')
strictEqual($.fn.scrollspy, undefined, 'scrollspy was set back to undefined (org value)')
})
test('should return element', function () {
ok($(document.body).bootstrapScrollspy()[0] == document.body, 'document.body returned')
test('should return jquery collection containing the element', function () {
var $el = $('<div/>')
var $scrollspy = $el.bootstrapScrollspy()
ok($scrollspy instanceof $, 'returns jquery collection')
strictEqual($scrollspy[0], $el[0], 'collection contains element')
})
test('should switch active class on scroll', function () {
var sectionHTML = '<div id="masthead"></div>'
$(sectionHTML).append('#qunit-fixture')
var topbarHTML = '<div class="topbar">' +
'<div class="topbar-inner">' +
'<div class="container">' +
'<h3><a href="#">Bootstrap</a></h3>' +
'<li><a href="#masthead">Overview</a></li>' +
'</ul>' +
'</div>' +
'</div>' +
'</div>'
// Does not work properly ATM, #13500 will fix this
test('should switch "active" class on scroll', function () {
var topbarHTML = '<div class="topbar">'
+ '<div class="topbar-inner">'
+ '<div class="container">'
+ '<h3><a href="#">Bootstrap</a></h3>'
+ '<li><a href="#masthead">Overview</a></li>'
+ '</ul>'
+ '</div>'
+ '</div>'
+ '</div>'
var $topbar = $(topbarHTML).bootstrapScrollspy()
$(sectionHTML).append('#qunit-fixture')
ok($topbar.find('.active', true))
})
asyncTest('should only switch active class on current target', function () {
expect(1);
var sectionHTML = '<div id="root" class="active">' +
'<div class="topbar">' +
'<div class="topbar-inner">' +
'<div class="container" id="ss-target">' +
'<ul class="nav">' +
'<li><a href="#masthead">Overview</a></li>' +
'<li><a href="#detail">Detail</a></li>' +
'</ul>' +
'</div>' +
'</div>' +
'</div>' +
'<div id="scrollspy-example" style="height: 100px; overflow: auto;">' +
'<div style="height: 200px;">' +
'<h4 id="masthead">Overview</h4>' +
'<p style="height: 200px">' +
'Ad leggings keytar, brunch id art party dolor labore.' +
'</p>' +
'</div>' +
'<div style="height: 200px;">' +
'<h4 id="detail">Detail</h4>' +
'<p style="height: 200px">' +
'Veniam marfa mustache skateboard, adipisicing fugiat velit pitchfork beard.' +
'</p>' +
'</div>' +
'</div>' +
'</div>'
test('should only switch "active" class on current target', function () {
stop()
var sectionHTML = '<div id="root" class="active">'
+ '<div class="topbar">'
+ '<div class="topbar-inner">'
+ '<div class="container" id="ss-target">'
+ '<ul class="nav">'
+ '<li><a href="#masthead">Overview</a></li>'
+ '<li><a href="#detail">Detail</a></li>'
+ '</ul>'
+ '</div>'
+ '</div>'
+ '</div>'
+ '<div id="scrollspy-example" style="height: 100px; overflow: auto;">'
+ '<div style="height: 200px;">'
+ '<h4 id="masthead">Overview</h4>'
+ '<p style="height: 200px">'
+ 'Ad leggings keytar, brunch id art party dolor labore.'
+ '</p>'
+ '</div>'
+ '<div style="height: 200px;">'
+ '<h4 id="detail">Detail</h4>'
+ '<p style="height: 200px">'
+ 'Veniam marfa mustache skateboard, adipisicing fugiat velit pitchfork beard.'
+ '</p>'
+ '</div>'
+ '</div>'
+ '</div>'
var $section = $(sectionHTML).appendTo('#qunit-fixture')
var $scrollSpy = $section
var $scrollspy = $section
.show()
.find('#scrollspy-example')
.bootstrapScrollspy({ target: '#ss-target' })
$scrollSpy.on('scroll.bs.scrollspy', function () {
ok($section.hasClass('active'), 'Active class still on root node')
$scrollspy.on('scroll.bs.scrollspy', function () {
ok($section.hasClass('active'), '"active" class still on root node')
start()
})
$scrollSpy.scrollTop(350);
$scrollspy.scrollTop(350)
})
asyncTest('middle navigation option correctly selected when large offset is used', function () {
expect(3);
var sectionHTML = '<div id="header" style="height: 500px;"></div>' +
'<nav id="navigation" class="navbar">' +
'<ul class="nav navbar-nav">' +
'<li class="active"><a id="one-link" href="#one">One</a></li>' +
'<li><a id="two-link" href="#two">Two</a></li>' +
'<li><a id="three-link" href="#three">Three</a></li>' +
'</ul>' +
'</nav>' +
'<div id="content" style="height: 200px; overflow-y: auto;">' +
'<div id="one" style="height: 500px;"></div>' +
'<div id="two" style="height: 300px;"></div>' +
'<div id="three" style="height: 10px;"></div>' +
'</div>'
test('middle navigation option correctly selected when large offset is used', function () {
stop()
var sectionHTML = '<div id="header" style="height: 500px;"></div>'
+ '<nav id="navigation" class="navbar">'
+ '<ul class="nav navbar-nav">'
+ '<li class="active"><a id="one-link" href="#one">One</a></li>'
+ '<li><a id="two-link" href="#two">Two</a></li>'
+ '<li><a id="three-link" href="#three">Three</a></li>'
+ '</ul>'
+ '</nav>'
+ '<div id="content" style="height: 200px; overflow-y: auto;">'
+ '<div id="one" style="height: 500px;"></div>'
+ '<div id="two" style="height: 300px;"></div>'
+ '<div id="three" style="height: 10px;"></div>'
+ '</div>'
var $section = $(sectionHTML).appendTo('#qunit-fixture')
var $scrollSpy = $section
var $scrollspy = $section
.show()
.filter('#content')
$scrollSpy.bootstrapScrollspy({ target: '#navigation', offset: $scrollSpy.position().top })
$scrollSpy.on('scroll.bs.scrollspy', function () {
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('#three-link').parent().hasClass('active'), 'Active class not on last section')
$scrollspy.bootstrapScrollspy({ target: '#navigation', offset: $scrollspy.position().top })
$scrollspy.on('scroll.bs.scrollspy', function () {
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('#three-link').parent().hasClass('active'), '"active" class not on last section')
start()
})
$scrollSpy.scrollTop(550);
$scrollspy.scrollTop(550)
})
test('should add the active class to the correct element', function () {
......
js/tests/unit/tab.js
View file @ b5d86ad0
......@@ -19,20 +19,23 @@ $(function () {
})
test('should provide no conflict', function () {
ok(!$.fn.tab, 'tab was set back to undefined (org value)')
strictEqual($.fn.tab, undefined, 'tab was set back to undefined (org value)')
})
test('should return element', function () {
ok($(document.body).bootstrapTab()[0] == document.body, 'document.body returned')
test('should return jquery collection containing the element', function () {
var $el = $('<div/>')
var $tab = $el.bootstrapTab()
ok($tab instanceof $, 'returns jquery collection')
strictEqual($tab[0], $el[0], 'collection contains element')
})
test('should activate element by tab id', function () {
var tabsHTML = '<ul class="tabs">' +
'<li><a href="#home">Home</a></li>' +
'<li><a href="#profile">Profile</a></li>' +
'</ul>'
var tabsHTML = '<ul class="tabs">'
+ '<li><a href="#home">Home</a></li>'
+ '<li><a href="#profile">Profile</a></li>'
+ '</ul>'
$('<ul><li id="home"></li><li id="profile"></li></ul>').appendTo('#qunit-fixture')
$('<ul><li id="home"/><li id="profile"/></ul>').appendTo('#qunit-fixture')
$(tabsHTML).find('li:last a').bootstrapTab('show')
equal($('#qunit-fixture').find('.active').attr('id'), 'profile')
......@@ -42,12 +45,12 @@ $(function () {
})
test('should activate element by tab id', function () {
var pillsHTML = '<ul class="pills">' +
'<li><a href="#home">Home</a></li>' +
'<li><a href="#profile">Profile</a></li>' +
'</ul>'
var pillsHTML = '<ul class="pills">'
+ '<li><a href="#home">Home</a></li>'
+ '<li><a href="#profile">Profile</a></li>'
+ '</ul>'
$('<ul><li id="home"></li><li id="profile"></li></ul>').appendTo('#qunit-fixture')
$('<ul><li id="home"/><li id="profile"/></ul>').appendTo('#qunit-fixture')
$(pillsHTML).find('li:last a').bootstrapTab('show')
equal($('#qunit-fixture').find('.active').attr('id'), 'profile')
......@@ -56,41 +59,46 @@ $(function () {
equal($('#qunit-fixture').find('.active').attr('id'), 'home')
})
test('should not fire closed when close is prevented', function () {
$.support.transition = false
test('should not fire shown when show is prevented', function () {
stop()
$('<div class="tab"/>')
.on('show.bs.tab', function (e) {
e.preventDefault()
ok(true)
ok(true, 'show event fired')
start()
})
.on('shown.bs.tab', function () {
ok(false)
ok(false, 'shown event fired')
})
.bootstrapTab('show')
})
test('show and shown events should reference correct relatedTarget', function () {
var dropHTML = '<ul class="drop">' +
'<li class="dropdown"><a data-toggle="dropdown" href="#">1</a>' +
'<ul class="dropdown-menu">' +
'<li><a href="#1-1" data-toggle="tab">1-1</a></li>' +
'<li><a href="#1-2" data-toggle="tab">1-2</a></li>' +
'</ul>' +
'</li>' +
'</ul>'
$(dropHTML).find('ul>li:first a').bootstrapTab('show').end()
.find('ul>li:last a')
.on('show.bs.tab', function (event) {
equal(event.relatedTarget.hash, '#1-1')
})
.on('show.bs.tab', function (event) {
equal(event.relatedTarget.hash, '#1-1')
})
.bootstrapTab('show')
stop()
var dropHTML = '<ul class="drop">'
+ '<li class="dropdown"><a data-toggle="dropdown" href="#">1</a>'
+ '<ul class="dropdown-menu">'
+ '<li><a href="#1-1" data-toggle="tab">1-1</a></li>'
+ '<li><a href="#1-2" data-toggle="tab">1-2</a></li>'
+ '</ul>'
+ '</li>'
+ '</ul>'
$(dropHTML)
.find('ul > li:first a')
.bootstrapTab('show')
.end()
.find('ul > li:last a')
.on('show.bs.tab', function (e) {
equal(e.relatedTarget.hash, '#1-1', 'references correct element as relatedTarget')
start()
})
.on('shown.bs.tab', function (e) {
equal(e.relatedTarget.hash, '#1-1', 'references correct element as relatedTarget')
})
.bootstrapTab('show')
})
})
js/tests/unit/tooltip.js
View file @ b5d86ad0
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment