mirror of
https://github.com/tenrok/bootstrap.git
synced 2026-06-08 17:22:31 +03:00
convert to jekyll
This commit is contained in:
Mark Otto
+25
@@ -0,0 +1,25 @@
|
||||
$(function () {
|
||||
|
||||
module("bootstrap-affix")
|
||||
|
||||
test("should provide no conflict", function () {
|
||||
var affix = $.fn.affix.noConflict()
|
||||
ok(!$.fn.affix, 'affix was set back to undefined (org value)')
|
||||
$.fn.affix = affix
|
||||
})
|
||||
|
||||
test("should be defined on jquery object", function () {
|
||||
ok($(document.body).affix, 'affix method is defined')
|
||||
})
|
||||
|
||||
test("should return element", function () {
|
||||
ok($(document.body).affix()[0] == document.body, 'document.body returned')
|
||||
})
|
||||
|
||||
test("should exit early if element is not visible", function () {
|
||||
var $affix = $('<div style="display: none"></div>').affix()
|
||||
$affix.data('affix').checkPosition()
|
||||
ok(!$affix.hasClass('affix'), 'affix class was not added')
|
||||
})
|
||||
|
||||
})
|
||||
+62
@@ -0,0 +1,62 @@
|
||||
$(function () {
|
||||
|
||||
module("bootstrap-alerts")
|
||||
|
||||
test("should provide no conflict", function () {
|
||||
var alert = $.fn.alert.noConflict()
|
||||
ok(!$.fn.alert, 'alert was set back to undefined (org value)')
|
||||
$.fn.alert = alert
|
||||
})
|
||||
|
||||
test("should be defined on jquery object", function () {
|
||||
ok($(document.body).alert, 'alert method is defined')
|
||||
})
|
||||
|
||||
test("should return element", function () {
|
||||
ok($(document.body).alert()[0] == document.body, 'document.body returned')
|
||||
})
|
||||
|
||||
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>'
|
||||
, alert = $(alertHTML).alert()
|
||||
|
||||
alert.find('.close').click()
|
||||
|
||||
ok(!alert.hasClass('in'), '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>'
|
||||
, alert = $(alertHTML).appendTo('#qunit-fixture').alert()
|
||||
|
||||
ok($('#qunit-fixture').find('.alert-message').length, 'element added to dom')
|
||||
|
||||
alert.find('.close').click()
|
||||
|
||||
ok(!$('#qunit-fixture').find('.alert-message').length, 'element removed from dom')
|
||||
})
|
||||
|
||||
test("should not fire closed when close is prevented", function () {
|
||||
$.support.transition = false
|
||||
stop();
|
||||
$('<div class="alert"/>')
|
||||
.bind('close', function (e) {
|
||||
e.preventDefault();
|
||||
ok(true);
|
||||
start();
|
||||
})
|
||||
.bind('closed', function () {
|
||||
ok(false);
|
||||
})
|
||||
.alert('close')
|
||||
})
|
||||
|
||||
})
|
||||
+102
@@ -0,0 +1,102 @@
|
||||
$(function () {
|
||||
|
||||
module("bootstrap-buttons")
|
||||
|
||||
test("should provide no conflict", function () {
|
||||
var button = $.fn.button.noConflict()
|
||||
ok(!$.fn.button, 'button was set back to undefined (org value)')
|
||||
$.fn.button = button
|
||||
})
|
||||
|
||||
test("should be defined on jquery object", function () {
|
||||
ok($(document.body).button, 'button method is defined')
|
||||
})
|
||||
|
||||
test("should return element", function () {
|
||||
ok($(document.body).button()[0] == document.body, 'document.body returned')
|
||||
})
|
||||
|
||||
test("should return set state to loading", function () {
|
||||
var btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
|
||||
equals(btn.html(), 'mdo', 'btn text equals mdo')
|
||||
btn.button('loading')
|
||||
equals(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')
|
||||
start()
|
||||
}, 0)
|
||||
})
|
||||
|
||||
test("should return reset state", function () {
|
||||
var btn = $('<button class="btn" data-loading-text="fat">mdo</button>')
|
||||
equals(btn.html(), 'mdo', 'btn text equals mdo')
|
||||
btn.button('loading')
|
||||
equals(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')
|
||||
start()
|
||||
stop()
|
||||
}, 0)
|
||||
btn.button('reset')
|
||||
equals(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')
|
||||
start()
|
||||
}, 0)
|
||||
})
|
||||
|
||||
test("should toggle active", function () {
|
||||
var btn = $('<button class="btn">mdo</button>')
|
||||
ok(!btn.hasClass('active'), 'btn does not have active class')
|
||||
btn.button('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>')
|
||||
, 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')
|
||||
})
|
||||
|
||||
test("should toggle active when btn children are clicked within btn-group", function () {
|
||||
var btngroup = $('<div class="btn-group" data-toggle="buttons-checkbox"></div>')
|
||||
, btn = $('<button class="btn">fat</button>')
|
||||
, 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')
|
||||
})
|
||||
|
||||
test("should check for closest matching toggle", function () {
|
||||
var group = $("<div data-toggle='buttons-radio'></div>")
|
||||
, btn1 = $("<button class='btn active'></button>")
|
||||
, btn2 = $("<button class='btn'></button>")
|
||||
, wrap = $("<div></div>")
|
||||
|
||||
wrap.append(btn1, btn2)
|
||||
|
||||
group
|
||||
.append(wrap)
|
||||
.appendTo($('#qunit-fixture'))
|
||||
|
||||
ok(btn1.hasClass('active'), 'btn1 has active class')
|
||||
ok(!btn2.hasClass('active'), 'btn2 does not have active class')
|
||||
btn2.click()
|
||||
ok(!btn1.hasClass('active'), 'btn1 does not have active class')
|
||||
ok(btn2.hasClass('active'), 'btn2 has active class')
|
||||
})
|
||||
|
||||
})
|
||||
@@ -0,0 +1,81 @@
|
||||
$(function () {
|
||||
|
||||
module("bootstrap-carousel")
|
||||
|
||||
test("should provide no conflict", function () {
|
||||
var carousel = $.fn.carousel.noConflict()
|
||||
ok(!$.fn.carousel, 'carousel was set back to undefined (org value)')
|
||||
$.fn.carousel = carousel
|
||||
})
|
||||
|
||||
test("should be defined on jquery object", function () {
|
||||
ok($(document.body).carousel, 'carousel method is defined')
|
||||
})
|
||||
|
||||
test("should return element", function () {
|
||||
ok($(document.body).carousel()[0] == document.body, 'document.body returned')
|
||||
})
|
||||
|
||||
test("should not fire sliden when slide is prevented", function () {
|
||||
$.support.transition = false
|
||||
stop()
|
||||
$('<div class="carousel"/>')
|
||||
.bind('slide', function (e) {
|
||||
e.preventDefault();
|
||||
ok(true);
|
||||
start();
|
||||
})
|
||||
.bind('slid', function () {
|
||||
ok(false);
|
||||
})
|
||||
.carousel('next')
|
||||
})
|
||||
|
||||
test("should fire slide event with direction", function () {
|
||||
var template = '<div id="myCarousel" class="carousel slide"><div class="carousel-inner"><div class="item active"><img alt=""><div class="carousel-caption"><h4>{{_i}}First Thumbnail label{{/i}}</h4><p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p></div></div><div class="item"><img alt=""><div class="carousel-caption"><h4>{{_i}}Second Thumbnail label{{/i}}</h4><p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p></div></div><div class="item"><img alt=""><div class="carousel-caption"><h4>{{_i}}Third Thumbnail label{{/i}}</h4><p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p></div></div></div><a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a><a class="right carousel-control" href="#myCarousel" data-slide="next">›</a></div>'
|
||||
$.support.transition = false
|
||||
stop()
|
||||
$(template).on('slide', function (e) {
|
||||
e.preventDefault()
|
||||
ok(e.direction)
|
||||
ok(e.direction === 'right' || e.direction === 'left')
|
||||
start()
|
||||
}).carousel('next')
|
||||
})
|
||||
|
||||
test("should fire slide event with relatedTarget", function () {
|
||||
var template = '<div id="myCarousel" class="carousel slide"><div class="carousel-inner"><div class="item active"><img alt=""><div class="carousel-caption"><h4>{{_i}}First Thumbnail label{{/i}}</h4><p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p></div></div><div class="item"><img alt=""><div class="carousel-caption"><h4>{{_i}}Second Thumbnail label{{/i}}</h4><p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p></div></div><div class="item"><img alt=""><div class="carousel-caption"><h4>{{_i}}Third Thumbnail label{{/i}}</h4><p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p></div></div></div><a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a><a class="right carousel-control" href="#myCarousel" data-slide="next">›</a></div>'
|
||||
$.support.transition = false
|
||||
stop()
|
||||
$(template)
|
||||
.on('slide', function (e) {
|
||||
e.preventDefault();
|
||||
ok(e.relatedTarget);
|
||||
ok($(e.relatedTarget).hasClass('item'));
|
||||
start();
|
||||
})
|
||||
.carousel('next')
|
||||
})
|
||||
|
||||
test("should set interval from data attribute", 3,function () {
|
||||
var template = $('<div id="myCarousel" class="carousel slide"> <div class="carousel-inner"> <div class="item active"> <img alt=""> <div class="carousel-caption"> <h4>{{_i}}First Thumbnail label{{/i}}</h4> <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p> </div> </div> <div class="item"> <img alt=""> <div class="carousel-caption"> <h4>{{_i}}Second Thumbnail label{{/i}}</h4> <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p> </div> </div> <div class="item"> <img alt=""> <div class="carousel-caption"> <h4>{{_i}}Third Thumbnail label{{/i}}</h4> <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p> </div> </div> </div> <a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a> <a class="right carousel-control" href="#myCarousel" data-slide="next">›</a> </div>');
|
||||
template.attr("data-interval", 1814);
|
||||
|
||||
template.appendTo("body");
|
||||
$('[data-slide]').first().click();
|
||||
ok($('#myCarousel').data('carousel').options.interval == 1814);
|
||||
$('#myCarousel').remove();
|
||||
|
||||
template.appendTo("body").attr("data-modal", "foobar");
|
||||
$('[data-slide]').first().click();
|
||||
ok($('#myCarousel').data('carousel').options.interval == 1814, "even if there is an data-modal attribute set");
|
||||
$('#myCarousel').remove();
|
||||
|
||||
template.appendTo("body");
|
||||
$('[data-slide]').first().click();
|
||||
$('#myCarousel').attr('data-interval', 1860);
|
||||
$('[data-slide]').first().click();
|
||||
ok($('#myCarousel').data('carousel').options.interval == 1814, "attributes should be read only on intitialization");
|
||||
$('#myCarousel').remove();
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,94 @@
|
||||
$(function () {
|
||||
|
||||
module("bootstrap-collapse")
|
||||
|
||||
test("should provide no conflict", function () {
|
||||
var collapse = $.fn.collapse.noConflict()
|
||||
ok(!$.fn.collapse, 'collapse was set back to undefined (org value)')
|
||||
$.fn.collapse = collapse
|
||||
})
|
||||
|
||||
test("should be defined on jquery object", function () {
|
||||
ok($(document.body).collapse, 'collapse method is defined')
|
||||
})
|
||||
|
||||
test("should return element", function () {
|
||||
ok($(document.body).collapse()[0] == document.body, 'document.body returned')
|
||||
})
|
||||
|
||||
test("should show a collapsed element", function () {
|
||||
var el = $('<div class="collapse"></div>').collapse('show')
|
||||
ok(el.hasClass('in'), 'has class in')
|
||||
ok(/height/.test(el.attr('style')), 'has height set')
|
||||
})
|
||||
|
||||
test("should hide a collapsed element", function () {
|
||||
var el = $('<div class="collapse"></div>').collapse('hide')
|
||||
ok(!el.hasClass('in'), 'does not have class in')
|
||||
ok(/height/.test(el.attr('style')), 'has height set')
|
||||
})
|
||||
|
||||
test("should not fire shown when show is prevented", function () {
|
||||
$.support.transition = false
|
||||
stop()
|
||||
$('<div class="collapse"/>')
|
||||
.bind('show', function (e) {
|
||||
e.preventDefault();
|
||||
ok(true);
|
||||
start();
|
||||
})
|
||||
.bind('shown', function () {
|
||||
ok(false);
|
||||
})
|
||||
.collapse('show')
|
||||
})
|
||||
|
||||
test("should reset style to auto after finishing opening collapse", function () {
|
||||
$.support.transition = false
|
||||
stop()
|
||||
$('<div class="collapse" style="height: 0px"/>')
|
||||
.bind('show', function () {
|
||||
ok(this.style.height == '0px')
|
||||
})
|
||||
.bind('shown', function () {
|
||||
ok(this.style.height == 'auto')
|
||||
start()
|
||||
})
|
||||
.collapse('show')
|
||||
})
|
||||
|
||||
test("should add active class to target when collapse shown", function () {
|
||||
$.support.transition = false
|
||||
stop()
|
||||
|
||||
var target = $('<a data-toggle="collapse" href="#test1"></a>')
|
||||
.appendTo($('#qunit-fixture'))
|
||||
|
||||
var collapsible = $('<div id="test1"></div>')
|
||||
.appendTo($('#qunit-fixture'))
|
||||
.on('show', function () {
|
||||
ok(!target.hasClass('collapsed'))
|
||||
start()
|
||||
})
|
||||
|
||||
target.click()
|
||||
})
|
||||
|
||||
test("should remove active class to target when collapse hidden", function () {
|
||||
$.support.transition = false
|
||||
stop()
|
||||
|
||||
var target = $('<a data-toggle="collapse" href="#test1"></a>')
|
||||
.appendTo($('#qunit-fixture'))
|
||||
|
||||
var collapsible = $('<div id="test1" class="in"></div>')
|
||||
.appendTo($('#qunit-fixture'))
|
||||
.on('hide', function () {
|
||||
ok(target.hasClass('collapsed'))
|
||||
start()
|
||||
})
|
||||
|
||||
target.click()
|
||||
})
|
||||
|
||||
})
|
||||
+151
@@ -0,0 +1,151 @@
|
||||
$(function () {
|
||||
|
||||
module("bootstrap-dropdowns")
|
||||
|
||||
test("should provide no conflict", function () {
|
||||
var dropdown = $.fn.dropdown.noConflict()
|
||||
ok(!$.fn.dropdown, 'dropdown was set back to undefined (org value)')
|
||||
$.fn.dropdown = dropdown
|
||||
})
|
||||
|
||||
test("should be defined on jquery object", function () {
|
||||
ok($(document.body).dropdown, 'dropdown method is defined')
|
||||
})
|
||||
|
||||
test("should return element", function () {
|
||||
var el = $("<div />")
|
||||
ok(el.dropdown()[0] === el[0], 'same element returned')
|
||||
})
|
||||
|
||||
test("should not open dropdown if target is disabled", function () {
|
||||
var dropdownHTML = '<ul class="tabs">'
|
||||
+ '<li class="dropdown">'
|
||||
+ '<button disabled href="#" class="btn dropdown-toggle" data-toggle="dropdown">Dropdown</button>'
|
||||
+ '<ul class="dropdown-menu">'
|
||||
+ '<li><a href="#">Secondary link</a></li>'
|
||||
+ '<li><a href="#">Something else here</a></li>'
|
||||
+ '<li class="divider"></li>'
|
||||
+ '<li><a href="#">Another link</a></li>'
|
||||
+ '</ul>'
|
||||
+ '</li>'
|
||||
+ '</ul>'
|
||||
, dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()
|
||||
|
||||
ok(!dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
|
||||
})
|
||||
|
||||
test("should not open dropdown if target is disabled", function () {
|
||||
var dropdownHTML = '<ul class="tabs">'
|
||||
+ '<li class="dropdown">'
|
||||
+ '<button href="#" class="btn dropdown-toggle disabled" data-toggle="dropdown">Dropdown</button>'
|
||||
+ '<ul class="dropdown-menu">'
|
||||
+ '<li><a href="#">Secondary link</a></li>'
|
||||
+ '<li><a href="#">Something else here</a></li>'
|
||||
+ '<li class="divider"></li>'
|
||||
+ '<li><a href="#">Another link</a></li>'
|
||||
+ '</ul>'
|
||||
+ '</li>'
|
||||
+ '</ul>'
|
||||
, dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()
|
||||
|
||||
ok(!dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
|
||||
})
|
||||
|
||||
test("should add class open to menu if clicked", function () {
|
||||
var dropdownHTML = '<ul class="tabs">'
|
||||
+ '<li class="dropdown">'
|
||||
+ '<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>'
|
||||
+ '<ul class="dropdown-menu">'
|
||||
+ '<li><a href="#">Secondary link</a></li>'
|
||||
+ '<li><a href="#">Something else here</a></li>'
|
||||
+ '<li class="divider"></li>'
|
||||
+ '<li><a href="#">Another link</a></li>'
|
||||
+ '</ul>'
|
||||
+ '</li>'
|
||||
+ '</ul>'
|
||||
, dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()
|
||||
|
||||
ok(dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
|
||||
})
|
||||
|
||||
test("should test if element has a # before assuming it's a selector", function () {
|
||||
var dropdownHTML = '<ul class="tabs">'
|
||||
+ '<li class="dropdown">'
|
||||
+ '<a href="/foo/" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>'
|
||||
+ '<ul class="dropdown-menu">'
|
||||
+ '<li><a href="#">Secondary link</a></li>'
|
||||
+ '<li><a href="#">Something else here</a></li>'
|
||||
+ '<li class="divider"></li>'
|
||||
+ '<li><a href="#">Another link</a></li>'
|
||||
+ '</ul>'
|
||||
+ '</li>'
|
||||
+ '</ul>'
|
||||
, dropdown = $(dropdownHTML).find('[data-toggle="dropdown"]').dropdown().click()
|
||||
|
||||
ok(dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
|
||||
})
|
||||
|
||||
|
||||
test("should remove open class if body clicked", function () {
|
||||
var dropdownHTML = '<ul class="tabs">'
|
||||
+ '<li class="dropdown">'
|
||||
+ '<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>'
|
||||
+ '<ul class="dropdown-menu">'
|
||||
+ '<li><a href="#">Secondary link</a></li>'
|
||||
+ '<li><a href="#">Something else here</a></li>'
|
||||
+ '<li class="divider"></li>'
|
||||
+ '<li><a href="#">Another link</a></li>'
|
||||
+ '</ul>'
|
||||
+ '</li>'
|
||||
+ '</ul>'
|
||||
, dropdown = $(dropdownHTML)
|
||||
.appendTo('#qunit-fixture')
|
||||
.find('[data-toggle="dropdown"]')
|
||||
.dropdown()
|
||||
.click()
|
||||
ok(dropdown.parent('.dropdown').hasClass('open'), 'open class added on click')
|
||||
$('body').click()
|
||||
ok(!dropdown.parent('.dropdown').hasClass('open'), 'open class removed')
|
||||
dropdown.remove()
|
||||
})
|
||||
|
||||
test("should remove open class if body clicked, with multiple drop downs", function () {
|
||||
var dropdownHTML =
|
||||
'<ul class="nav">'
|
||||
+ ' <li><a href="#menu1">Menu 1</a></li>'
|
||||
+ ' <li class="dropdown" id="testmenu">'
|
||||
+ ' <a class="dropdown-toggle" data-toggle="dropdown" href="#testmenu">Test menu <b class="caret"></b></a>'
|
||||
+ ' <ul class="dropdown-menu" role="menu">'
|
||||
+ ' <li><a href="#sub1">Submenu 1</a></li>'
|
||||
+ ' </ul>'
|
||||
+ ' </li>'
|
||||
+ '</ul>'
|
||||
+ '<div class="btn-group">'
|
||||
+ ' <button class="btn">Actions</button>'
|
||||
+ ' <button class="btn dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>'
|
||||
+ ' <ul class="dropdown-menu">'
|
||||
+ ' <li><a href="#">Action 1</a></li>'
|
||||
+ ' </ul>'
|
||||
+ '</div>'
|
||||
, dropdowns = $(dropdownHTML).appendTo('#qunit-fixture').find('[data-toggle="dropdown"]')
|
||||
, first = dropdowns.first()
|
||||
, last = dropdowns.last()
|
||||
|
||||
ok(dropdowns.length == 2, "Should be two dropdowns")
|
||||
|
||||
first.click()
|
||||
ok(first.parents('.open').length == 1, 'open class added on click')
|
||||
ok($('#qunit-fixture .open').length == 1, 'only one object is open')
|
||||
$('body').click()
|
||||
ok($("#qunit-fixture .open").length === 0, 'open class removed')
|
||||
|
||||
last.click()
|
||||
ok(last.parent('.open').length == 1, 'open class added on click')
|
||||
ok($('#qunit-fixture .open').length == 1, 'only one object is open')
|
||||
$('body').click()
|
||||
ok($("#qunit-fixture .open").length === 0, 'open class removed')
|
||||
|
||||
$("#qunit-fixture").html("")
|
||||
})
|
||||
|
||||
})
|
||||
+120
@@ -0,0 +1,120 @@
|
||||
$(function () {
|
||||
|
||||
module("bootstrap-modal")
|
||||
|
||||
test("should provide no conflict", function () {
|
||||
var modal = $.fn.modal.noConflict()
|
||||
ok(!$.fn.modal, 'modal was set back to undefined (org value)')
|
||||
$.fn.modal = modal
|
||||
})
|
||||
|
||||
test("should be defined on jquery object", function () {
|
||||
var div = $("<div id='modal-test'></div>")
|
||||
ok(div.modal, 'modal method is defined')
|
||||
})
|
||||
|
||||
test("should return element", function () {
|
||||
var div = $("<div id='modal-test'></div>")
|
||||
ok(div.modal() == div, 'document.body returned')
|
||||
$('#modal-test').remove()
|
||||
})
|
||||
|
||||
test("should expose defaults var for settings", function () {
|
||||
ok($.fn.modal.defaults, 'default object exposed')
|
||||
})
|
||||
|
||||
test("should insert into dom when show method is called", function () {
|
||||
stop()
|
||||
$.support.transition = false
|
||||
$("<div id='modal-test'></div>")
|
||||
.bind("shown", function () {
|
||||
ok($('#modal-test').length, 'modal insterted into dom')
|
||||
$(this).remove()
|
||||
start()
|
||||
})
|
||||
.modal("show")
|
||||
})
|
||||
|
||||
test("should fire show event", function () {
|
||||
stop()
|
||||
$.support.transition = false
|
||||
$("<div id='modal-test'></div>")
|
||||
.bind("show", function () {
|
||||
ok(true, "show was called")
|
||||
})
|
||||
.bind("shown", function () {
|
||||
$(this).remove()
|
||||
start()
|
||||
})
|
||||
.modal("show")
|
||||
})
|
||||
|
||||
test("should not fire shown when default prevented", function () {
|
||||
stop()
|
||||
$.support.transition = false
|
||||
$("<div id='modal-test'></div>")
|
||||
.bind("show", function (e) {
|
||||
e.preventDefault()
|
||||
ok(true, "show was called")
|
||||
start()
|
||||
})
|
||||
.bind("shown", function () {
|
||||
ok(false, "shown was called")
|
||||
})
|
||||
.modal("show")
|
||||
})
|
||||
|
||||
test("should hide modal when hide is called", function () {
|
||||
stop()
|
||||
$.support.transition = false
|
||||
|
||||
$("<div id='modal-test'></div>")
|
||||
.bind("shown", function () {
|
||||
ok($('#modal-test').is(":visible"), 'modal visible')
|
||||
ok($('#modal-test').length, 'modal insterted into dom')
|
||||
$(this).modal("hide")
|
||||
})
|
||||
.bind("hidden", function() {
|
||||
ok(!$('#modal-test').is(":visible"), 'modal hidden')
|
||||
$('#modal-test').remove()
|
||||
start()
|
||||
})
|
||||
.modal("show")
|
||||
})
|
||||
|
||||
test("should toggle when toggle is called", function () {
|
||||
stop()
|
||||
$.support.transition = false
|
||||
var div = $("<div id='modal-test'></div>")
|
||||
div
|
||||
.bind("shown", function () {
|
||||
ok($('#modal-test').is(":visible"), 'modal visible')
|
||||
ok($('#modal-test').length, 'modal insterted into dom')
|
||||
div.modal("toggle")
|
||||
})
|
||||
.bind("hidden", function() {
|
||||
ok(!$('#modal-test').is(":visible"), 'modal hidden')
|
||||
div.remove()
|
||||
start()
|
||||
})
|
||||
.modal("toggle")
|
||||
})
|
||||
|
||||
test("should remove from dom when click [data-dismiss=modal]", function () {
|
||||
stop()
|
||||
$.support.transition = false
|
||||
var div = $("<div id='modal-test'><span class='close' data-dismiss='modal'></span></div>")
|
||||
div
|
||||
.bind("shown", function () {
|
||||
ok($('#modal-test').is(":visible"), 'modal visible')
|
||||
ok($('#modal-test').length, 'modal insterted into dom')
|
||||
div.find('.close').click()
|
||||
})
|
||||
.bind("hidden", function() {
|
||||
ok(!$('#modal-test').is(":visible"), 'modal hidden')
|
||||
div.remove()
|
||||
start()
|
||||
})
|
||||
.modal("toggle")
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,21 @@
|
||||
// Logging setup for phantom integration
|
||||
// adapted from Modernizr
|
||||
|
||||
QUnit.begin = function () {
|
||||
console.log("Starting test suite")
|
||||
console.log("================================================\n")
|
||||
}
|
||||
|
||||
QUnit.moduleDone = function (opts) {
|
||||
if (opts.failed === 0) {
|
||||
console.log("\u2714 All tests passed in '" + opts.name + "' module")
|
||||
} else {
|
||||
console.log("\u2716 " + opts.failed + " tests failed in '" + opts.name + "' module")
|
||||
}
|
||||
}
|
||||
|
||||
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.")
|
||||
}
|
||||
+113
@@ -0,0 +1,113 @@
|
||||
$(function () {
|
||||
|
||||
module("bootstrap-popover")
|
||||
|
||||
test("should provide no conflict", function () {
|
||||
var popover = $.fn.popover.noConflict()
|
||||
ok(!$.fn.popover, 'popover was set back to undefined (org value)')
|
||||
$.fn.popover = popover
|
||||
})
|
||||
|
||||
test("should be defined on jquery object", function () {
|
||||
var div = $('<div></div>')
|
||||
ok(div.popover, 'popover method is defined')
|
||||
})
|
||||
|
||||
test("should return element", function () {
|
||||
var div = $('<div></div>')
|
||||
ok(div.popover() == div, 'document.body returned')
|
||||
})
|
||||
|
||||
test("should render popover element", function () {
|
||||
$.support.transition = false
|
||||
var popover = $('<a href="#" title="mdo" data-content="http://twitter.com/mdo">@mdo</a>')
|
||||
.appendTo('#qunit-fixture')
|
||||
.popover('show')
|
||||
|
||||
ok($('.popover').length, 'popover was inserted')
|
||||
popover.popover('hide')
|
||||
ok(!$(".popover").length, 'popover removed')
|
||||
})
|
||||
|
||||
test("should store popover instance in popover data object", function () {
|
||||
$.support.transition = false
|
||||
var popover = $('<a href="#" title="mdo" data-content="http://twitter.com/mdo">@mdo</a>')
|
||||
.popover()
|
||||
|
||||
ok(!!popover.data('popover'), 'popover instance exists')
|
||||
})
|
||||
|
||||
test("should get title and content from options", function () {
|
||||
$.support.transition = false
|
||||
var popover = $('<a href="#">@fat</a>')
|
||||
.appendTo('#qunit-fixture')
|
||||
.popover({
|
||||
title: function () {
|
||||
return '@fat'
|
||||
}
|
||||
, content: function () {
|
||||
return 'loves writing tests （╯°□°）╯︵ ┻━┻'
|
||||
}
|
||||
})
|
||||
|
||||
popover.popover('show')
|
||||
|
||||
ok($('.popover').length, 'popover was inserted')
|
||||
equals($('.popover .popover-title').text(), '@fat', 'title correctly inserted')
|
||||
equals($('.popover .popover-content').text(), 'loves writing tests （╯°□°）╯︵ ┻━┻', 'content correctly inserted')
|
||||
|
||||
popover.popover('hide')
|
||||
ok(!$('.popover').length, 'popover was removed')
|
||||
$('#qunit-fixture').empty()
|
||||
})
|
||||
|
||||
test("should get title and content from attributes", function () {
|
||||
$.support.transition = false
|
||||
var popover = $('<a href="#" title="@mdo" data-content="loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻" >@mdo</a>')
|
||||
.appendTo('#qunit-fixture')
|
||||
.popover()
|
||||
.popover('show')
|
||||
|
||||
ok($('.popover').length, 'popover was inserted')
|
||||
equals($('.popover .popover-title').text(), '@mdo', 'title correctly inserted')
|
||||
equals($('.popover .popover-content').text(), "loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻", 'content correctly inserted')
|
||||
|
||||
popover.popover('hide')
|
||||
ok(!$('.popover').length, 'popover was removed')
|
||||
$('#qunit-fixture').empty()
|
||||
})
|
||||
|
||||
test("should respect custom classes", function() {
|
||||
$.support.transition = false
|
||||
var popover = $('<a href="#">@fat</a>')
|
||||
.appendTo('#qunit-fixture')
|
||||
.popover({
|
||||
title: 'Test'
|
||||
, content: 'Test'
|
||||
, template: '<div class="popover foobar"><div class="arrow"></div><div class="inner"><h3 class="title"></h3><div class="content"><p></p></div></div></div>'
|
||||
})
|
||||
|
||||
popover.popover('show')
|
||||
|
||||
ok($('.popover').length, 'popover was inserted')
|
||||
ok($('.popover').hasClass('foobar'), 'custom class is present')
|
||||
|
||||
popover.popover('hide')
|
||||
ok(!$('.popover').length, 'popover was removed')
|
||||
$('#qunit-fixture').empty()
|
||||
})
|
||||
|
||||
test("should destroy popover", function () {
|
||||
var popover = $('<div/>').popover({trigger: 'hover'}).on('click.foo', function(){})
|
||||
ok(popover.data('popover'), 'popover has data')
|
||||
ok($._data(popover[0], 'events').mouseover && $._data(popover[0], 'events').mouseout, 'popover has hover event')
|
||||
ok($._data(popover[0], 'events').click[0].namespace == 'foo', 'popover has extra click.foo event')
|
||||
popover.popover('show')
|
||||
popover.popover('destroy')
|
||||
ok(!popover.hasClass('in'), 'popover is hidden')
|
||||
ok(!popover.data('popover'), 'popover does not have data')
|
||||
ok($._data(popover[0],'events').click[0].namespace == 'foo', 'popover still has click.foo')
|
||||
ok(!$._data(popover[0], 'events').mouseover && !$._data(popover[0], 'events').mouseout, 'popover does not have any events')
|
||||
})
|
||||
|
||||
})
|
||||
@@ -0,0 +1,37 @@
|
||||
$(function () {
|
||||
|
||||
module("bootstrap-scrollspy")
|
||||
|
||||
test("should provide no conflict", function () {
|
||||
var scrollspy = $.fn.scrollspy.noConflict()
|
||||
ok(!$.fn.scrollspy, 'scrollspy was set back to undefined (org value)')
|
||||
$.fn.scrollspy = scrollspy
|
||||
})
|
||||
|
||||
test("should be defined on jquery object", function () {
|
||||
ok($(document.body).scrollspy, 'scrollspy method is defined')
|
||||
})
|
||||
|
||||
test("should return element", function () {
|
||||
ok($(document.body).scrollspy()[0] == document.body, 'document.body returned')
|
||||
})
|
||||
|
||||
test("should switch active class on scroll", function () {
|
||||
var sectionHTML = '<div id="masthead"></div>'
|
||||
, $section = $(sectionHTML).append('#qunit-fixture')
|
||||
, topbarHTML ='<div class="topbar">'
|
||||
+ '<div class="topbar-inner">'
|
||||
+ '<div class="container">'
|
||||
+ '<h3><a href="#">Bootstrap</a></h3>'
|
||||
+ '<ul class="nav">'
|
||||
+ '<li><a href="#masthead">Overview</a></li>'
|
||||
+ '</ul>'
|
||||
+ '</div>'
|
||||
+ '</div>'
|
||||
+ '</div>'
|
||||
, $topbar = $(topbarHTML).scrollspy()
|
||||
|
||||
ok($topbar.find('.active', true))
|
||||
})
|
||||
|
||||
})
|
||||
+86
@@ -0,0 +1,86 @@
|
||||
$(function () {
|
||||
|
||||
module("bootstrap-tabs")
|
||||
|
||||
test("should provide no conflict", function () {
|
||||
var tab = $.fn.tab.noConflict()
|
||||
ok(!$.fn.tab, 'tab was set back to undefined (org value)')
|
||||
$.fn.tab = tab
|
||||
})
|
||||
|
||||
test("should be defined on jquery object", function () {
|
||||
ok($(document.body).tab, 'tabs method is defined')
|
||||
})
|
||||
|
||||
test("should return element", function () {
|
||||
ok($(document.body).tab()[0] == document.body, 'document.body returned')
|
||||
})
|
||||
|
||||
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>'
|
||||
|
||||
$('<ul><li id="home"></li><li id="profile"></li></ul>').appendTo("#qunit-fixture")
|
||||
|
||||
$(tabsHTML).find('li:last a').tab('show')
|
||||
equals($("#qunit-fixture").find('.active').attr('id'), "profile")
|
||||
|
||||
$(tabsHTML).find('li:first a').tab('show')
|
||||
equals($("#qunit-fixture").find('.active').attr('id'), "home")
|
||||
})
|
||||
|
||||
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>'
|
||||
|
||||
$('<ul><li id="home"></li><li id="profile"></li></ul>').appendTo("#qunit-fixture")
|
||||
|
||||
$(pillsHTML).find('li:last a').tab('show')
|
||||
equals($("#qunit-fixture").find('.active').attr('id'), "profile")
|
||||
|
||||
$(pillsHTML).find('li:first a').tab('show')
|
||||
equals($("#qunit-fixture").find('.active').attr('id'), "home")
|
||||
})
|
||||
|
||||
|
||||
test("should not fire closed when close is prevented", function () {
|
||||
$.support.transition = false
|
||||
stop();
|
||||
$('<div class="tab"/>')
|
||||
.bind('show', function (e) {
|
||||
e.preventDefault();
|
||||
ok(true);
|
||||
start();
|
||||
})
|
||||
.bind('shown', function () {
|
||||
ok(false);
|
||||
})
|
||||
.tab('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').tab('show').end()
|
||||
.find('ul>li:last a').on('show', function(event){
|
||||
equals(event.relatedTarget.hash, "#1-1")
|
||||
}).on('shown', function(event){
|
||||
equals(event.relatedTarget.hash, "#1-1")
|
||||
}).tab('show')
|
||||
})
|
||||
|
||||
})
|
||||
+294
@@ -0,0 +1,294 @@
|
||||
$(function () {
|
||||
|
||||
module("bootstrap-tooltip")
|
||||
|
||||
test("should provide no conflict", function () {
|
||||
var tooltip = $.fn.tooltip.noConflict()
|
||||
ok(!$.fn.tooltip, 'tooltip was set back to undefined (org value)')
|
||||
$.fn.tooltip = tooltip
|
||||
})
|
||||
|
||||
test("should be defined on jquery object", function () {
|
||||
var div = $("<div></div>")
|
||||
ok(div.tooltip, 'popover method is defined')
|
||||
})
|
||||
|
||||
test("should return element", function () {
|
||||
var div = $("<div></div>")
|
||||
ok(div.tooltip() == div, 'document.body returned')
|
||||
})
|
||||
|
||||
test("should expose default settings", function () {
|
||||
ok(!!$.fn.tooltip.defaults, 'defaults is defined')
|
||||
})
|
||||
|
||||
test("should empty title attribute", function () {
|
||||
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>').tooltip()
|
||||
ok(tooltip.attr('title') === '', 'title attribute was emptied')
|
||||
})
|
||||
|
||||
test("should add data attribute for referencing original title", function () {
|
||||
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>').tooltip()
|
||||
equals(tooltip.attr('data-original-title'), 'Another tooltip', 'original title preserved in data attribute')
|
||||
})
|
||||
|
||||
test("should place tooltips relative to placement option", function () {
|
||||
$.support.transition = false
|
||||
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
|
||||
.appendTo('#qunit-fixture')
|
||||
.tooltip({placement: 'bottom'})
|
||||
.tooltip('show')
|
||||
|
||||
ok($(".tooltip").is('.fade.bottom.in'), 'has correct classes applied')
|
||||
tooltip.tooltip('hide')
|
||||
})
|
||||
|
||||
test("should allow html entities", function () {
|
||||
$.support.transition = false
|
||||
var tooltip = $('<a href="#" rel="tooltip" title="<b>@fat</b>"></a>')
|
||||
.appendTo('#qunit-fixture')
|
||||
.tooltip({html: true})
|
||||
.tooltip('show')
|
||||
|
||||
ok($('.tooltip b').length, 'b tag was inserted')
|
||||
tooltip.tooltip('hide')
|
||||
ok(!$(".tooltip").length, 'tooltip removed')
|
||||
})
|
||||
|
||||
test("should respect custom classes", function () {
|
||||
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
|
||||
.appendTo('#qunit-fixture')
|
||||
.tooltip({ template: '<div class="tooltip some-class"><div class="tooltip-arrow"/><div class="tooltip-inner"/></div>'})
|
||||
.tooltip('show')
|
||||
|
||||
ok($('.tooltip').hasClass('some-class'), 'custom class is present')
|
||||
tooltip.tooltip('hide')
|
||||
ok(!$(".tooltip").length, 'tooltip removed')
|
||||
})
|
||||
|
||||
test("should fire show event", function () {
|
||||
stop()
|
||||
var tooltip = $('<div title="tooltip title"></div>')
|
||||
.bind("show", function() {
|
||||
ok(true, "show was called")
|
||||
start()
|
||||
})
|
||||
.tooltip('show')
|
||||
})
|
||||
|
||||
test("should fire shown event", function () {
|
||||
stop()
|
||||
var tooltip = $('<div title="tooltip title"></div>')
|
||||
.bind("shown", function() {
|
||||
ok(true, "shown was called")
|
||||
start()
|
||||
})
|
||||
.tooltip('show')
|
||||
})
|
||||
|
||||
test("should not fire shown event when default prevented", function () {
|
||||
stop()
|
||||
var tooltip = $('<div title="tooltip title"></div>')
|
||||
.bind("show", function(e) {
|
||||
e.preventDefault()
|
||||
ok(true, "show was called")
|
||||
start()
|
||||
})
|
||||
.bind("shown", function() {
|
||||
ok(false, "shown was called")
|
||||
})
|
||||
.tooltip('show')
|
||||
})
|
||||
|
||||
test("should fire hide event", function () {
|
||||
stop()
|
||||
var tooltip = $('<div title="tooltip title"></div>')
|
||||
.bind("shown", function() {
|
||||
$(this).tooltip('hide')
|
||||
})
|
||||
.bind("hide", function() {
|
||||
ok(true, "hide was called")
|
||||
start()
|
||||
})
|
||||
.tooltip('show')
|
||||
})
|
||||
|
||||
test("should fire hidden event", function () {
|
||||
stop()
|
||||
var tooltip = $('<div title="tooltip title"></div>')
|
||||
.bind("shown", function() {
|
||||
$(this).tooltip('hide')
|
||||
})
|
||||
.bind("hidden", function() {
|
||||
ok(true, "hidden was called")
|
||||
start()
|
||||
})
|
||||
.tooltip('show')
|
||||
})
|
||||
|
||||
test("should not fire hidden event when default prevented", function () {
|
||||
stop()
|
||||
var tooltip = $('<div title="tooltip title"></div>')
|
||||
.bind("shown", function() {
|
||||
$(this).tooltip('hide')
|
||||
})
|
||||
.bind("hide", function(e) {
|
||||
e.preventDefault()
|
||||
ok(true, "hide was called")
|
||||
start()
|
||||
})
|
||||
.bind("hidden", function() {
|
||||
ok(false, "hidden was called")
|
||||
})
|
||||
.tooltip('show')
|
||||
})
|
||||
|
||||
test("should not show tooltip if leave event occurs before delay expires", function () {
|
||||
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
|
||||
.appendTo('#qunit-fixture')
|
||||
.tooltip({ delay: 200 })
|
||||
|
||||
stop()
|
||||
|
||||
tooltip.trigger('mouseenter')
|
||||
|
||||
setTimeout(function () {
|
||||
ok(!$(".tooltip").is('.fade.in'), 'tooltip is not faded in')
|
||||
tooltip.trigger('mouseout')
|
||||
setTimeout(function () {
|
||||
ok(!$(".tooltip").is('.fade.in'), 'tooltip is not faded in')
|
||||
start()
|
||||
}, 200)
|
||||
}, 100)
|
||||
})
|
||||
|
||||
test("should not show tooltip if leave event occurs before delay expires, even if hide delay is 0", function () {
|
||||
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
|
||||
.appendTo('#qunit-fixture')
|
||||
.tooltip({ delay: { show: 200, hide: 0} })
|
||||
|
||||
stop()
|
||||
|
||||
tooltip.trigger('mouseenter')
|
||||
|
||||
setTimeout(function () {
|
||||
ok(!$(".tooltip").is('.fade.in'), 'tooltip is not faded in')
|
||||
tooltip.trigger('mouseout')
|
||||
setTimeout(function () {
|
||||
ok(!$(".tooltip").is('.fade.in'), 'tooltip is not faded in')
|
||||
start()
|
||||
}, 200)
|
||||
}, 100)
|
||||
})
|
||||
|
||||
test("should not show tooltip if leave event occurs before delay expires", function () {
|
||||
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
|
||||
.appendTo('#qunit-fixture')
|
||||
.tooltip({ delay: 100 })
|
||||
stop()
|
||||
tooltip.trigger('mouseenter')
|
||||
setTimeout(function () {
|
||||
ok(!$(".tooltip").is('.fade.in'), 'tooltip is not faded in')
|
||||
tooltip.trigger('mouseout')
|
||||
setTimeout(function () {
|
||||
ok(!$(".tooltip").is('.fade.in'), 'tooltip is not faded in')
|
||||
start()
|
||||
}, 100)
|
||||
}, 50)
|
||||
})
|
||||
|
||||
test("should show tooltip if leave event hasn't occured before delay expires", function () {
|
||||
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
|
||||
.appendTo('#qunit-fixture')
|
||||
.tooltip({ delay: 150 })
|
||||
stop()
|
||||
tooltip.trigger('mouseenter')
|
||||
setTimeout(function () {
|
||||
ok(!$(".tooltip").is('.fade.in'), 'tooltip is not faded in')
|
||||
}, 100)
|
||||
setTimeout(function () {
|
||||
ok($(".tooltip").is('.fade.in'), 'tooltip has faded in')
|
||||
start()
|
||||
}, 200)
|
||||
})
|
||||
|
||||
test("should destroy tooltip", function () {
|
||||
var tooltip = $('<div/>').tooltip().on('click.foo', function(){})
|
||||
ok(tooltip.data('tooltip'), 'tooltip has data')
|
||||
ok($._data(tooltip[0], 'events').mouseover && $._data(tooltip[0], 'events').mouseout, 'tooltip has hover event')
|
||||
ok($._data(tooltip[0], 'events').click[0].namespace == 'foo', 'tooltip has extra click.foo event')
|
||||
tooltip.tooltip('show')
|
||||
tooltip.tooltip('destroy')
|
||||
ok(!tooltip.hasClass('in'), 'tooltip is hidden')
|
||||
ok(!$._data(tooltip[0], 'tooltip'), 'tooltip does not have data')
|
||||
ok($._data(tooltip[0], 'events').click[0].namespace == 'foo', 'tooltip still has click.foo')
|
||||
ok(!$._data(tooltip[0], 'events').mouseover && !$._data(tooltip[0], 'events').mouseout, 'tooltip does not have any events')
|
||||
})
|
||||
|
||||
test("should show tooltip with delegate selector on click", function () {
|
||||
var div = $('<div><a href="#" rel="tooltip" title="Another tooltip"></a></div>')
|
||||
var tooltip = div.appendTo('#qunit-fixture')
|
||||
.tooltip({ selector: 'a[rel=tooltip]',
|
||||
trigger: 'click' })
|
||||
div.find('a').trigger('click')
|
||||
ok($(".tooltip").is('.fade.in'), 'tooltip is faded in')
|
||||
})
|
||||
|
||||
test("should show tooltip when toggle is called", function () {
|
||||
var tooltip = $('<a href="#" rel="tooltip" title="tooltip on toggle"></a>')
|
||||
.appendTo('#qunit-fixture')
|
||||
.tooltip({trigger: 'manual'})
|
||||
.tooltip('toggle')
|
||||
ok($(".tooltip").is('.fade.in'), 'tooltip should be toggled in')
|
||||
})
|
||||
|
||||
test("should place tooltips inside the body", function () {
|
||||
var tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"></a>')
|
||||
.appendTo('#qunit-fixture')
|
||||
.tooltip({container:'body'})
|
||||
.tooltip('show')
|
||||
ok($("body > .tooltip").length, 'inside the body')
|
||||
ok(!$("#qunit-fixture > .tooltip").length, 'not found in parent')
|
||||
tooltip.tooltip('hide')
|
||||
})
|
||||
|
||||
test("should place tooltip inside window", function(){
|
||||
var container = $("<div />").appendTo("body")
|
||||
.css({position: "absolute", width: 200, height: 200, bottom: 0, left: 0})
|
||||
, tooltip = $("<a href='#' title='Very very very very very very very very long tooltip'>Hover me</a>")
|
||||
.css({position: "absolute", top:0, left: 0})
|
||||
.appendTo(container)
|
||||
.tooltip({placement: "top", animate: false})
|
||||
.tooltip("show")
|
||||
|
||||
stop()
|
||||
|
||||
setTimeout(function(){
|
||||
ok($(".tooltip").offset().left >= 0)
|
||||
|
||||
start()
|
||||
container.remove()
|
||||
}, 100)
|
||||
})
|
||||
|
||||
test("should place tooltip on top of element", function(){
|
||||
var container = $("<div />").appendTo("body")
|
||||
.css({position: "absolute", bottom: 0, left: 0, textAlign: "right", width: 300, height: 300})
|
||||
, p = $("<p style='margin-top:200px' />").appendTo(container)
|
||||
, tooltiped = $("<a href='#' title='very very very very very very very long tooltip'>Hover me</a>")
|
||||
.css({marginTop: 200})
|
||||
.appendTo(p)
|
||||
.tooltip({placement: "top", animate: false})
|
||||
.tooltip("show")
|
||||
|
||||
stop()
|
||||
|
||||
setTimeout(function(){
|
||||
var tooltip = container.find(".tooltip")
|
||||
|
||||
start()
|
||||
ok(tooltip.offset().top + tooltip.outerHeight() <= tooltiped.offset().top)
|
||||
container.remove()
|
||||
}, 100)
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,13 @@
|
||||
$(function () {
|
||||
|
||||
module("bootstrap-transition")
|
||||
|
||||
test("should be defined on jquery support object", function () {
|
||||
ok($.support.transition !== undefined, 'transition object is defined')
|
||||
})
|
||||
|
||||
test("should provide an end object", function () {
|
||||
ok($.support.transition ? $.support.transition.end : true, 'end string is defined')
|
||||
})
|
||||
|
||||
})
|
||||
+236
@@ -0,0 +1,236 @@
|
||||
$(function () {
|
||||
|
||||
module("bootstrap-typeahead")
|
||||
|
||||
test("should provide no conflict", function () {
|
||||
var typeahead = $.fn.typeahead.noConflict()
|
||||
ok(!$.fn.typeahead, 'typeahead was set back to undefined (org value)')
|
||||
$.fn.typeahead = typeahead
|
||||
})
|
||||
|
||||
test("should be defined on jquery object", function () {
|
||||
ok($(document.body).typeahead, 'alert method is defined')
|
||||
})
|
||||
|
||||
test("should return element", function () {
|
||||
ok($(document.body).typeahead()[0] == document.body, 'document.body returned')
|
||||
})
|
||||
|
||||
test("should listen to an input", function () {
|
||||
var $input = $('<input />')
|
||||
$input.typeahead()
|
||||
ok($._data($input[0], 'events').blur, 'has a blur event')
|
||||
ok($._data($input[0], 'events').keypress, 'has a keypress event')
|
||||
ok($._data($input[0], 'events').keyup, 'has a keyup event')
|
||||
})
|
||||
|
||||
test("should create a menu", function () {
|
||||
var $input = $('<input />')
|
||||
ok($input.typeahead().data('typeahead').$menu, 'has a menu')
|
||||
})
|
||||
|
||||
test("should listen to the menu", function () {
|
||||
var $input = $('<input />')
|
||||
, $menu = $input.typeahead().data('typeahead').$menu
|
||||
|
||||
ok($._data($menu[0], 'events').mouseover, 'has a mouseover(pseudo: mouseenter)')
|
||||
ok($._data($menu[0], 'events').click, 'has a click')
|
||||
})
|
||||
|
||||
test("should show menu when query entered", function () {
|
||||
var $input = $('<input />')
|
||||
.appendTo('body')
|
||||
.typeahead({
|
||||
source: ['aa', 'ab', 'ac']
|
||||
})
|
||||
, typeahead = $input.data('typeahead')
|
||||
|
||||
$input.val('a')
|
||||
typeahead.lookup()
|
||||
|
||||
ok(typeahead.$menu.is(":visible"), 'typeahead is visible')
|
||||
equals(typeahead.$menu.find('li').length, 3, 'has 3 items in menu')
|
||||
equals(typeahead.$menu.find('.active').length, 1, 'one item is active')
|
||||
|
||||
$input.remove()
|
||||
typeahead.$menu.remove()
|
||||
})
|
||||
|
||||
test("should accept data source via synchronous function", function () {
|
||||
var $input = $('<input />').typeahead({
|
||||
source: function () {
|
||||
return ['aa', 'ab', 'ac']
|
||||
}
|
||||
}).appendTo('body')
|
||||
, typeahead = $input.data('typeahead')
|
||||
|
||||
$input.val('a')
|
||||
typeahead.lookup()
|
||||
|
||||
ok(typeahead.$menu.is(":visible"), 'typeahead is visible')
|
||||
equals(typeahead.$menu.find('li').length, 3, 'has 3 items in menu')
|
||||
equals(typeahead.$menu.find('.active').length, 1, 'one item is active')
|
||||
|
||||
$input.remove()
|
||||
typeahead.$menu.remove()
|
||||
})
|
||||
|
||||
test("should accept data source via asynchronous function", function () {
|
||||
var $input = $('<input />').typeahead({
|
||||
source: function (query, process) {
|
||||
process(['aa', 'ab', 'ac'])
|
||||
}
|
||||
}).appendTo('body')
|
||||
, typeahead = $input.data('typeahead')
|
||||
|
||||
$input.val('a')
|
||||
typeahead.lookup()
|
||||
|
||||
ok(typeahead.$menu.is(":visible"), 'typeahead is visible')
|
||||
equals(typeahead.$menu.find('li').length, 3, 'has 3 items in menu')
|
||||
equals(typeahead.$menu.find('.active').length, 1, 'one item is active')
|
||||
|
||||
$input.remove()
|
||||
typeahead.$menu.remove()
|
||||
})
|
||||
|
||||
test("should not explode when regex chars are entered", function () {
|
||||
var $input = $('<input />').typeahead({
|
||||
source: ['aa', 'ab', 'ac', 'mdo*', 'fat+']
|
||||
}).appendTo('body')
|
||||
, typeahead = $input.data('typeahead')
|
||||
|
||||
$input.val('+')
|
||||
typeahead.lookup()
|
||||
|
||||
ok(typeahead.$menu.is(":visible"), 'typeahead is visible')
|
||||
equals(typeahead.$menu.find('li').length, 1, 'has 1 item in menu')
|
||||
equals(typeahead.$menu.find('.active').length, 1, 'one item is active')
|
||||
|
||||
$input.remove()
|
||||
typeahead.$menu.remove()
|
||||
})
|
||||
|
||||
test("should hide menu when query entered", function () {
|
||||
stop()
|
||||
var $input = $('<input />').typeahead({
|
||||
source: ['aa', 'ab', 'ac']
|
||||
}).appendTo('body')
|
||||
, typeahead = $input.data('typeahead')
|
||||
|
||||
$input.val('a')
|
||||
typeahead.lookup()
|
||||
|
||||
ok(typeahead.$menu.is(":visible"), 'typeahead is visible')
|
||||
equals(typeahead.$menu.find('li').length, 3, 'has 3 items in menu')
|
||||
equals(typeahead.$menu.find('.active').length, 1, 'one item is active')
|
||||
|
||||
$input.blur()
|
||||
|
||||
setTimeout(function () {
|
||||
ok(!typeahead.$menu.is(":visible"), "typeahead is no longer visible")
|
||||
start()
|
||||
}, 200)
|
||||
|
||||
$input.remove()
|
||||
typeahead.$menu.remove()
|
||||
})
|
||||
|
||||
test("should set next item when down arrow is pressed", function () {
|
||||
var $input = $('<input />').typeahead({
|
||||
source: ['aa', 'ab', 'ac']
|
||||
}).appendTo('body')
|
||||
, typeahead = $input.data('typeahead')
|
||||
|
||||
$input.val('a')
|
||||
typeahead.lookup()
|
||||
|
||||
ok(typeahead.$menu.is(":visible"), 'typeahead is visible')
|
||||
equals(typeahead.$menu.find('li').length, 3, 'has 3 items in menu')
|
||||
equals(typeahead.$menu.find('.active').length, 1, 'one item is active')
|
||||
ok(typeahead.$menu.find('li').first().hasClass('active'), "first item is active")
|
||||
|
||||
// simulate entire key pressing event
|
||||
$input.trigger({
|
||||
type: 'keydown'
|
||||
, keyCode: 40
|
||||
})
|
||||
.trigger({
|
||||
type: 'keypress'
|
||||
, keyCode: 40
|
||||
})
|
||||
.trigger({
|
||||
type: 'keyup'
|
||||
, keyCode: 40
|
||||
})
|
||||
|
||||
ok(typeahead.$menu.find('li').first().next().hasClass('active'), "second item is active")
|
||||
|
||||
$input.trigger({
|
||||
type: 'keydown'
|
||||
, keyCode: 38
|
||||
})
|
||||
.trigger({
|
||||
type: 'keypress'
|
||||
, keyCode: 38
|
||||
})
|
||||
.trigger({
|
||||
type: 'keyup'
|
||||
, keyCode: 38
|
||||
})
|
||||
|
||||
ok(typeahead.$menu.find('li').first().hasClass('active'), "first item is active")
|
||||
|
||||
$input.remove()
|
||||
typeahead.$menu.remove()
|
||||
})
|
||||
|
||||
|
||||
test("should set input value to selected item", function () {
|
||||
var $input = $('<input />').typeahead({
|
||||
source: ['aa', 'ab', 'ac']
|
||||
}).appendTo('body')
|
||||
, typeahead = $input.data('typeahead')
|
||||
, changed = false
|
||||
, focus = false
|
||||
, blur = false
|
||||
|
||||
$input.val('a')
|
||||
typeahead.lookup()
|
||||
|
||||
$input.change(function() { changed = true });
|
||||
$input.focus(function() { focus = true; blur = false });
|
||||
$input.blur(function() { blur = true; focus = false });
|
||||
|
||||
$(typeahead.$menu.find('li')[2]).mouseover().click()
|
||||
|
||||
equals($input.val(), 'ac', 'input value was correctly set')
|
||||
ok(!typeahead.$menu.is(':visible'), 'the menu was hidden')
|
||||
ok(changed, 'a change event was fired')
|
||||
ok(focus && !blur, 'focus is still set')
|
||||
|
||||
$input.remove()
|
||||
typeahead.$menu.remove()
|
||||
})
|
||||
|
||||
test("should start querying when minLength is met", function () {
|
||||
var $input = $('<input />').typeahead({
|
||||
source: ['aaaa', 'aaab', 'aaac'],
|
||||
minLength: 3
|
||||
}).appendTo('body')
|
||||
, typeahead = $input.data('typeahead')
|
||||
|
||||
$input.val('aa')
|
||||
typeahead.lookup()
|
||||
|
||||
equals(typeahead.$menu.find('li').length, 0, 'has 0 items in menu')
|
||||
|
||||
$input.val('aaa')
|
||||
typeahead.lookup()
|
||||
|
||||
equals(typeahead.$menu.find('li').length, 3, 'has 3 items in menu')
|
||||
|
||||
$input.remove()
|
||||
typeahead.$menu.remove()
|
||||
})
|
||||
})
|
||||
Reference in New Issue
Block a user