rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-01 13:24:25 +01:00
Code Issues Actions Packages Releases Activity

Use transitionEnd in QUnit since we moved away from PhantomJS

Browse Source
This commit is contained in:
Johann-S 2018-03-20 11:07:58 +01:00
parent 2306f62bf1
commit bedc96e48b
12 changed files with 224 additions and 161 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
js/src/alert.js
View File

@ -102,8 +102,7 @@ const Alert = (($) => {
_removeElement(element) {
$(element).removeClass(ClassName.SHOW)
if (!Util.supportsTransitionEnd() ||
!$(element).hasClass(ClassName.FADE)) {
if (!$(element).hasClass(ClassName.FADE)) {
this._destroyElement(element)
return
}

6
js/src/carousel.js
View File

@ -142,8 +142,7 @@ const Carousel = (($) => {
this._isPaused = true
}
if ($(this._element).find(Selector.NEXT_PREV)[0] &&
Util.supportsTransitionEnd()) {
if ($(this._element).find(Selector.NEXT_PREV)[0]) {
Util.triggerTransitionEnd(this._element)
this.cycle(true)
}
@ -376,8 +375,7 @@ const Carousel = (($) => {
to: nextElementIndex
})
if (Util.supportsTransitionEnd() &&
$(this._element).hasClass(ClassName.SLIDE)) {
if ($(this._element).hasClass(ClassName.SLIDE)) {
$(nextElement).addClass(orderClassName)
Util.reflow(nextElement)

11
js/src/collapse.js
View File

@ -182,11 +182,6 @@ const Collapse = (($) => {
$(this._element).trigger(Event.SHOWN)
}
if (!Util.supportsTransitionEnd()) {
complete()
return
}
const capitalizedDimension = dimension[0].toUpperCase() + dimension.slice(1)
const scrollSize = `scroll${capitalizedDimension}`
const transitionDuration = Util.getTransitionDurationFromElement(this._element)
@ -246,12 +241,6 @@ const Collapse = (($) => {
}
this._element.style[dimension] = ''
if (!Util.supportsTransitionEnd()) {
complete()
return
}
const transitionDuration = Util.getTransitionDurationFromElement(this._element)
$(this._element)

17
js/src/modal.js
View File

@ -107,7 +107,7 @@ const Modal = (($) => {
return
}
if (Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.FADE)) {
if ($(this._element).hasClass(ClassName.FADE)) {
this._isTransitioning = true
}
@ -168,8 +168,7 @@ const Modal = (($) => {
}
this._isShown = false
const transition = Util.supportsTransitionEnd() && $(this._element).hasClass(ClassName.FADE)
const transition = $(this._element).hasClass(ClassName.FADE)
if (transition) {
this._isTransitioning = true
@ -228,8 +227,7 @@ const Modal = (($) => {
}
_showElement(relatedTarget) {
const transition = Util.supportsTransitionEnd() &&
$(this._element).hasClass(ClassName.FADE)
const transition = $(this._element).hasClass(ClassName.FADE)
if (!this._element.parentNode ||
this._element.parentNode.nodeType !== Node.ELEMENT_NODE) {
@ -331,8 +329,6 @@ const Modal = (($) => {
? ClassName.FADE : ''
if (this._isShown && this._config.backdrop) {
const doAnimate = Util.supportsTransitionEnd() && animate
this._backdrop = document.createElement('div')
this._backdrop.className = ClassName.BACKDROP
@ -357,7 +353,7 @@ const Modal = (($) => {
}
})
if (doAnimate) {
if (animate) {
Util.reflow(this._backdrop)
}
@ -367,7 +363,7 @@ const Modal = (($) => {
return
}
if (!doAnimate) {
if (!animate) {
callback()
return
}
@ -387,8 +383,7 @@ const Modal = (($) => {
}
}
if (Util.supportsTransitionEnd() &&
$(this._element).hasClass(ClassName.FADE)) {
if ($(this._element).hasClass(ClassName.FADE)) {
const backdropTransitionDuration = Util.getTransitionDurationFromElement(this._backdrop)
$(this._backdrop)

1
js/src/tab.js
View File

@ -151,7 +151,6 @@ const Tab = (($) => {
const active = activeElements[0]
const isTransitioning = callback &&
Util.supportsTransitionEnd() &&
(active && $(active).hasClass(ClassName.FADE))
const complete = () => this._transitionComplete(

5
js/src/tooltip.js
View File

@ -333,7 +333,7 @@ const Tooltip = (($) => {
}
}
if (Util.supportsTransitionEnd() && $(this.tip).hasClass(ClassName.FADE)) {
if ($(this.tip).hasClass(ClassName.FADE)) {
const transitionDuration = Util.getTransitionDurationFromElement(this.tip)
$(this.tip)
@ -383,8 +383,7 @@ const Tooltip = (($) => {
this._activeTrigger[Trigger.FOCUS] = false
this._activeTrigger[Trigger.HOVER] = false
if (Util.supportsTransitionEnd() &&
$(this.tip).hasClass(ClassName.FADE)) {
if ($(this.tip).hasClass(ClassName.FADE)) {
const transitionDuration = Util.getTransitionDurationFromElement(tip)
$(tip)

29
js/src/util.js
View File

@ -14,8 +14,7 @@ const Util = (($) => {
* ------------------------------------------------------------------------
*/
let transition = false
const TRANSITION_END = 'transitionend'
const MAX_UID = 1000000
const MILLISECONDS_MULTIPLIER = 1000
@ -26,8 +25,8 @@ const Util = (($) => {
function getSpecialTransitionEndEvent() {
return {
bindType: transition.end,
delegateType: transition.end,
bindType: TRANSITION_END,
delegateType: TRANSITION_END,
handle(event) {
if ($(event.target).is(this)) {
return event.handleObj.handler.apply(this, arguments) // eslint-disable-line prefer-rest-params
@ -37,16 +36,6 @@ const Util = (($) => {
}
}
function transitionEndTest() {
if (typeof window !== 'undefined' && window.QUnit) {
return false
}
return {
end: 'transitionend'
}
}
function transitionEndEmulator(duration) {
let called = false
@ -64,13 +53,8 @@ const Util = (($) => {
}
function setTransitionEndSupport() {
transition = transitionEndTest()
$.fn.emulateTransitionEnd = transitionEndEmulator
if (Util.supportsTransitionEnd()) {
$.event.special[Util.TRANSITION_END] = getSpecialTransitionEndEvent()
}
$.event.special[Util.TRANSITION_END] = getSpecialTransitionEndEvent()
}
/**
@ -130,11 +114,12 @@ const Util = (($) => {
},
triggerTransitionEnd(element) {
$(element).trigger(transition.end)
$(element).trigger(TRANSITION_END)
},
// TODO: Remove in v5
supportsTransitionEnd() {
return Boolean(transition)
return Boolean(TRANSITION_END)
},
isElement(obj) {

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

@ -48,6 +48,7 @@ $(function () {
QUnit.test('should remove element when clicking .close', function (assert) {
assert.expect(2)
var done = assert.async()
var alertHTML = '<div class="alert alert-danger fade show">' +
'<a class="close" href="#" data-dismiss="alert">×</a>' +
'<p><strong>Holy guacamole!</strong> Best check yo self, you\'re not looking too good.</p>' +
@ -56,9 +57,13 @@ $(function () {
assert.notEqual($('#qunit-fixture').find('.alert').length, 0, 'element added to dom')
$alert.find('.close').trigger('click')
assert.strictEqual($('#qunit-fixture').find('.alert').length, 0, 'element removed from dom')
$alert
.one('closed.bs.alert', function () {
assert.strictEqual($('#qunit-fixture').find('.alert').length, 0, 'element removed from dom')
done()
})
.find('.close')
.trigger('click')
})
QUnit.test('should not fire closed when close is prevented', function (assert) {

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

@ -45,10 +45,14 @@ $(function () {
QUnit.test('should show a collapsed element', function (assert) {
assert.expect(2)
var $el = $('<div class="collapse"/>').bootstrapCollapse('show')
var done = assert.async()
var $el = $('<div class="collapse"/>')
assert.ok($el.hasClass('show'), 'has class "show"')
assert.ok(!/height/i.test($el.attr('style')), 'has height reset')
$el.one('shown.bs.collapse', function () {
assert.ok($el.hasClass('show'), 'has class "show"')
assert.ok(!/height/i.test($el.attr('style')), 'has height reset')
done()
}).bootstrapCollapse('show')
})
QUnit.test('should show multiple collapsed elements', function (assert) {

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

@ -80,6 +80,7 @@ $(function () {
QUnit.test('should get title and content from options', function (assert) {
assert.expect(4)
var done = assert.async()
var $popover = $('<a href="#">@fat</a>')
.appendTo('#qunit-fixture')
.bootstrapPopover({
@ -91,15 +92,18 @@ $(function () {
}
})
$popover.bootstrapPopover('show')
assert.notEqual($('.popover').length, 0, 'popover was inserted')
assert.strictEqual($('.popover .popover-header').text(), '@fat', 'title correctly inserted')
assert.strictEqual($('.popover .popover-body').text(), 'loves writing tests （╯°□°）╯︵ ┻━┻', 'content correctly inserted')
$popover.bootstrapPopover('hide')
assert.strictEqual($('.popover').length, 0, 'popover was removed')
$popover
.one('shown.bs.popover', function () {
assert.notEqual($('.popover').length, 0, 'popover was inserted')
assert.strictEqual($('.popover .popover-header').text(), '@fat', 'title correctly inserted')
assert.strictEqual($('.popover .popover-body').text(), 'loves writing tests （╯°□°）╯︵ ┻━┻', 'content correctly inserted')
$popover.bootstrapPopover('hide')
})
.one('hidden.bs.popover', function () {
assert.strictEqual($('.popover').length, 0, 'popover was removed')
done()
})
.bootstrapPopover('show')
})
QUnit.test('should allow DOMElement title and content (html: true)', function (assert) {
@ -146,6 +150,7 @@ $(function () {
QUnit.test('should not duplicate HTML object', function (assert) {
assert.expect(6)
var done = assert.async()
var $div = $('<div/>').html('loves writing tests （╯°□°）╯︵ ┻━┻')
var $popover = $('<a href="#">@fat</a>')
@ -157,56 +162,75 @@ $(function () {
}
})
$popover.bootstrapPopover('show')
assert.notEqual($('.popover').length, 0, 'popover was inserted')
assert.equal($('.popover .popover-body').html(), $div[0].outerHTML, 'content correctly inserted')
function popoverInserted() {
assert.notEqual($('.popover').length, 0, 'popover was inserted')
assert.equal($('.popover .popover-body').html(), $div[0].outerHTML, 'content correctly inserted')
}
$popover.bootstrapPopover('hide')
assert.strictEqual($('.popover').length, 0, 'popover was removed')
$popover
.one('shown.bs.popover', function () {
popoverInserted()
$popover.bootstrapPopover('show')
assert.notEqual($('.popover').length, 0, 'popover was inserted')
assert.equal($('.popover .popover-body').html(), $div[0].outerHTML, 'content correctly inserted')
$popover.one('hidden.bs.popover', function () {
assert.strictEqual($('.popover').length, 0, 'popover was removed')
$popover.bootstrapPopover('hide')
assert.strictEqual($('.popover').length, 0, 'popover was removed')
$popover.one('shown.bs.popover', function () {
popoverInserted()
$popover.one('hidden.bs.popover', function () {
assert.strictEqual($('.popover').length, 0, 'popover was removed')
done()
}).bootstrapPopover('hide')
}).bootstrapPopover('show')
}).bootstrapPopover('hide')
})
.bootstrapPopover('show')
})
QUnit.test('should get title and content from attributes', function (assert) {
assert.expect(4)
var done = assert.async()
var $popover = $('<a href="#" title="@mdo" data-content="loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻" >@mdo</a>')
.appendTo('#qunit-fixture')
.bootstrapPopover()
.one('shown.bs.popover', function () {
assert.notEqual($('.popover').length, 0, 'popover was inserted')
assert.strictEqual($('.popover .popover-header').text(), '@mdo', 'title correctly inserted')
assert.strictEqual($('.popover .popover-body').text(), 'loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻', 'content correctly inserted')
$popover.bootstrapPopover('hide')
})
.one('hidden.bs.popover', function () {
assert.strictEqual($('.popover').length, 0, 'popover was removed')
done()
})
.bootstrapPopover('show')
assert.notEqual($('.popover').length, 0, 'popover was inserted')
assert.strictEqual($('.popover .popover-header').text(), '@mdo', 'title correctly inserted')
assert.strictEqual($('.popover .popover-body').text(), 'loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻', 'content correctly inserted')
$popover.bootstrapPopover('hide')
assert.strictEqual($('.popover').length, 0, 'popover was removed')
})
QUnit.test('should get title and content from attributes ignoring options passed via js', function (assert) {
assert.expect(4)
var done = assert.async()
var $popover = $('<a href="#" title="@mdo" data-content="loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻" >@mdo</a>')
.appendTo('#qunit-fixture')
.bootstrapPopover({
title: 'ignored title option',
content: 'ignored content option'
})
.one('shown.bs.popover', function () {
assert.notEqual($('.popover').length, 0, 'popover was inserted')
assert.strictEqual($('.popover .popover-header').text(), '@mdo', 'title correctly inserted')
assert.strictEqual($('.popover .popover-body').text(), 'loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻', 'content correctly inserted')
$popover.bootstrapPopover('hide')
})
.one('hidden.bs.popover', function () {
assert.strictEqual($('.popover').length, 0, 'popover was removed')
done()
})
.bootstrapPopover('show')
assert.notEqual($('.popover').length, 0, 'popover was inserted')
assert.strictEqual($('.popover .popover-header').text(), '@mdo', 'title correctly inserted')
assert.strictEqual($('.popover .popover-body').text(), 'loves data attributes (づ｡◕‿‿◕｡)づ ︵ ┻━┻', 'content correctly inserted')
$popover.bootstrapPopover('hide')
assert.strictEqual($('.popover').length, 0, 'popover was removed')
})
QUnit.test('should respect custom template', function (assert) {
assert.expect(3)
var done = assert.async()
var $popover = $('<a href="#">@fat</a>')
.appendTo('#qunit-fixture')
.bootstrapPopover({
@ -214,14 +238,16 @@ $(function () {
content: 'Test',
template: '<div class="popover foobar"><div class="arrow"></div><div class="inner"><h3 class="title"/><div class="content"><p/></div></div></div>'
})
$popover.bootstrapPopover('show')
assert.notEqual($('.popover').length, 0, 'popover was inserted')
assert.ok($('.popover').hasClass('foobar'), 'custom class is present')
$popover.bootstrapPopover('hide')
assert.strictEqual($('.popover').length, 0, 'popover was removed')
.one('shown.bs.popover', function () {
assert.notEqual($('.popover').length, 0, 'popover was inserted')
assert.ok($('.popover').hasClass('foobar'), 'custom class is present')
$popover.bootstrapPopover('hide')
})
.one('hidden.bs.popover', function () {
assert.strictEqual($('.popover').length, 0, 'popover was removed')
done()
})
.bootstrapPopover('show')
})
QUnit.test('should destroy popover', function (assert) {
@ -247,18 +273,23 @@ $(function () {
QUnit.test('should render popover element using delegated selector', function (assert) {
assert.expect(2)
var done = assert.async()
var $div = $('<div><a href="#" title="mdo" data-content="https://twitter.com/mdo">@mdo</a></div>')
.appendTo('#qunit-fixture')
.bootstrapPopover({
selector: 'a',
trigger: 'click'
})
.one('shown.bs.popover', function () {
assert.notEqual($('.popover').length, 0, 'popover was inserted')
$div.find('a').trigger('click')
})
.one('hidden.bs.popover', function () {
assert.strictEqual($('.popover').length, 0, 'popover was removed')
done()
})
$div.find('a').trigger('click')
assert.notEqual($('.popover').length, 0, 'popover was inserted')
$div.find('a').trigger('click')
assert.strictEqual($('.popover').length, 0, 'popover was removed')
})
QUnit.test('should detach popover content rather than removing it so that event handlers are left intact', function (assert) {
@ -276,6 +307,7 @@ $(function () {
html: true,
trigger: 'manual',
container: 'body',
animation: false,
content: function () {
return $content
}
@ -289,8 +321,8 @@ $(function () {
$div
.one('shown.bs.popover', function () {
$('.content-with-handler .btn').trigger('click')
$div.bootstrapPopover('dispose')
assert.ok(handlerCalled, 'content\'s event handler still present')
$div.bootstrapPopover('dispose')
done()
})
.bootstrapPopover('show')

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

@ -77,15 +77,21 @@ $(function () {
QUnit.test('should remove aria-describedby from trigger on hide', function (assert) {
assert.expect(2)
var done = assert.async()
var $trigger = $('<a href="#" rel="tooltip" title="Another tooltip"/>')
.bootstrapTooltip()
.appendTo('#qunit-fixture')
$trigger.bootstrapTooltip('show')
assert.ok($trigger[0].hasAttribute('aria-describedby'), 'trigger has aria-describedby')
$trigger.bootstrapTooltip('hide')
assert.ok(!$trigger[0].hasAttribute('aria-describedby'), 'trigger does not have aria-describedby')
$trigger
.one('shown.bs.tooltip', function () {
assert.ok($trigger[0].hasAttribute('aria-describedby'), 'trigger has aria-describedby')
$trigger.bootstrapTooltip('hide')
})
.one('hidden.bs.tooltip', function () {
assert.ok(!$trigger[0].hasAttribute('aria-describedby'), 'trigger does not have aria-describedby')
done()
})
.bootstrapTooltip('show')
})
QUnit.test('should assign a unique id tooltip element', function (assert) {
@ -102,40 +108,51 @@ $(function () {
QUnit.test('should place tooltips relative to placement option', function (assert) {
assert.expect(2)
var done = assert.async()
var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>')
.appendTo('#qunit-fixture')
.bootstrapTooltip({
placement: 'bottom'
})
$tooltip.bootstrapTooltip('show')
$tooltip
.one('shown.bs.tooltip', function () {
assert.ok($('.tooltip')
.is('.fade.bs-tooltip-bottom.show'), 'has correct classes applied')
assert
.ok($('.tooltip')
.is('.fade.bs-tooltip-bottom.show'), 'has correct classes applied')
$tooltip.bootstrapTooltip('hide')
assert.strictEqual($tooltip.data('bs.tooltip').tip.parentNode, null, 'tooltip removed')
$tooltip.bootstrapTooltip('hide')
})
.one('hidden.bs.tooltip', function () {
assert.strictEqual($tooltip.data('bs.tooltip').tip.parentNode, null, 'tooltip removed')
done()
})
.bootstrapTooltip('show')
})
QUnit.test('should allow html entities', function (assert) {
assert.expect(2)
var done = assert.async()
var $tooltip = $('<a href="#" rel="tooltip" title="&lt;b&gt;@fat&lt;/b&gt;"/>')
.appendTo('#qunit-fixture')
.bootstrapTooltip({
html: true
})
$tooltip.bootstrapTooltip('show')
assert.notEqual($('.tooltip b').length, 0, 'b tag was inserted')
$tooltip.bootstrapTooltip('hide')
assert.strictEqual($tooltip.data('bs.tooltip').tip.parentNode, null, 'tooltip removed')
$tooltip
.one('shown.bs.tooltip', function () {
assert.notEqual($('.tooltip b').length, 0, 'b tag was inserted')
$tooltip.bootstrapTooltip('hide')
})
.one('hidden.bs.tooltip', function () {
assert.strictEqual($tooltip.data('bs.tooltip').tip.parentNode, null, 'tooltip removed')
done()
})
.bootstrapTooltip('show')
})
QUnit.test('should allow DOMElement title (html: false)', function (assert) {
assert.expect(3)
var done = assert.async()
var title = document.createTextNode('<3 writing tests')
var $tooltip = $('<a href="#" rel="tooltip"/>')
.appendTo('#qunit-fixture')
@ -143,15 +160,19 @@ $(function () {
title: title
})
$tooltip.bootstrapTooltip('show')
assert.notEqual($('.tooltip').length, 0, 'tooltip inserted')
assert.strictEqual($('.tooltip').text(), '<3 writing tests', 'title inserted')
assert.ok(!$.contains($('.tooltip').get(0), title), 'title node copied, not moved')
$tooltip
.one('shown.bs.tooltip', function () {
assert.notEqual($('.tooltip').length, 0, 'tooltip inserted')
assert.strictEqual($('.tooltip').text(), '<3 writing tests', 'title inserted')
assert.ok(!$.contains($('.tooltip').get(0), title), 'title node copied, not moved')
done()
})
.bootstrapTooltip('show')
})
QUnit.test('should allow DOMElement title (html: true)', function (assert) {
assert.expect(3)
var done = assert.async()
var title = document.createTextNode('<3 writing tests')
var $tooltip = $('<a href="#" rel="tooltip"/>')
.appendTo('#qunit-fixture')
@ -160,26 +181,35 @@ $(function () {
title: title
})
$tooltip.bootstrapTooltip('show')
assert.notEqual($('.tooltip').length, 0, 'tooltip inserted')
assert.strictEqual($('.tooltip').text(), '<3 writing tests', 'title inserted')
assert.ok($.contains($('.tooltip').get(0), title), 'title node moved, not copied')
$tooltip
.one('shown.bs.tooltip', function () {
assert.notEqual($('.tooltip').length, 0, 'tooltip inserted')
assert.strictEqual($('.tooltip').text(), '<3 writing tests', 'title inserted')
assert.ok($.contains($('.tooltip').get(0), title), 'title node moved, not copied')
done()
})
.bootstrapTooltip('show')
})
QUnit.test('should respect custom classes', function (assert) {
assert.expect(2)
var done = assert.async()
var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>')
.appendTo('#qunit-fixture')
.bootstrapTooltip({
template: '<div class="tooltip some-class"><div class="tooltip-arrow"/><div class="tooltip-inner"/></div>'
})
$tooltip.bootstrapTooltip('show')
assert.ok($('.tooltip').hasClass('some-class'), 'custom class is present')
$tooltip.bootstrapTooltip('hide')
assert.strictEqual($tooltip.data('bs.tooltip').tip.parentNode, null, 'tooltip removed')
$tooltip
.one('shown.bs.tooltip', function () {
assert.ok($('.tooltip').hasClass('some-class'), 'custom class is present')
$tooltip.bootstrapTooltip('hide')
})
.one('hidden.bs.tooltip', function () {
assert.strictEqual($tooltip.data('bs.tooltip').tip.parentNode, null, 'tooltip removed')
done()
})
.bootstrapTooltip('show')
})
QUnit.test('should fire show event', function (assert) {
@ -363,18 +393,24 @@ $(function () {
QUnit.test('should place tooltips inside body when container is body', function (assert) {
assert.expect(3)
var done = assert.async()
var $tooltip = $('<a href="#" rel="tooltip" title="Another tooltip"/>')
.appendTo('#qunit-fixture')
.bootstrapTooltip({
container: 'body'
})
$tooltip
.one('shown.bs.tooltip', function () {
assert.notEqual($('body > .tooltip').length, 0, 'tooltip is direct descendant of body')
assert.strictEqual($('#qunit-fixture > .tooltip').length, 0, 'tooltip is not in parent')
$tooltip.bootstrapTooltip('hide')
})
.one('hidden.bs.tooltip', function () {
assert.strictEqual($('body > .tooltip').length, 0, 'tooltip was removed from dom')
done()
})
.bootstrapTooltip('show')
assert.notEqual($('body > .tooltip').length, 0, 'tooltip is direct descendant of body')
assert.strictEqual($('#qunit-fixture > .tooltip').length, 0, 'tooltip is not in parent')
$tooltip.bootstrapTooltip('hide')
assert.strictEqual($('body > .tooltip').length, 0, 'tooltip was removed from dom')
})
QUnit.test('should add position class before positioning so that position-specific styles are taken into account', function (assert) {
@ -405,45 +441,63 @@ $(function () {
QUnit.test('should use title attribute for tooltip text', function (assert) {
assert.expect(2)
var done = assert.async()
var $tooltip = $('<a href="#" rel="tooltip" title="Simple tooltip"/>')
.appendTo('#qunit-fixture')
.bootstrapTooltip()
$tooltip.bootstrapTooltip('show')
assert.strictEqual($('.tooltip').children('.tooltip-inner').text(), 'Simple tooltip', 'title from title attribute is set')
$tooltip.bootstrapTooltip('hide')
assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
$tooltip
.one('shown.bs.tooltip', function () {
assert.strictEqual($('.tooltip').children('.tooltip-inner').text(), 'Simple tooltip', 'title from title attribute is set')
$tooltip.bootstrapTooltip('hide')
})
.one('hidden.bs.tooltip', function () {
assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
done()
})
.bootstrapTooltip('show')
})
QUnit.test('should prefer title attribute over title option', function (assert) {
assert.expect(2)
var done = assert.async()
var $tooltip = $('<a href="#" rel="tooltip" title="Simple tooltip"/>')
.appendTo('#qunit-fixture')
.bootstrapTooltip({
title: 'This is a tooltip with some content'
})
$tooltip.bootstrapTooltip('show')
assert.strictEqual($('.tooltip').children('.tooltip-inner').text(), 'Simple tooltip', 'title is set from title attribute while preferred over title option')
$tooltip.bootstrapTooltip('hide')
assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
$tooltip
.one('shown.bs.tooltip', function () {
assert.strictEqual($('.tooltip').children('.tooltip-inner').text(), 'Simple tooltip', 'title is set from title attribute while preferred over title option')
$tooltip.bootstrapTooltip('hide')
})
.one('hidden.bs.tooltip', function () {
assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
done()
})
.bootstrapTooltip('show')
})
QUnit.test('should use title option', function (assert) {
assert.expect(2)
var done = assert.async()
var $tooltip = $('<a href="#" rel="tooltip"/>')
.appendTo('#qunit-fixture')
.bootstrapTooltip({
title: 'This is a tooltip with some content'
})
$tooltip.bootstrapTooltip('show')
assert.strictEqual($('.tooltip').children('.tooltip-inner').text(), 'This is a tooltip with some content', 'title from title option is set')
$tooltip.bootstrapTooltip('hide')
assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
$tooltip
.one('shown.bs.tooltip', function () {
assert.strictEqual($('.tooltip').children('.tooltip-inner').text(), 'This is a tooltip with some content', 'title from title option is set')
$tooltip.bootstrapTooltip('hide')
})
.one('hidden.bs.tooltip', function () {
assert.strictEqual($('.tooltip').length, 0, 'tooltip removed from dom')
done()
})
.bootstrapTooltip('show')
})
QUnit.test('should not error when trying to show an top-placed tooltip that has been removed from the dom', function (assert) {
@ -869,7 +923,6 @@ $(function () {
var done = assert.async()
var $el = $('<a href="#" rel="tooltip" title="7"/>')
.appendTo('#qunit-fixture')
.bootstrapTooltip('show')
.on('shown.bs.tooltip', function () {
var tooltip = $el.data('bs.tooltip')
var $tooltip = $(tooltip.getTipElement())

5
js/tests/unit/util.js
View File

@ -90,4 +90,9 @@ $(function () {
id2 = Util.getUID('test')
assert.ok(id !== id2, id + ' !== ' + id2)
})
QUnit.test('Util.supportsTransitionEnd should return true', function (assert) {
assert.expect(1)
assert.ok(Util.supportsTransitionEnd())
})
})