2011-09-10 21:49:21 +02:00
$ ( function ( ) {
2016-11-21 15:36:00 +01:00
'use strict'
2011-09-10 21:49:21 +02:00
2015-05-06 22:34:14 +02:00
QUnit . module ( 'tooltip plugin' )
2014-02-13 08:55:12 +01:00
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should be defined on jquery object' , function ( assert ) {
assert . expect ( 1 )
assert . ok ( $ ( document . body ) . tooltip , 'tooltip method is defined' )
2014-02-13 08:55:12 +01:00
} )
2015-05-06 22:34:14 +02:00
QUnit . module ( 'tooltip' , {
beforeEach : function ( ) {
2014-04-22 07:03:33 +02:00
// Run all tests in noConflict mode -- it's the only way to ensure that the plugin works in noConflict mode
$ . fn . bootstrapTooltip = $ . fn . tooltip . noConflict ( )
} ,
2015-05-06 22:34:14 +02:00
afterEach : function ( ) {
2014-04-22 07:03:33 +02:00
$ . fn . tooltip = $ . fn . bootstrapTooltip
delete $ . fn . bootstrapTooltip
2015-05-12 08:32:37 +02:00
$ ( '.tooltip' ) . remove ( )
2018-05-07 15:56:24 +02:00
$ ( '#qunit-fixture' ) . html ( '' )
2014-04-22 07:03:33 +02:00
}
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should provide no conflict' , function ( assert ) {
assert . expect ( 1 )
2017-07-27 12:39:55 +02:00
assert . strictEqual ( typeof $ . fn . tooltip , 'undefined' , 'tooltip was set back to undefined (org value)' )
2014-04-22 07:03:33 +02:00
} )
2015-09-16 10:35:29 +02:00
QUnit . test ( 'should throw explicit error on undefined method' , function ( assert ) {
assert . expect ( 1 )
var $el = $ ( '<div/>' )
$el . bootstrapTooltip ( )
try {
$el . bootstrapTooltip ( 'noMethod' )
2020-06-12 20:50:30 +02:00
} catch ( error ) {
assert . strictEqual ( error . message , 'No method named "noMethod"' )
2015-09-16 10:35:29 +02:00
}
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should return jquery collection containing the element' , function ( assert ) {
assert . expect ( 2 )
2014-06-18 21:35:03 +02:00
var $el = $ ( '<div/>' )
var $tooltip = $el . bootstrapTooltip ( )
2015-05-06 22:34:14 +02:00
assert . ok ( $tooltip instanceof $ , 'returns jquery collection' )
assert . strictEqual ( $tooltip [ 0 ] , $el [ 0 ] , 'collection contains element' )
2014-02-13 08:55:12 +01:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should expose default settings' , function ( assert ) {
assert . expect ( 1 )
2015-05-12 08:32:37 +02:00
assert . ok ( $ . fn . bootstrapTooltip . Constructor . Default , 'defaults is defined' )
2014-02-13 08:55:12 +01:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should empty title attribute' , function ( assert ) {
assert . expect ( 1 )
2014-06-18 21:35:03 +02:00
var $trigger = $ ( '<a href="#" rel="tooltip" title="Another tooltip"/>' ) . bootstrapTooltip ( )
2015-05-06 22:34:14 +02:00
assert . strictEqual ( $trigger . attr ( 'title' ) , '' , 'title attribute was emptied' )
2014-02-13 08:55:12 +01:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should add data attribute for referencing original title' , function ( assert ) {
assert . expect ( 1 )
2014-06-18 21:35:03 +02:00
var $trigger = $ ( '<a href="#" rel="tooltip" title="Another tooltip"/>' ) . bootstrapTooltip ( )
2015-05-06 22:34:14 +02:00
assert . strictEqual ( $trigger . attr ( 'data-original-title' ) , 'Another tooltip' , 'original title preserved in data attribute' )
2014-02-13 08:55:12 +01:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should add aria-describedby to the trigger on show' , function ( assert ) {
assert . expect ( 3 )
var $trigger = $ ( '<a href="#" rel="tooltip" title="Another tooltip"/>' )
2014-06-18 21:35:03 +02:00
. bootstrapTooltip ( )
2014-05-09 05:19:12 +02:00
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( 'show' )
2014-06-18 21:35:03 +02:00
2014-05-09 05:19:12 +02:00
var id = $ ( '.tooltip' ) . attr ( 'id' )
2015-05-06 22:34:14 +02:00
assert . strictEqual ( $ ( '#' + id ) . length , 1 , 'has a unique id' )
assert . strictEqual ( $ ( '.tooltip' ) . attr ( 'aria-describedby' ) , $trigger . attr ( 'id' ) , 'tooltip id and aria-describedby on trigger match' )
assert . ok ( $trigger [ 0 ] . hasAttribute ( 'aria-describedby' ) , 'trigger has aria-describedby' )
2014-05-09 05:19:12 +02:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should remove aria-describedby from trigger on hide' , function ( assert ) {
assert . expect ( 2 )
2018-03-20 11:07:58 +01:00
var done = assert . async ( )
2015-05-06 22:34:14 +02:00
var $trigger = $ ( '<a href="#" rel="tooltip" title="Another tooltip"/>' )
2014-06-18 21:35:03 +02:00
. bootstrapTooltip ( )
2014-05-09 05:19:12 +02:00
. appendTo ( '#qunit-fixture' )
2014-06-18 21:35:03 +02:00
2018-03-20 11:07:58 +01:00
$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' )
2014-05-09 05:19:12 +02:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should assign a unique id tooltip element' , function ( assert ) {
assert . expect ( 2 )
$ ( '<a href="#" rel="tooltip" title="Another tooltip"/>' )
2014-05-09 05:19:12 +02:00
. appendTo ( '#qunit-fixture' )
2014-03-17 08:12:55 +01:00
. bootstrapTooltip ( 'show' )
2014-06-18 21:35:03 +02:00
2014-03-17 08:12:55 +01:00
var id = $ ( '.tooltip' ) . attr ( 'id' )
2014-05-09 05:19:12 +02:00
2015-05-06 22:34:14 +02:00
assert . strictEqual ( $ ( '#' + id ) . length , 1 , 'tooltip has unique id' )
assert . strictEqual ( id . indexOf ( 'tooltip' ) , 0 , 'tooltip id has prefix' )
2014-05-09 05:19:12 +02:00
} )
2015-05-12 23:28:11 +02:00
QUnit . test ( 'should place tooltips relative to placement option' , function ( assert ) {
2015-05-06 22:34:14 +02:00
assert . expect ( 2 )
2018-03-20 11:07:58 +01:00
var done = assert . async ( )
2015-05-06 22:34:14 +02:00
var $tooltip = $ ( '<a href="#" rel="tooltip" title="Another tooltip"/>' )
2014-02-13 08:55:12 +01:00
. appendTo ( '#qunit-fixture' )
2017-12-16 13:00:38 +01:00
. bootstrapTooltip ( {
placement : 'bottom'
} )
2014-02-13 08:55:12 +01:00
2018-03-20 11:07:58 +01:00
$tooltip
. one ( 'shown.bs.tooltip' , function ( ) {
assert . ok ( $ ( '.tooltip' )
. is ( '.fade.bs-tooltip-bottom.show' ) , 'has correct classes applied' )
2015-05-12 08:32:37 +02:00
2018-03-20 11:07:58 +01:00
$tooltip . bootstrapTooltip ( 'hide' )
} )
. one ( 'hidden.bs.tooltip' , function ( ) {
assert . strictEqual ( $tooltip . data ( 'bs.tooltip' ) . tip . parentNode , null , 'tooltip removed' )
done ( )
} )
. bootstrapTooltip ( 'show' )
2014-02-13 08:55:12 +01:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should allow html entities' , function ( assert ) {
assert . expect ( 2 )
2018-03-20 11:07:58 +01:00
var done = assert . async ( )
2015-05-06 22:34:14 +02:00
var $tooltip = $ ( '<a href="#" rel="tooltip" title="<b>@fat</b>"/>' )
2014-02-13 08:55:12 +01:00
. appendTo ( '#qunit-fixture' )
2017-12-16 13:00:38 +01:00
. bootstrapTooltip ( {
html : true
} )
2014-02-13 08:55:12 +01:00
2018-03-20 11:07:58 +01:00
$tooltip
. one ( 'shown.bs.tooltip' , function ( ) {
2020-05-08 15:36:20 +02:00
assert . notStrictEqual ( $ ( '.tooltip b' ) . length , 0 , 'b tag was inserted' )
2018-03-20 11:07:58 +01:00
$tooltip . bootstrapTooltip ( 'hide' )
} )
. one ( 'hidden.bs.tooltip' , function ( ) {
assert . strictEqual ( $tooltip . data ( 'bs.tooltip' ) . tip . parentNode , null , 'tooltip removed' )
done ( )
} )
. bootstrapTooltip ( 'show' )
2014-02-13 08:55:12 +01:00
} )
2015-08-31 01:57:16 +02:00
QUnit . test ( 'should allow DOMElement title (html: false)' , function ( assert ) {
assert . expect ( 3 )
2018-03-20 11:07:58 +01:00
var done = assert . async ( )
2015-08-31 01:57:16 +02:00
var title = document . createTextNode ( '<3 writing tests' )
var $tooltip = $ ( '<a href="#" rel="tooltip"/>' )
. appendTo ( '#qunit-fixture' )
2017-12-16 13:00:38 +01:00
. bootstrapTooltip ( {
title : title
} )
2015-08-31 01:57:16 +02:00
2018-03-20 11:07:58 +01:00
$tooltip
. one ( 'shown.bs.tooltip' , function ( ) {
2020-05-08 15:36:20 +02:00
assert . notStrictEqual ( $ ( '.tooltip' ) . length , 0 , 'tooltip inserted' )
2018-03-20 11:07:58 +01:00
assert . strictEqual ( $ ( '.tooltip' ) . text ( ) , '<3 writing tests' , 'title inserted' )
assert . ok ( ! $ . contains ( $ ( '.tooltip' ) . get ( 0 ) , title ) , 'title node copied, not moved' )
done ( )
} )
. bootstrapTooltip ( 'show' )
2015-08-31 01:57:16 +02:00
} )
QUnit . test ( 'should allow DOMElement title (html: true)' , function ( assert ) {
assert . expect ( 3 )
2018-03-20 11:07:58 +01:00
var done = assert . async ( )
2015-08-31 01:57:16 +02:00
var title = document . createTextNode ( '<3 writing tests' )
var $tooltip = $ ( '<a href="#" rel="tooltip"/>' )
. appendTo ( '#qunit-fixture' )
2017-12-16 13:00:38 +01:00
. bootstrapTooltip ( {
html : true ,
title : title
} )
2015-08-31 01:57:16 +02:00
2018-03-20 11:07:58 +01:00
$tooltip
. one ( 'shown.bs.tooltip' , function ( ) {
2020-05-08 15:36:20 +02:00
assert . notStrictEqual ( $ ( '.tooltip' ) . length , 0 , 'tooltip inserted' )
2018-03-20 11:07:58 +01:00
assert . strictEqual ( $ ( '.tooltip' ) . text ( ) , '<3 writing tests' , 'title inserted' )
assert . ok ( $ . contains ( $ ( '.tooltip' ) . get ( 0 ) , title ) , 'title node moved, not copied' )
done ( )
} )
. bootstrapTooltip ( 'show' )
2015-08-31 01:57:16 +02:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should respect custom classes' , function ( assert ) {
assert . expect ( 2 )
2018-03-20 11:07:58 +01:00
var done = assert . async ( )
2015-05-06 22:34:14 +02:00
var $tooltip = $ ( '<a href="#" rel="tooltip" title="Another tooltip"/>' )
2014-02-13 08:55:12 +01:00
. appendTo ( '#qunit-fixture' )
2017-12-16 13:00:38 +01:00
. bootstrapTooltip ( {
template : '<div class="tooltip some-class"><div class="tooltip-arrow"/><div class="tooltip-inner"/></div>'
} )
2014-02-13 08:55:12 +01:00
2018-03-20 11:07:58 +01:00
$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' )
2014-02-13 08:55:12 +01:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should fire show event' , function ( assert ) {
assert . expect ( 1 )
2015-01-21 04:40:50 +01:00
var done = assert . async ( )
2014-06-18 21:35:03 +02:00
2015-05-06 22:34:14 +02:00
$ ( '<div title="tooltip title"/>' )
2014-02-13 08:55:12 +01:00
. on ( 'show.bs.tooltip' , function ( ) {
2015-05-06 22:34:14 +02:00
assert . ok ( true , 'show event fired' )
2015-01-21 04:40:50 +01:00
done ( )
2014-02-13 08:55:12 +01:00
} )
2014-04-22 07:03:33 +02:00
. bootstrapTooltip ( 'show' )
2014-02-13 08:55:12 +01:00
} )
2016-11-01 04:33:53 +01:00
QUnit . test ( 'should throw an error when show is called on hidden elements' , function ( assert ) {
assert . expect ( 1 )
var done = assert . async ( )
try {
$ ( '<div title="tooltip title" style="display: none"/>' ) . bootstrapTooltip ( 'show' )
2020-06-12 20:50:30 +02:00
} catch ( error ) {
assert . strictEqual ( error . message , 'Please use show on visible elements' )
2016-11-01 04:33:53 +01:00
done ( )
}
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should fire inserted event' , function ( assert ) {
assert . expect ( 2 )
2015-01-21 04:40:50 +01:00
var done = assert . async ( )
2014-06-18 21:35:03 +02:00
2015-05-06 22:34:14 +02:00
$ ( '<div title="tooltip title"/>' )
2014-06-18 21:35:03 +02:00
. appendTo ( '#qunit-fixture' )
2015-05-06 22:34:14 +02:00
. on ( 'inserted.bs.tooltip' , function ( ) {
2020-05-08 15:36:20 +02:00
assert . notStrictEqual ( $ ( '.tooltip' ) . length , 0 , 'tooltip was inserted' )
2015-05-06 22:34:14 +02:00
assert . ok ( true , 'inserted event fired' )
2015-01-21 04:40:50 +01:00
done ( )
2014-02-13 08:55:12 +01:00
} )
2014-04-22 07:03:33 +02:00
. bootstrapTooltip ( 'show' )
2014-02-13 08:55:12 +01:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should fire shown event' , function ( assert ) {
assert . expect ( 1 )
2015-01-21 04:40:50 +01:00
var done = assert . async ( )
2014-06-18 21:35:03 +02:00
2015-05-06 22:34:14 +02:00
$ ( '<div title="tooltip title"></div>' )
2014-12-17 01:40:54 +01:00
. appendTo ( '#qunit-fixture' )
2015-05-06 22:34:14 +02:00
. on ( 'shown.bs.tooltip' , function ( ) {
assert . ok ( true , 'shown was called' )
done ( )
} )
. bootstrapTooltip ( 'show' )
} )
QUnit . test ( 'should not fire shown event when show was prevented' , function ( assert ) {
assert . expect ( 1 )
var done = assert . async ( )
$ ( '<div title="tooltip title"/>' )
2014-02-13 08:55:12 +01:00
. on ( 'show.bs.tooltip' , function ( e ) {
e . preventDefault ( )
2015-05-06 22:34:14 +02:00
assert . ok ( true , 'show event fired' )
2015-01-21 04:40:50 +01:00
done ( )
2014-02-13 08:55:12 +01:00
} )
. on ( 'shown.bs.tooltip' , function ( ) {
2015-05-06 22:34:14 +02:00
assert . ok ( false , 'shown event fired' )
2014-02-13 08:55:12 +01:00
} )
2014-04-22 07:03:33 +02:00
. bootstrapTooltip ( 'show' )
2014-02-13 08:55:12 +01:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should fire hide event' , function ( assert ) {
assert . expect ( 1 )
2015-01-21 04:40:50 +01:00
var done = assert . async ( )
2014-06-18 21:35:03 +02:00
2015-05-06 22:34:14 +02:00
$ ( '<div title="tooltip title"/>' )
2014-06-18 21:35:03 +02:00
. appendTo ( '#qunit-fixture' )
2014-02-13 08:55:12 +01:00
. on ( 'shown.bs.tooltip' , function ( ) {
2014-04-22 07:03:33 +02:00
$ ( this ) . bootstrapTooltip ( 'hide' )
2014-02-13 08:55:12 +01:00
} )
. on ( 'hide.bs.tooltip' , function ( ) {
2015-05-06 22:34:14 +02:00
assert . ok ( true , 'hide event fired' )
2015-01-21 04:40:50 +01:00
done ( )
2014-02-13 08:55:12 +01:00
} )
2014-04-22 07:03:33 +02:00
. bootstrapTooltip ( 'show' )
2014-02-13 08:55:12 +01:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should fire hidden event' , function ( assert ) {
assert . expect ( 1 )
2015-01-21 04:40:50 +01:00
var done = assert . async ( )
2014-06-18 21:35:03 +02:00
2015-05-06 22:34:14 +02:00
$ ( '<div title="tooltip title"/>' )
2014-06-18 21:35:03 +02:00
. appendTo ( '#qunit-fixture' )
2014-02-13 08:55:12 +01:00
. on ( 'shown.bs.tooltip' , function ( ) {
2014-04-22 07:03:33 +02:00
$ ( this ) . bootstrapTooltip ( 'hide' )
2014-02-13 08:55:12 +01:00
} )
. on ( 'hidden.bs.tooltip' , function ( ) {
2015-05-06 22:34:14 +02:00
assert . ok ( true , 'hidden event fired' )
2015-01-21 04:40:50 +01:00
done ( )
2014-02-13 08:55:12 +01:00
} )
2014-04-22 07:03:33 +02:00
. bootstrapTooltip ( 'show' )
2014-02-13 08:55:12 +01:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should not fire hidden event when hide was prevented' , function ( assert ) {
assert . expect ( 1 )
2015-01-21 04:40:50 +01:00
var done = assert . async ( )
2014-06-18 21:35:03 +02:00
2015-05-06 22:34:14 +02:00
$ ( '<div title="tooltip title"/>' )
2014-06-18 21:35:03 +02:00
. appendTo ( '#qunit-fixture' )
2014-02-13 08:55:12 +01:00
. on ( 'shown.bs.tooltip' , function ( ) {
2014-04-22 07:03:33 +02:00
$ ( this ) . bootstrapTooltip ( 'hide' )
2014-02-13 08:55:12 +01:00
} )
. on ( 'hide.bs.tooltip' , function ( e ) {
e . preventDefault ( )
2015-05-06 22:34:14 +02:00
assert . ok ( true , 'hide event fired' )
2015-01-21 04:40:50 +01:00
done ( )
2014-02-13 08:55:12 +01:00
} )
. on ( 'hidden.bs.tooltip' , function ( ) {
2015-05-06 22:34:14 +02:00
assert . ok ( false , 'hidden event fired' )
2014-02-13 08:55:12 +01:00
} )
2014-04-22 07:03:33 +02:00
. bootstrapTooltip ( 'show' )
2014-02-13 08:55:12 +01:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should destroy tooltip' , function ( assert ) {
assert . expect ( 7 )
var $tooltip = $ ( '<div/>' )
2014-06-18 21:35:03 +02:00
. bootstrapTooltip ( )
2020-06-12 20:50:30 +02:00
. on ( 'click.foo' , function ( ) { } )
2014-06-18 21:35:03 +02:00
2015-05-06 22:34:14 +02:00
assert . ok ( $tooltip . data ( 'bs.tooltip' ) , 'tooltip has data' )
assert . ok ( $ . _data ( $tooltip [ 0 ] , 'events' ) . mouseover && $ . _data ( $tooltip [ 0 ] , 'events' ) . mouseout , 'tooltip has hover events' )
assert . strictEqual ( $ . _data ( $tooltip [ 0 ] , 'events' ) . click [ 0 ] . namespace , 'foo' , 'tooltip has extra click.foo event' )
2014-06-18 21:35:03 +02:00
$tooltip . bootstrapTooltip ( 'show' )
2015-05-13 21:48:34 +02:00
$tooltip . bootstrapTooltip ( 'dispose' )
2014-06-18 21:35:03 +02:00
2016-10-28 00:13:17 +02:00
assert . ok ( ! $tooltip . hasClass ( 'show' ) , 'tooltip is hidden' )
2015-05-06 22:34:14 +02:00
assert . ok ( ! $ . _data ( $tooltip [ 0 ] , 'bs.tooltip' ) , 'tooltip does not have data' )
assert . strictEqual ( $ . _data ( $tooltip [ 0 ] , 'events' ) . click [ 0 ] . namespace , 'foo' , 'tooltip still has click.foo' )
assert . ok ( ! $ . _data ( $tooltip [ 0 ] , 'events' ) . mouseover && ! $ . _data ( $tooltip [ 0 ] , 'events' ) . mouseout , 'tooltip does not have hover events' )
2014-02-13 08:55:12 +01:00
} )
2015-05-12 08:32:37 +02:00
// QUnit.test('should show tooltip with delegate selector on click', function (assert) {
// assert.expect(2)
// var $div = $('<div><a href="#" rel="tooltip" title="Another tooltip"/></div>')
// .appendTo('#qunit-fixture')
// .bootstrapTooltip({
// selector: 'a[rel="tooltip"]',
// trigger: 'click'
// })
2014-06-18 21:35:03 +02:00
2015-05-12 08:32:37 +02:00
// $div.find('a').trigger('click')
// assert.ok($('.tooltip').is('.fade.in'), 'tooltip is faded in')
2014-06-18 21:35:03 +02:00
2015-05-12 08:32:37 +02:00
// $div.find('a').trigger('click')
// assert.strictEqual($div.data('bs.tooltip').tip.parentNode, null, 'tooltip removed')
// })
2014-02-13 08:55:12 +01:00
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should show tooltip when toggle is called' , function ( assert ) {
assert . expect ( 1 )
$ ( '<a href="#" rel="tooltip" title="tooltip on toggle"/>' )
2014-02-13 08:55:12 +01:00
. appendTo ( '#qunit-fixture' )
2017-12-16 13:00:38 +01:00
. bootstrapTooltip ( {
trigger : 'manual'
} )
2014-04-22 07:03:33 +02:00
. bootstrapTooltip ( 'toggle' )
2014-06-18 21:35:03 +02:00
2016-10-28 00:13:17 +02:00
assert . ok ( $ ( '.tooltip' ) . is ( '.fade.show' ) , 'tooltip is faded active' )
2014-02-13 08:55:12 +01:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should hide previously shown tooltip when toggle is called on tooltip' , function ( assert ) {
assert . expect ( 1 )
2014-06-18 21:35:03 +02:00
$ ( '<a href="#" rel="tooltip" title="tooltip on toggle">@ResentedHook</a>' )
2014-05-14 19:36:32 +02:00
. appendTo ( '#qunit-fixture' )
2017-12-16 13:00:38 +01:00
. bootstrapTooltip ( {
trigger : 'manual'
} )
2014-06-18 21:35:03 +02:00
. bootstrapTooltip ( 'show' )
$ ( '.tooltip' ) . bootstrapTooltip ( 'toggle' )
2016-10-28 00:13:17 +02:00
assert . ok ( $ ( '.tooltip' ) . not ( '.fade.show' ) , 'tooltip was faded out' )
2014-05-14 19:36:32 +02:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should place tooltips inside body when container is body' , function ( assert ) {
assert . expect ( 3 )
2018-03-20 11:07:58 +01:00
var done = assert . async ( )
2015-05-06 22:34:14 +02:00
var $tooltip = $ ( '<a href="#" rel="tooltip" title="Another tooltip"/>' )
2014-02-13 08:55:12 +01:00
. appendTo ( '#qunit-fixture' )
2017-12-16 13:00:38 +01:00
. bootstrapTooltip ( {
container : 'body'
} )
2014-06-18 21:35:03 +02:00
2018-03-20 11:07:58 +01:00
$tooltip
. one ( 'shown.bs.tooltip' , function ( ) {
2020-05-08 15:36:20 +02:00
assert . notStrictEqual ( $ ( 'body > .tooltip' ) . length , 0 , 'tooltip is direct descendant of body' )
2018-03-20 11:07:58 +01:00
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' )
2014-02-13 08:55:12 +01:00
} )
2018-12-05 10:25:00 +01:00
QUnit . test ( 'should place tooltips inside a specific container when container is an element' , function ( assert ) {
assert . expect ( 3 )
var done = assert . async ( )
var $container = $ ( '<div></div>' ) . appendTo ( '#qunit-fixture' )
var $tooltip = $ ( '<a href="#" rel="tooltip" title="Another tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( {
container : $container [ 0 ]
} )
$tooltip
. one ( 'shown.bs.tooltip' , function ( ) {
assert . strictEqual ( $container . find ( '.tooltip' ) . length , 1 )
assert . strictEqual ( $ ( '#qunit-fixture > .tooltip' ) . length , 0 , 'tooltip is not in parent' )
$tooltip . bootstrapTooltip ( 'hide' )
} )
. one ( 'hidden.bs.tooltip' , function ( ) {
assert . strictEqual ( $container . find ( '.tooltip' ) . length , 0 , 'tooltip was removed from dom' )
done ( )
} )
. bootstrapTooltip ( 'show' )
} )
QUnit . test ( 'should place tooltips inside a specific container when container is a selector' , function ( assert ) {
assert . expect ( 3 )
var done = assert . async ( )
var $container = $ ( '<div id="container"></div>' ) . appendTo ( '#qunit-fixture' )
var $tooltip = $ ( '<a href="#" rel="tooltip" title="Another tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( {
container : '#container'
} )
$tooltip
. one ( 'shown.bs.tooltip' , function ( ) {
assert . strictEqual ( $container . find ( '.tooltip' ) . length , 1 )
assert . strictEqual ( $ ( '#qunit-fixture > .tooltip' ) . length , 0 , 'tooltip is not in parent' )
$tooltip . bootstrapTooltip ( 'hide' )
} )
. one ( 'hidden.bs.tooltip' , function ( ) {
assert . strictEqual ( $container . find ( '.tooltip' ) . length , 0 , 'tooltip was removed from dom' )
done ( )
} )
. bootstrapTooltip ( 'show' )
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should add position class before positioning so that position-specific styles are taken into account' , function ( assert ) {
2017-04-08 21:13:15 +02:00
assert . expect ( 2 )
var done = assert . async ( )
2017-12-16 13:00:38 +01:00
var styles = '<style>' +
'.bs-tooltip-right { white-space: nowrap; }' +
'.bs-tooltip-right .tooltip-inner { max-width: none; }' +
'</style>'
2014-07-09 00:38:44 +02:00
var $styles = $ ( styles ) . appendTo ( 'head' )
2014-06-18 21:35:03 +02:00
2014-07-07 07:12:26 +02:00
var $container = $ ( '<div/>' ) . appendTo ( '#qunit-fixture' )
2017-04-08 21:13:15 +02:00
$ ( '<a href="#" rel="tooltip" title="very very very very very very very very long tooltip in one line"/>' )
2014-06-18 21:35:03 +02:00
. appendTo ( $container )
. bootstrapTooltip ( {
2017-04-08 21:13:15 +02:00
placement : 'right' ,
trigger : 'manual'
} )
. on ( 'inserted.bs.tooltip' , function ( ) {
var $tooltip = $ ( $ ( this ) . data ( 'bs.tooltip' ) . tip )
assert . ok ( $tooltip . hasClass ( 'bs-tooltip-right' ) )
2017-07-27 12:39:55 +02:00
assert . ok ( typeof $tooltip . attr ( 'style' ) === 'undefined' )
2017-04-08 21:13:15 +02:00
$styles . remove ( )
done ( )
2014-06-18 21:35:03 +02:00
} )
. bootstrapTooltip ( 'show' )
2014-02-13 08:55:12 +01:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should use title attribute for tooltip text' , function ( assert ) {
assert . expect ( 2 )
2018-03-20 11:07:58 +01:00
var done = assert . async ( )
2015-05-06 22:34:14 +02:00
var $tooltip = $ ( '<a href="#" rel="tooltip" title="Simple tooltip"/>' )
2014-02-13 08:55:12 +01:00
. appendTo ( '#qunit-fixture' )
2014-06-18 21:35:03 +02:00
. bootstrapTooltip ( )
2018-03-20 11:07:58 +01:00
$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' )
2014-02-13 08:55:12 +01:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should prefer title attribute over title option' , function ( assert ) {
assert . expect ( 2 )
2018-03-20 11:07:58 +01:00
var done = assert . async ( )
2015-05-06 22:34:14 +02:00
var $tooltip = $ ( '<a href="#" rel="tooltip" title="Simple tooltip"/>' )
2014-02-13 08:55:12 +01:00
. appendTo ( '#qunit-fixture' )
2014-04-22 07:03:33 +02:00
. bootstrapTooltip ( {
2014-02-13 08:55:12 +01:00
title : 'This is a tooltip with some content'
} )
2014-06-18 21:35:03 +02:00
2018-03-20 11:07:58 +01:00
$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' )
2014-02-13 08:55:12 +01:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should use title option' , function ( assert ) {
assert . expect ( 2 )
2018-03-20 11:07:58 +01:00
var done = assert . async ( )
2015-05-06 22:34:14 +02:00
var $tooltip = $ ( '<a href="#" rel="tooltip"/>' )
2014-02-13 08:55:12 +01:00
. appendTo ( '#qunit-fixture' )
2014-04-22 07:03:33 +02:00
. bootstrapTooltip ( {
2014-02-13 08:55:12 +01:00
title : 'This is a tooltip with some content'
} )
2014-06-18 21:35:03 +02:00
2018-03-20 11:07:58 +01:00
$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' )
2014-06-18 21:35:03 +02:00
} )
2015-05-12 08:32:37 +02:00
QUnit . test ( 'should not error when trying to show an top-placed tooltip that has been removed from the dom' , function ( assert ) {
2015-05-06 22:34:14 +02:00
assert . expect ( 1 )
2014-06-18 21:35:03 +02:00
var passed = true
2015-05-06 22:34:14 +02:00
var $tooltip = $ ( '<a href="#" rel="tooltip" title="Another tooltip"/>' )
2014-06-18 21:35:03 +02:00
. appendTo ( '#qunit-fixture' )
2014-06-06 23:49:59 +02:00
. one ( 'show.bs.tooltip' , function ( ) {
2014-06-18 21:35:03 +02:00
$ ( this ) . remove ( )
2014-06-06 23:49:59 +02:00
} )
2017-12-16 13:00:38 +01:00
. bootstrapTooltip ( {
placement : 'top'
} )
2014-06-06 23:49:59 +02:00
try {
2014-06-18 21:35:03 +02:00
$tooltip . bootstrapTooltip ( 'show' )
2020-06-12 20:50:30 +02:00
} catch ( _ ) {
2014-06-06 23:49:59 +02:00
passed = false
}
2015-05-06 22:34:14 +02:00
assert . ok ( passed , '.tooltip(\'show\') should not throw an error if element no longer is in dom' )
2014-06-06 23:49:59 +02:00
} )
2014-07-07 07:12:26 +02:00
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should show tooltip if leave event hasn\'t occurred before delay expires' , function ( assert ) {
assert . expect ( 2 )
2015-01-21 04:40:50 +01:00
var done = assert . async ( )
2014-07-07 07:12:26 +02:00
2015-05-06 22:34:14 +02:00
var $tooltip = $ ( '<a href="#" rel="tooltip" title="Another tooltip"/>' )
2014-07-07 07:12:26 +02:00
. appendTo ( '#qunit-fixture' )
2017-12-16 13:00:38 +01:00
. bootstrapTooltip ( {
delay : 150
} )
2014-07-07 07:12:26 +02:00
setTimeout ( function ( ) {
2016-10-28 00:13:17 +02:00
assert . ok ( ! $ ( '.tooltip' ) . is ( '.fade.show' ) , '100ms: tooltip is not faded active' )
2014-10-27 23:53:41 +01:00
} , 100 )
2014-07-07 07:12:26 +02:00
setTimeout ( function ( ) {
2016-10-28 00:13:17 +02:00
assert . ok ( $ ( '.tooltip' ) . is ( '.fade.show' ) , '200ms: tooltip is faded active' )
2015-01-21 04:40:50 +01:00
done ( )
2014-10-27 23:53:41 +01:00
} , 200 )
2014-07-07 07:12:26 +02:00
$tooltip . trigger ( 'mouseenter' )
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should not show tooltip if leave event occurs before delay expires' , function ( assert ) {
assert . expect ( 2 )
2015-01-21 04:40:50 +01:00
var done = assert . async ( )
2014-07-07 07:12:26 +02:00
2015-05-06 22:34:14 +02:00
var $tooltip = $ ( '<a href="#" rel="tooltip" title="Another tooltip"/>' )
2014-07-07 07:12:26 +02:00
. appendTo ( '#qunit-fixture' )
2017-12-16 13:00:38 +01:00
. bootstrapTooltip ( {
delay : 150
} )
2014-07-07 07:12:26 +02:00
setTimeout ( function ( ) {
2016-10-28 00:13:17 +02:00
assert . ok ( ! $ ( '.tooltip' ) . is ( '.fade.show' ) , '100ms: tooltip not faded active' )
2014-07-07 07:12:26 +02:00
$tooltip . trigger ( 'mouseout' )
2014-10-27 23:53:41 +01:00
} , 100 )
2014-07-07 07:12:26 +02:00
setTimeout ( function ( ) {
2016-10-28 00:13:17 +02:00
assert . ok ( ! $ ( '.tooltip' ) . is ( '.fade.show' ) , '200ms: tooltip not faded active' )
2015-01-21 04:40:50 +01:00
done ( )
2014-10-27 23:53:41 +01:00
} , 200 )
2014-07-07 07:12:26 +02:00
$tooltip . trigger ( 'mouseenter' )
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should not hide tooltip if leave event occurs and enter event occurs within the hide delay' , function ( assert ) {
assert . expect ( 3 )
2015-01-21 04:40:50 +01:00
var done = assert . async ( )
2014-07-07 07:12:26 +02:00
2015-05-06 22:34:14 +02:00
var $tooltip = $ ( '<a href="#" rel="tooltip" title="Another tooltip"/>' )
2014-07-07 07:12:26 +02:00
. appendTo ( '#qunit-fixture' )
2017-12-16 13:00:38 +01:00
. bootstrapTooltip ( {
delay : {
show : 0 ,
hide : 150
}
} )
2014-07-07 07:12:26 +02:00
setTimeout ( function ( ) {
2016-10-28 00:13:17 +02:00
assert . ok ( $ ( '.tooltip' ) . is ( '.fade.show' ) , '1ms: tooltip faded active' )
2014-07-07 07:12:26 +02:00
$tooltip . trigger ( 'mouseout' )
setTimeout ( function ( ) {
2016-10-28 00:13:17 +02:00
assert . ok ( $ ( '.tooltip' ) . is ( '.fade.show' ) , '100ms: tooltip still faded active' )
2014-07-07 07:12:26 +02:00
$tooltip . trigger ( 'mouseenter' )
2014-10-27 23:53:41 +01:00
} , 100 )
2014-07-07 07:12:26 +02:00
setTimeout ( function ( ) {
2016-10-28 00:13:17 +02:00
assert . ok ( $ ( '.tooltip' ) . is ( '.fade.show' ) , '200ms: tooltip still faded active' )
2015-01-21 04:40:50 +01:00
done ( )
2014-10-27 23:53:41 +01:00
} , 200 )
2014-07-07 07:12:26 +02:00
} , 0 )
$tooltip . trigger ( 'mouseenter' )
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should not show tooltip if leave event occurs before delay expires' , function ( assert ) {
assert . expect ( 2 )
2015-01-21 04:40:50 +01:00
var done = assert . async ( )
2014-07-07 07:12:26 +02:00
2015-05-06 22:34:14 +02:00
var $tooltip = $ ( '<a href="#" rel="tooltip" title="Another tooltip"/>' )
2014-07-07 07:12:26 +02:00
. appendTo ( '#qunit-fixture' )
2017-12-16 13:00:38 +01:00
. bootstrapTooltip ( {
delay : 150
} )
2014-07-07 07:12:26 +02:00
setTimeout ( function ( ) {
2016-10-28 00:13:17 +02:00
assert . ok ( ! $ ( '.tooltip' ) . is ( '.fade.show' ) , '100ms: tooltip not faded active' )
2014-07-07 07:12:26 +02:00
$tooltip . trigger ( 'mouseout' )
2014-10-27 23:53:41 +01:00
} , 100 )
2014-07-07 07:12:26 +02:00
setTimeout ( function ( ) {
2016-10-28 00:13:17 +02:00
assert . ok ( ! $ ( '.tooltip' ) . is ( '.fade.show' ) , '200ms: tooltip not faded active' )
2015-01-21 04:40:50 +01:00
done ( )
2014-10-27 23:53:41 +01:00
} , 200 )
2014-07-07 07:12:26 +02:00
$tooltip . trigger ( 'mouseenter' )
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should not show tooltip if leave event occurs before delay expires, even if hide delay is 0' , function ( assert ) {
assert . expect ( 2 )
2015-01-21 04:40:50 +01:00
var done = assert . async ( )
2014-07-07 07:12:26 +02:00
2015-05-06 22:34:14 +02:00
var $tooltip = $ ( '<a href="#" rel="tooltip" title="Another tooltip"/>' )
2014-07-07 07:12:26 +02:00
. appendTo ( '#qunit-fixture' )
2017-12-16 13:00:38 +01:00
. bootstrapTooltip ( {
delay : {
show : 150 ,
hide : 0
}
} )
2014-07-07 07:12:26 +02:00
setTimeout ( function ( ) {
2016-10-28 00:13:17 +02:00
assert . ok ( ! $ ( '.tooltip' ) . is ( '.fade.show' ) , '100ms: tooltip not faded active' )
2014-07-07 07:12:26 +02:00
$tooltip . trigger ( 'mouseout' )
2014-10-27 23:53:41 +01:00
} , 100 )
2014-07-07 07:12:26 +02:00
setTimeout ( function ( ) {
2016-10-28 00:13:17 +02:00
assert . ok ( ! $ ( '.tooltip' ) . is ( '.fade.show' ) , '250ms: tooltip not faded active' )
2015-01-21 04:40:50 +01:00
done ( )
2014-10-27 23:53:41 +01:00
} , 250 )
2014-07-07 07:12:26 +02:00
$tooltip . trigger ( 'mouseenter' )
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should wait 200ms before hiding the tooltip' , function ( assert ) {
assert . expect ( 3 )
2015-01-21 04:40:50 +01:00
var done = assert . async ( )
2014-07-07 07:12:26 +02:00
2015-05-06 22:34:14 +02:00
var $tooltip = $ ( '<a href="#" rel="tooltip" title="Another tooltip"/>' )
2014-07-07 07:12:26 +02:00
. appendTo ( '#qunit-fixture' )
2017-12-16 13:00:38 +01:00
. bootstrapTooltip ( {
delay : {
show : 0 ,
hide : 150
}
} )
2014-07-07 07:12:26 +02:00
setTimeout ( function ( ) {
2016-10-28 00:13:17 +02:00
assert . ok ( $ ( $tooltip . data ( 'bs.tooltip' ) . tip ) . is ( '.fade.show' ) , '1ms: tooltip faded active' )
2014-07-07 07:12:26 +02:00
$tooltip . trigger ( 'mouseout' )
setTimeout ( function ( ) {
2016-10-28 00:13:17 +02:00
assert . ok ( $ ( $tooltip . data ( 'bs.tooltip' ) . tip ) . is ( '.fade.show' ) , '100ms: tooltip still faded active' )
2014-10-27 23:53:41 +01:00
} , 100 )
2014-07-07 07:12:26 +02:00
setTimeout ( function ( ) {
2016-10-28 00:13:17 +02:00
assert . ok ( ! $ ( $tooltip . data ( 'bs.tooltip' ) . tip ) . is ( '.show' ) , '200ms: tooltip removed' )
2015-05-06 22:34:14 +02:00
done ( )
2014-10-27 23:53:41 +01:00
} , 200 )
2014-07-07 07:12:26 +02:00
} , 0 )
$tooltip . trigger ( 'mouseenter' )
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should not reload the tooltip on subsequent mouseenter events' , function ( assert ) {
assert . expect ( 1 )
2014-08-04 22:03:11 +02:00
var titleHtml = function ( ) {
2015-05-12 08:32:37 +02:00
var uid = Util . getUID ( 'tooltip' )
2014-08-04 22:03:11 +02:00
return '<p id="tt-content">' + uid + '</p><p>' + uid + '</p><p>' + uid + '</p>'
}
2015-05-12 23:28:11 +02:00
var $tooltip = $ ( '<span id="tt-outer" rel="tooltip" data-trigger="hover" data-placement="top">some text</span>' )
2014-08-04 22:03:11 +02:00
. appendTo ( '#qunit-fixture' )
$tooltip . bootstrapTooltip ( {
html : true ,
animation : false ,
trigger : 'hover' ,
2017-12-16 13:00:38 +01:00
delay : {
show : 0 ,
hide : 500
} ,
2014-08-04 22:03:11 +02:00
container : $tooltip ,
title : titleHtml
} )
$ ( '#tt-outer' ) . trigger ( 'mouseenter' )
var currentUid = $ ( '#tt-content' ) . text ( )
$ ( '#tt-content' ) . trigger ( 'mouseenter' )
2015-05-06 22:34:14 +02:00
assert . strictEqual ( currentUid , $ ( '#tt-content' ) . text ( ) )
2014-08-04 22:03:11 +02:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should not reload the tooltip if the mouse leaves and re-enters before hiding' , function ( assert ) {
assert . expect ( 4 )
2015-05-12 08:32:37 +02:00
2014-08-04 22:03:11 +02:00
var titleHtml = function ( ) {
2015-05-12 08:32:37 +02:00
var uid = Util . getUID ( 'tooltip' )
2014-08-04 22:03:11 +02:00
return '<p id="tt-content">' + uid + '</p><p>' + uid + '</p><p>' + uid + '</p>'
}
2015-05-12 23:28:11 +02:00
var $tooltip = $ ( '<span id="tt-outer" rel="tooltip" data-trigger="hover" data-placement="top">some text</span>' )
2014-08-04 22:03:11 +02:00
. appendTo ( '#qunit-fixture' )
$tooltip . bootstrapTooltip ( {
html : true ,
animation : false ,
trigger : 'hover' ,
2017-12-16 13:00:38 +01:00
delay : {
show : 0 ,
hide : 500
} ,
2014-08-04 22:03:11 +02:00
title : titleHtml
} )
var obj = $tooltip . data ( 'bs.tooltip' )
$ ( '#tt-outer' ) . trigger ( 'mouseenter' )
var currentUid = $ ( '#tt-content' ) . text ( )
$ ( '#tt-outer' ) . trigger ( 'mouseleave' )
2015-05-06 22:34:14 +02:00
assert . strictEqual ( currentUid , $ ( '#tt-content' ) . text ( ) )
2015-01-03 22:58:44 +01:00
2016-11-21 15:36:00 +01:00
assert . ok ( obj . _hoverState === 'out' , 'the tooltip hoverState should be set to "out"' )
2014-08-04 22:03:11 +02:00
2015-05-12 08:32:37 +02:00
$ ( '#tt-outer' ) . trigger ( 'mouseenter' )
2016-10-28 00:13:17 +02:00
assert . ok ( obj . _hoverState === 'show' , 'the tooltip hoverState should be set to "show"' )
2014-08-04 22:03:11 +02:00
2015-05-06 22:34:14 +02:00
assert . strictEqual ( currentUid , $ ( '#tt-content' ) . text ( ) )
2014-08-04 22:03:11 +02:00
} )
2015-05-06 22:34:14 +02:00
QUnit . test ( 'should do nothing when an attempt is made to hide an uninitialized tooltip' , function ( assert ) {
2014-12-17 01:40:54 +01:00
assert . expect ( 1 )
2015-05-06 22:34:14 +02:00
var $tooltip = $ ( '<span data-toggle="tooltip" title="some tip">some text</span>' )
. appendTo ( '#qunit-fixture' )
. on ( 'hidden.bs.tooltip shown.bs.tooltip' , function ( ) {
assert . ok ( false , 'should not fire any tooltip events' )
} )
. bootstrapTooltip ( 'hide' )
2017-07-27 12:39:55 +02:00
assert . strictEqual ( typeof $tooltip . data ( 'bs.tooltip' ) , 'undefined' , 'should not initialize the tooltip' )
2015-05-06 22:34:14 +02:00
} )
QUnit . test ( 'should not remove tooltip if multiple triggers are set and one is still active' , function ( assert ) {
assert . expect ( 41 )
var $el = $ ( '<button>Trigger</button>' )
. appendTo ( '#qunit-fixture' )
2017-12-16 13:00:38 +01:00
. bootstrapTooltip ( {
trigger : 'click hover focus' ,
animation : false
} )
2015-05-06 22:34:14 +02:00
var tooltip = $el . data ( 'bs.tooltip' )
2015-05-12 08:32:37 +02:00
var $tooltip = $ ( tooltip . getTipElement ( ) )
2015-05-06 22:34:14 +02:00
2017-12-16 13:00:38 +01:00
function showingTooltip ( ) {
return $tooltip . hasClass ( 'show' ) || tooltip . _hoverState === 'show'
}
2015-05-06 22:34:14 +02:00
var tests = [
2017-12-16 13:00:38 +01:00
[ 'mouseenter' , 'mouseleave' ] ,
2014-12-17 01:40:54 +01:00
2017-12-16 13:00:38 +01:00
[ 'focusin' , 'focusout' ] ,
2015-05-06 22:34:14 +02:00
2017-12-16 13:00:38 +01:00
[ 'click' , 'click' ] ,
2015-05-06 22:34:14 +02:00
2017-12-16 13:00:38 +01:00
[ 'mouseenter' , 'focusin' , 'focusout' , 'mouseleave' ] ,
[ 'mouseenter' , 'focusin' , 'mouseleave' , 'focusout' ] ,
2015-05-06 22:34:14 +02:00
2017-12-16 13:00:38 +01:00
[ 'focusin' , 'mouseenter' , 'mouseleave' , 'focusout' ] ,
[ 'focusin' , 'mouseenter' , 'focusout' , 'mouseleave' ] ,
2015-05-06 22:34:14 +02:00
2017-12-16 13:00:38 +01:00
[ 'click' , 'focusin' , 'mouseenter' , 'focusout' , 'mouseleave' , 'click' ] ,
[ 'mouseenter' , 'click' , 'focusin' , 'focusout' , 'mouseleave' , 'click' ] ,
[ 'mouseenter' , 'focusin' , 'click' , 'click' , 'mouseleave' , 'focusout' ]
2015-05-06 22:34:14 +02:00
]
assert . ok ( ! showingTooltip ( ) )
$ . each ( tests , function ( idx , triggers ) {
for ( var i = 0 , len = triggers . length ; i < len ; i ++ ) {
2016-11-21 15:36:00 +01:00
$el . trigger ( triggers [ i ] )
2020-05-08 15:36:20 +02:00
assert . strictEqual ( i < len - 1 , showingTooltip ( ) )
2015-05-06 22:34:14 +02:00
}
} )
2014-12-17 01:40:54 +01:00
} )
2016-12-27 01:21:27 +01:00
QUnit . test ( 'should show on first trigger after hide' , function ( assert ) {
assert . expect ( 3 )
var $el = $ ( '<a href="#" rel="tooltip" title="Test tooltip"/>' )
. appendTo ( '#qunit-fixture' )
2017-12-16 13:00:38 +01:00
. bootstrapTooltip ( {
trigger : 'click hover focus' ,
animation : false
} )
2016-12-27 01:21:27 +01:00
var tooltip = $el . data ( 'bs.tooltip' )
var $tooltip = $ ( tooltip . getTipElement ( ) )
2017-12-16 13:00:38 +01:00
function showingTooltip ( ) {
return $tooltip . hasClass ( 'show' ) || tooltip . _hoverState === 'show'
}
2016-12-27 01:21:27 +01:00
$el . trigger ( 'click' )
assert . ok ( showingTooltip ( ) , 'tooltip is faded in' )
$el . bootstrapTooltip ( 'hide' )
assert . ok ( ! showingTooltip ( ) , 'tooltip was faded out' )
$el . trigger ( 'click' )
assert . ok ( showingTooltip ( ) , 'tooltip is faded in again' )
} )
2016-12-29 10:40:32 +01:00
QUnit . test ( 'should hide tooltip when their containing modal is closed' , function ( assert ) {
assert . expect ( 1 )
var done = assert . async ( )
var templateHTML = '<div id="modal-test" class="modal">' +
'<div class="modal-dialog" role="document">' +
'<div class="modal-content">' +
'<div class="modal-body">' +
'<a id="tooltipTest" href="#" data-toggle="tooltip" title="Some tooltip text!">Tooltip</a>' +
'</div>' +
'</div>' +
'</div>' +
'</div>'
$ ( templateHTML ) . appendTo ( '#qunit-fixture' )
$ ( '#tooltipTest' )
2017-12-16 13:00:38 +01:00
. bootstrapTooltip ( {
trigger : 'manuel'
} )
2016-12-29 10:40:32 +01:00
. on ( 'shown.bs.tooltip' , function ( ) {
$ ( '#modal-test' ) . modal ( 'hide' )
} )
. on ( 'hide.bs.tooltip' , function ( ) {
assert . ok ( true , 'tooltip hide' )
done ( )
} )
$ ( '#modal-test' )
. on ( 'shown.bs.modal' , function ( ) {
$ ( '#tooltipTest' ) . bootstrapTooltip ( 'show' )
} )
. modal ( 'show' )
} )
2017-03-28 15:55:03 +02:00
2018-11-02 10:24:35 +01:00
QUnit . test ( 'should allow to close modal if the tooltip element is detached' , function ( assert ) {
assert . expect ( 1 )
var done = assert . async ( )
var templateHTML = [
'<div id="modal-test" class="modal">' ,
' <div class="modal-dialog" role="document">' ,
' <div class="modal-content">' ,
' <div class="modal-body">' ,
' <a id="tooltipTest" href="#" data-toggle="tooltip" title="Some tooltip text!">Tooltip</a>' ,
' </div>' ,
' </div>' ,
' </div>' ,
'</div>'
] . join ( '' )
$ ( templateHTML ) . appendTo ( '#qunit-fixture' )
var $tooltip = $ ( '#tooltipTest' )
var $modal = $ ( '#modal-test' )
$tooltip . on ( 'shown.bs.tooltip' , function ( ) {
$tooltip . detach ( )
$tooltip . bootstrapTooltip ( 'dispose' )
$modal . modal ( 'hide' )
} )
$modal . on ( 'shown.bs.modal' , function ( ) {
$tooltip . bootstrapTooltip ( {
trigger : 'manuel'
} )
. bootstrapTooltip ( 'show' )
} )
. on ( 'hidden.bs.modal' , function ( ) {
assert . ok ( true , 'modal hidden' )
done ( )
} )
. modal ( 'show' )
} )
2017-03-28 15:55:03 +02:00
QUnit . test ( 'should reset tip classes when hidden event triggered' , function ( assert ) {
assert . expect ( 2 )
var done = assert . async ( )
var $el = $ ( '<a href="#" rel="tooltip" title="Test tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( 'show' )
. on ( 'hidden.bs.tooltip' , function ( ) {
var tooltip = $el . data ( 'bs.tooltip' )
var $tooltip = $ ( tooltip . getTipElement ( ) )
assert . ok ( $tooltip . hasClass ( 'tooltip' ) )
assert . ok ( $tooltip . hasClass ( 'fade' ) )
done ( )
} )
$el . bootstrapTooltip ( 'hide' )
} )
2017-03-31 10:03:54 +02:00
QUnit . test ( 'should convert number in title to string' , function ( assert ) {
assert . expect ( 1 )
var done = assert . async ( )
var $el = $ ( '<a href="#" rel="tooltip" title="7"/>' )
. appendTo ( '#qunit-fixture' )
. on ( 'shown.bs.tooltip' , function ( ) {
var tooltip = $el . data ( 'bs.tooltip' )
var $tooltip = $ ( tooltip . getTipElement ( ) )
assert . strictEqual ( $tooltip . children ( ) . text ( ) , '7' )
done ( )
} )
$el . bootstrapTooltip ( 'show' )
} )
2017-08-24 09:40:11 +02:00
QUnit . test ( 'tooltip should be shown right away after the call of disable/enable' , function ( assert ) {
assert . expect ( 2 )
var done = assert . async ( )
var $trigger = $ ( '<a href="#" rel="tooltip" data-trigger="click" title="Another tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( )
. on ( 'shown.bs.tooltip' , function ( ) {
assert . strictEqual ( $ ( '.tooltip' ) . hasClass ( 'show' ) , true )
done ( )
} )
$trigger . bootstrapTooltip ( 'disable' )
$trigger . trigger ( $ . Event ( 'click' ) )
setTimeout ( function ( ) {
assert . strictEqual ( $ ( '.tooltip' ) . length === 0 , true )
$trigger . bootstrapTooltip ( 'enable' )
$trigger . trigger ( $ . Event ( 'click' ) )
} , 200 )
} )
2018-04-10 09:28:29 +02:00
QUnit . test ( 'should call Popper.js to update' , function ( assert ) {
assert . expect ( 2 )
var $tooltip = $ ( '<a href="#" rel="tooltip" data-trigger="click" title="Another tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( )
var tooltip = $tooltip . data ( 'bs.tooltip' )
tooltip . show ( )
assert . ok ( tooltip . _popper )
var spyPopper = sinon . spy ( tooltip . _popper , 'scheduleUpdate' )
tooltip . update ( )
assert . ok ( spyPopper . called )
} )
QUnit . test ( 'should not call Popper.js to update' , function ( assert ) {
assert . expect ( 1 )
var $tooltip = $ ( '<a href="#" rel="tooltip" data-trigger="click" title="Another tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( )
var tooltip = $tooltip . data ( 'bs.tooltip' )
tooltip . update ( )
assert . ok ( tooltip . _popper === null )
} )
2018-04-30 10:49:43 +02:00
QUnit . test ( 'should use Popper.js to get the tip on placement change' , function ( assert ) {
assert . expect ( 1 )
var $tooltip = $ ( '<a href="#" rel="tooltip" data-trigger="click" title="Another tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( )
var $tipTest = $ ( '<div class="bs-tooltip" />' )
. appendTo ( '#qunit-fixture' )
var tooltip = $tooltip . data ( 'bs.tooltip' )
tooltip . tip = null
tooltip . _handlePopperPlacementChange ( {
instance : {
popper : $tipTest [ 0 ]
} ,
placement : 'auto'
} )
assert . ok ( tooltip . tip === $tipTest [ 0 ] )
} )
2018-11-02 10:24:35 +01:00
QUnit . test ( 'should toggle enabled' , function ( assert ) {
assert . expect ( 3 )
var $tooltip = $ ( '<a href="#" rel="tooltip" data-trigger="click" title="Another tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( )
var tooltip = $tooltip . data ( 'bs.tooltip' )
assert . strictEqual ( tooltip . _isEnabled , true )
tooltip . toggleEnabled ( )
assert . strictEqual ( tooltip . _isEnabled , false )
tooltip . toggleEnabled ( )
assert . strictEqual ( tooltip . _isEnabled , true )
} )
2019-01-28 21:55:21 +01:00
QUnit . test ( 'should create offset modifier correctly when offset option is a function' , function ( assert ) {
assert . expect ( 2 )
var getOffset = function ( offsets ) {
return offsets
}
var $trigger = $ ( '<a href="#" rel="tooltip" data-trigger="click" title="Another tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( {
offset : getOffset
} )
var tooltip = $trigger . data ( 'bs.tooltip' )
var offset = tooltip . _getOffset ( )
assert . ok ( typeof offset . offset === 'undefined' )
assert . ok ( typeof offset . fn === 'function' )
} )
QUnit . test ( 'should create offset modifier correctly when offset option is not a function' , function ( assert ) {
assert . expect ( 2 )
var myOffset = 42
var $trigger = $ ( '<a href="#" rel="tooltip" data-trigger="click" title="Another tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( {
offset : myOffset
} )
var tooltip = $trigger . data ( 'bs.tooltip' )
var offset = tooltip . _getOffset ( )
assert . strictEqual ( offset . offset , myOffset )
assert . ok ( typeof offset . fn === 'undefined' )
} )
2019-02-11 15:59:39 +01:00
QUnit . test ( 'should disable sanitizer' , function ( assert ) {
assert . expect ( 1 )
var $trigger = $ ( '<a href="#" rel="tooltip" data-trigger="click" title="Another tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( {
sanitize : false
} )
var tooltip = $trigger . data ( 'bs.tooltip' )
assert . strictEqual ( tooltip . config . sanitize , false )
} )
QUnit . test ( 'should sanitize template by removing disallowed tags' , function ( assert ) {
assert . expect ( 1 )
var $trigger = $ ( '<a href="#" rel="tooltip" data-trigger="click" title="Another tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( {
template : [
'<div>' ,
' <script>console.log("oups script inserted")</script>' ,
' <span>Some content</span>' ,
'</div>'
] . join ( '' )
} )
var tooltip = $trigger . data ( 'bs.tooltip' )
assert . strictEqual ( tooltip . config . template . indexOf ( 'script' ) , - 1 )
} )
QUnit . test ( 'should sanitize template by removing disallowed attributes' , function ( assert ) {
assert . expect ( 1 )
var $trigger = $ ( '<a href="#" rel="tooltip" data-trigger="click" title="Another tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( {
template : [
'<div>' ,
' <img src="x" onError="alert(\'test\')">Some content</img>' ,
'</div>'
] . join ( '' )
} )
var tooltip = $trigger . data ( 'bs.tooltip' )
assert . strictEqual ( tooltip . config . template . indexOf ( 'onError' ) , - 1 )
} )
QUnit . test ( 'should sanitize template by removing tags with XSS' , function ( assert ) {
assert . expect ( 1 )
var $trigger = $ ( '<a href="#" rel="tooltip" data-trigger="click" title="Another tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( {
template : [
'<div>' ,
' <a href="javascript:alert(7)">Click me</a>' ,
' <span>Some content</span>' ,
'</div>'
] . join ( '' )
} )
var tooltip = $trigger . data ( 'bs.tooltip' )
2020-11-02 14:02:16 +01:00
assert . strictEqual ( tooltip . config . template . indexOf ( 'href="javascript:alert(7)"' ) , - 1 )
2019-02-11 15:59:39 +01:00
} )
QUnit . test ( 'should allow custom sanitization rules' , function ( assert ) {
assert . expect ( 2 )
var $trigger = $ ( '<a href="#" rel="tooltip" data-trigger="click" title="Another tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( {
template : [
'<a href="javascript:alert(7)">Click me</a>' ,
'<span>Some content</span>'
] . join ( '' ) ,
whiteList : {
span : null
}
} )
var tooltip = $trigger . data ( 'bs.tooltip' )
assert . strictEqual ( tooltip . config . template . indexOf ( '<a' ) , - 1 )
assert . ok ( tooltip . config . template . indexOf ( 'span' ) !== - 1 )
} )
QUnit . test ( 'should allow passing a custom function for sanitization' , function ( assert ) {
assert . expect ( 1 )
var $trigger = $ ( '<a href="#" rel="tooltip" data-trigger="click" title="Another tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( {
template : [
'<span>Some content</span>'
] . join ( '' ) ,
sanitizeFn : function ( input ) {
return input
}
} )
var tooltip = $trigger . data ( 'bs.tooltip' )
assert . ok ( tooltip . config . template . indexOf ( 'span' ) !== - 1 )
} )
QUnit . test ( 'should allow passing aria attributes' , function ( assert ) {
assert . expect ( 1 )
var $trigger = $ ( '<a href="#" rel="tooltip" data-trigger="click" title="Another tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( {
template : [
'<span aria-pressed="true">Some content</span>'
] . join ( '' )
} )
var tooltip = $trigger . data ( 'bs.tooltip' )
assert . ok ( tooltip . config . template . indexOf ( 'aria-pressed' ) !== - 1 )
} )
QUnit . test ( 'should not sanitize element content' , function ( assert ) {
assert . expect ( 1 )
var $element = $ ( '<div />' ) . appendTo ( '#qunit-fixture' )
var content = '<script>var test = 1;</script>'
var $trigger = $ ( '<a href="#" rel="tooltip" data-trigger="click" title="Another tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( {
template : [
'<span aria-pressed="true">Some content</span>'
] . join ( '' ) ,
html : true ,
sanitize : false
} )
var tooltip = $trigger . data ( 'bs.tooltip' )
tooltip . setElementContent ( $element , content )
assert . strictEqual ( $element [ 0 ] . innerHTML , content )
} )
QUnit . test ( 'should not take into account sanitize in data attributes' , function ( assert ) {
assert . expect ( 1 )
var $trigger = $ ( '<a href="#" rel="tooltip" data-sanitize="false" data-trigger="click" title="Another tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( {
template : [
'<span aria-pressed="true">Some content</span>'
] . join ( '' )
} )
var tooltip = $trigger . data ( 'bs.tooltip' )
assert . strictEqual ( tooltip . config . sanitize , true )
} )
2019-08-18 21:15:21 +02:00
QUnit . test ( 'should allow to pass config to popper.js with `popperConfig`' , function ( assert ) {
assert . expect ( 1 )
var $trigger = $ ( '<a href="#" rel="tooltip" data-trigger="click" title="Another tooltip"/>' )
. appendTo ( '#qunit-fixture' )
. bootstrapTooltip ( {
popperConfig : {
placement : 'left'
}
} )
var tooltip = $trigger . data ( 'bs.tooltip' )
var popperConfig = tooltip . _getPopperConfig ( 'top' )
assert . strictEqual ( popperConfig . placement , 'left' )
} )
2012-12-20 10:36:57 +01:00
} )