2011-09-10 22:17:08 +02:00
|
|
|
$(function () {
|
2014-03-17 08:12:55 +01:00
|
|
|
'use strict';
|
2011-09-10 22:17:08 +02:00
|
|
|
|
2015-02-24 07:04:48 +01:00
|
|
|
QUnit.module('popover plugin')
|
2014-02-13 08:55:12 +01:00
|
|
|
|
2015-02-24 07:04:48 +01:00
|
|
|
QUnit.test('should be defined on jquery object', function (assert) {
|
2015-03-01 15:33:48 +01:00
|
|
|
assert.expect(1)
|
2015-02-24 06:55:07 +01:00
|
|
|
assert.ok($(document.body).popover, 'popover method is defined')
|
2014-02-13 08:55:12 +01:00
|
|
|
})
|
|
|
|
|
2015-02-24 07:04:48 +01:00
|
|
|
QUnit.module('popover', {
|
2015-02-26 08:20:42 +01:00
|
|
|
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.bootstrapPopover = $.fn.popover.noConflict()
|
|
|
|
},
|
2015-02-26 08:20:42 +01:00
|
|
|
afterEach: function () {
|
2014-04-22 07:03:33 +02:00
|
|
|
$.fn.popover = $.fn.bootstrapPopover
|
|
|
|
delete $.fn.bootstrapPopover
|
|
|
|
}
|
|
|
|
})
|
|
|
|
|
2015-02-24 07:04:48 +01:00
|
|
|
QUnit.test('should provide no conflict', function (assert) {
|
2015-03-01 15:33:48 +01:00
|
|
|
assert.expect(1)
|
2015-02-24 06:55:07 +01:00
|
|
|
assert.strictEqual($.fn.popover, undefined, 'popover was set back to undefined (org value)')
|
2014-04-22 07:03:33 +02:00
|
|
|
})
|
|
|
|
|
2015-02-24 07:04:48 +01:00
|
|
|
QUnit.test('should return jquery collection containing the element', function (assert) {
|
2015-03-01 15:33:48 +01:00
|
|
|
assert.expect(2)
|
2014-06-18 21:34:31 +02:00
|
|
|
var $el = $('<div/>')
|
|
|
|
var $popover = $el.bootstrapPopover()
|
2015-02-24 06:55:07 +01:00
|
|
|
assert.ok($popover instanceof $, 'returns jquery collection')
|
|
|
|
assert.strictEqual($popover[0], $el[0], 'collection contains element')
|
2014-02-13 08:55:12 +01:00
|
|
|
})
|
|
|
|
|
2015-02-24 07:04:48 +01:00
|
|
|
QUnit.test('should render popover element', function (assert) {
|
2015-03-01 15:33:48 +01:00
|
|
|
assert.expect(2)
|
2014-10-07 14:28:41 +02:00
|
|
|
var $popover = $('<a href="#" title="mdo" data-content="https://twitter.com/mdo">@mdo</a>')
|
2014-02-13 08:55:12 +01:00
|
|
|
.appendTo('#qunit-fixture')
|
2014-04-22 07:03:33 +02:00
|
|
|
.bootstrapPopover('show')
|
2014-02-13 08:55:12 +01:00
|
|
|
|
2015-02-24 06:55:07 +01:00
|
|
|
assert.notEqual($('.popover').length, 0, 'popover was inserted')
|
2014-06-18 21:34:31 +02:00
|
|
|
$popover.bootstrapPopover('hide')
|
2015-02-24 07:41:08 +01:00
|
|
|
assert.strictEqual($('.popover').length, 0, 'popover removed')
|
2014-02-13 08:55:12 +01:00
|
|
|
})
|
|
|
|
|
2015-02-24 07:04:48 +01:00
|
|
|
QUnit.test('should store popover instance in popover data object', function (assert) {
|
2015-03-01 15:33:48 +01:00
|
|
|
assert.expect(1)
|
2014-10-07 14:28:41 +02:00
|
|
|
var $popover = $('<a href="#" title="mdo" data-content="https://twitter.com/mdo">@mdo</a>').bootstrapPopover()
|
2014-02-13 08:55:12 +01:00
|
|
|
|
2015-02-24 06:55:07 +01:00
|
|
|
assert.ok($popover.data('bs.popover'), 'popover instance exists')
|
2014-02-13 08:55:12 +01:00
|
|
|
})
|
|
|
|
|
2015-02-24 07:04:48 +01:00
|
|
|
QUnit.test('should store popover trigger in popover instance data object', function (assert) {
|
2015-03-01 15:33:48 +01:00
|
|
|
assert.expect(1)
|
2014-06-18 21:34:31 +02:00
|
|
|
var $popover = $('<a href="#" title="ResentedHook">@ResentedHook</a>')
|
2014-05-14 19:36:32 +02:00
|
|
|
.appendTo('#qunit-fixture')
|
|
|
|
.bootstrapPopover()
|
2014-06-18 21:34:31 +02:00
|
|
|
|
|
|
|
$popover.bootstrapPopover('show')
|
|
|
|
|
2015-02-24 06:55:07 +01:00
|
|
|
assert.ok($('.popover').data('bs.popover'), 'popover trigger stored in instance data')
|
2014-05-14 19:36:32 +02:00
|
|
|
})
|
|
|
|
|
2015-02-24 07:04:48 +01:00
|
|
|
QUnit.test('should get title and content from options', function (assert) {
|
2015-03-01 15:33:48 +01:00
|
|
|
assert.expect(4)
|
2014-06-18 21:34:31 +02:00
|
|
|
var $popover = $('<a href="#">@fat</a>')
|
2014-02-13 08:55:12 +01:00
|
|
|
.appendTo('#qunit-fixture')
|
2014-04-22 07:03:33 +02:00
|
|
|
.bootstrapPopover({
|
2014-02-13 08:55:12 +01:00
|
|
|
title: function () {
|
|
|
|
return '@fat'
|
|
|
|
},
|
|
|
|
content: function () {
|
|
|
|
return 'loves writing tests (╯°□°)╯︵ ┻━┻'
|
|
|
|
}
|
2012-12-07 23:06:01 +01:00
|
|
|
})
|
|
|
|
|
2014-06-18 21:34:31 +02:00
|
|
|
$popover.bootstrapPopover('show')
|
2014-02-13 08:55:12 +01:00
|
|
|
|
2015-02-24 06:55:07 +01:00
|
|
|
assert.notEqual($('.popover').length, 0, 'popover was inserted')
|
2015-02-24 07:41:08 +01:00
|
|
|
assert.strictEqual($('.popover .popover-title').text(), '@fat', 'title correctly inserted')
|
|
|
|
assert.strictEqual($('.popover .popover-content').text(), 'loves writing tests (╯°□°)╯︵ ┻━┻', 'content correctly inserted')
|
2014-02-13 08:55:12 +01:00
|
|
|
|
2014-06-18 21:34:31 +02:00
|
|
|
$popover.bootstrapPopover('hide')
|
2015-02-24 07:41:08 +01:00
|
|
|
assert.strictEqual($('.popover').length, 0, 'popover was removed')
|
2014-03-24 18:49:06 +01:00
|
|
|
})
|
|
|
|
|
2015-02-24 07:04:48 +01:00
|
|
|
QUnit.test('should not duplicate HTML object', function (assert) {
|
2015-03-01 15:33:48 +01:00
|
|
|
assert.expect(6)
|
2014-06-18 21:34:31 +02:00
|
|
|
var $div = $('<div/>').html('loves writing tests (╯°□°)╯︵ ┻━┻')
|
2014-03-24 18:49:06 +01:00
|
|
|
|
2014-06-18 21:34:31 +02:00
|
|
|
var $popover = $('<a href="#">@fat</a>')
|
2014-03-24 18:49:06 +01:00
|
|
|
.appendTo('#qunit-fixture')
|
2014-04-22 07:03:33 +02:00
|
|
|
.bootstrapPopover({
|
2014-03-24 18:49:06 +01:00
|
|
|
content: function () {
|
|
|
|
return $div
|
|
|
|
}
|
|
|
|
})
|
|
|
|
|
2014-06-18 21:34:31 +02:00
|
|
|
$popover.bootstrapPopover('show')
|
2015-02-24 06:55:07 +01:00
|
|
|
assert.notEqual($('.popover').length, 0, 'popover was inserted')
|
|
|
|
assert.equal($('.popover .popover-content').html(), $div, 'content correctly inserted')
|
2014-03-24 18:49:06 +01:00
|
|
|
|
2014-06-18 21:34:31 +02:00
|
|
|
$popover.bootstrapPopover('hide')
|
2015-02-24 07:41:08 +01:00
|
|
|
assert.strictEqual($('.popover').length, 0, 'popover was removed')
|
2014-03-24 18:49:06 +01:00
|
|
|
|
2014-06-18 21:34:31 +02:00
|
|
|
$popover.bootstrapPopover('show')
|
2015-02-24 06:55:07 +01:00
|
|
|
assert.notEqual($('.popover').length, 0, 'popover was inserted')
|
|
|
|
assert.equal($('.popover .popover-content').html(), $div, 'content correctly inserted')
|
2014-03-24 18:49:06 +01:00
|
|
|
|
2014-06-18 21:34:31 +02:00
|
|
|
$popover.bootstrapPopover('hide')
|
2015-02-24 07:41:08 +01:00
|
|
|
assert.strictEqual($('.popover').length, 0, 'popover was removed')
|
2014-02-13 08:55:12 +01:00
|
|
|
})
|
|
|
|
|
2015-02-24 07:04:48 +01:00
|
|
|
QUnit.test('should get title and content from attributes', function (assert) {
|
2015-03-01 15:33:48 +01:00
|
|
|
assert.expect(4)
|
2014-06-18 21:34:31 +02:00
|
|
|
var $popover = $('<a href="#" title="@mdo" data-content="loves data attributes (づ。◕‿‿◕。)づ ︵ ┻━┻" >@mdo</a>')
|
2014-02-13 08:55:12 +01:00
|
|
|
.appendTo('#qunit-fixture')
|
2014-04-22 07:03:33 +02:00
|
|
|
.bootstrapPopover()
|
|
|
|
.bootstrapPopover('show')
|
2014-02-13 08:55:12 +01:00
|
|
|
|
2015-02-24 06:55:07 +01:00
|
|
|
assert.notEqual($('.popover').length, 0, 'popover was inserted')
|
2015-02-24 07:41:08 +01:00
|
|
|
assert.strictEqual($('.popover .popover-title').text(), '@mdo', 'title correctly inserted')
|
|
|
|
assert.strictEqual($('.popover .popover-content').text(), 'loves data attributes (づ。◕‿‿◕。)づ ︵ ┻━┻', 'content correctly inserted')
|
2014-02-13 08:55:12 +01:00
|
|
|
|
2014-06-18 21:34:31 +02:00
|
|
|
$popover.bootstrapPopover('hide')
|
2015-02-24 07:41:08 +01:00
|
|
|
assert.strictEqual($('.popover').length, 0, 'popover was removed')
|
2014-02-13 08:55:12 +01:00
|
|
|
})
|
|
|
|
|
|
|
|
|
2015-02-24 07:04:48 +01:00
|
|
|
QUnit.test('should get title and content from attributes ignoring options passed via js', function (assert) {
|
2015-03-01 15:33:48 +01:00
|
|
|
assert.expect(4)
|
2014-06-18 21:34:31 +02:00
|
|
|
var $popover = $('<a href="#" title="@mdo" data-content="loves data attributes (づ。◕‿‿◕。)づ ︵ ┻━┻" >@mdo</a>')
|
2014-02-13 08:55:12 +01:00
|
|
|
.appendTo('#qunit-fixture')
|
2014-04-22 07:03:33 +02:00
|
|
|
.bootstrapPopover({
|
2014-02-13 08:55:12 +01:00
|
|
|
title: 'ignored title option',
|
|
|
|
content: 'ignored content option'
|
2011-09-10 22:17:08 +02:00
|
|
|
})
|
2014-04-22 07:03:33 +02:00
|
|
|
.bootstrapPopover('show')
|
2014-02-13 08:55:12 +01:00
|
|
|
|
2015-02-24 06:55:07 +01:00
|
|
|
assert.notEqual($('.popover').length, 0, 'popover was inserted')
|
2015-02-24 07:41:08 +01:00
|
|
|
assert.strictEqual($('.popover .popover-title').text(), '@mdo', 'title correctly inserted')
|
|
|
|
assert.strictEqual($('.popover .popover-content').text(), 'loves data attributes (づ。◕‿‿◕。)づ ︵ ┻━┻', 'content correctly inserted')
|
2014-02-13 08:55:12 +01:00
|
|
|
|
2014-06-18 21:34:31 +02:00
|
|
|
$popover.bootstrapPopover('hide')
|
2015-02-24 07:41:08 +01:00
|
|
|
assert.strictEqual($('.popover').length, 0, 'popover was removed')
|
2014-02-13 08:55:12 +01:00
|
|
|
})
|
|
|
|
|
2015-02-24 07:04:48 +01:00
|
|
|
QUnit.test('should respect custom template', function (assert) {
|
2015-03-01 15:33:48 +01:00
|
|
|
assert.expect(3)
|
2014-06-18 21:34:31 +02:00
|
|
|
var $popover = $('<a href="#">@fat</a>')
|
2014-02-13 08:55:12 +01:00
|
|
|
.appendTo('#qunit-fixture')
|
2014-04-22 07:03:33 +02:00
|
|
|
.bootstrapPopover({
|
2014-02-13 08:55:12 +01:00
|
|
|
title: 'Test',
|
|
|
|
content: 'Test',
|
2014-12-18 03:58:01 +01:00
|
|
|
template: '<div class="popover foobar"><div class="popover-arrow"></div><div class="inner"><h3 class="title"/><div class="content"><p/></div></div></div>'
|
2011-09-10 22:17:08 +02:00
|
|
|
})
|
|
|
|
|
2014-06-18 21:34:31 +02:00
|
|
|
$popover.bootstrapPopover('show')
|
2014-02-13 08:55:12 +01:00
|
|
|
|
2015-02-24 06:55:07 +01:00
|
|
|
assert.notEqual($('.popover').length, 0, 'popover was inserted')
|
|
|
|
assert.ok($('.popover').hasClass('foobar'), 'custom class is present')
|
2014-02-13 08:55:12 +01:00
|
|
|
|
2014-06-18 21:34:31 +02:00
|
|
|
$popover.bootstrapPopover('hide')
|
2015-02-24 07:41:08 +01:00
|
|
|
assert.strictEqual($('.popover').length, 0, 'popover was removed')
|
2014-02-13 08:55:12 +01:00
|
|
|
})
|
|
|
|
|
2015-02-24 07:04:48 +01:00
|
|
|
QUnit.test('should destroy popover', function (assert) {
|
2015-03-01 15:33:48 +01:00
|
|
|
assert.expect(7)
|
2014-06-18 21:34:31 +02:00
|
|
|
var $popover = $('<div/>')
|
|
|
|
.bootstrapPopover({
|
|
|
|
trigger: 'hover'
|
|
|
|
})
|
|
|
|
.on('click.foo', $.noop)
|
|
|
|
|
2015-02-24 06:55:07 +01:00
|
|
|
assert.ok($popover.data('bs.popover'), 'popover has data')
|
|
|
|
assert.ok($._data($popover[0], 'events').mouseover && $._data($popover[0], 'events').mouseout, 'popover has hover event')
|
2015-02-24 07:41:08 +01:00
|
|
|
assert.strictEqual($._data($popover[0], 'events').click[0].namespace, 'foo', 'popover has extra click.foo event')
|
2014-06-18 21:34:31 +02:00
|
|
|
|
|
|
|
$popover.bootstrapPopover('show')
|
|
|
|
$popover.bootstrapPopover('destroy')
|
|
|
|
|
2015-02-24 06:55:07 +01:00
|
|
|
assert.ok(!$popover.hasClass('in'), 'popover is hidden')
|
|
|
|
assert.ok(!$popover.data('popover'), 'popover does not have data')
|
2015-02-24 07:41:08 +01:00
|
|
|
assert.strictEqual($._data($popover[0], 'events').click[0].namespace, 'foo', 'popover still has click.foo')
|
2015-02-24 06:55:07 +01:00
|
|
|
assert.ok(!$._data($popover[0], 'events').mouseover && !$._data($popover[0], 'events').mouseout, 'popover does not have any events')
|
2014-02-13 08:55:12 +01:00
|
|
|
})
|
2012-12-07 23:06:01 +01:00
|
|
|
|
2015-02-24 07:04:48 +01:00
|
|
|
QUnit.test('should render popover element using delegated selector', function (assert) {
|
2015-03-01 15:33:48 +01:00
|
|
|
assert.expect(2)
|
2014-07-18 20:37:11 +02:00
|
|
|
var $div = $('<div><a href="#" title="mdo" data-content="http://twitter.com/mdo">@mdo</a></div>')
|
|
|
|
.appendTo('#qunit-fixture')
|
|
|
|
.bootstrapPopover({
|
|
|
|
selector: 'a',
|
|
|
|
trigger: 'click'
|
|
|
|
})
|
|
|
|
|
2015-03-06 13:34:28 +01:00
|
|
|
$div.find('a').trigger('click')
|
2015-02-24 06:55:07 +01:00
|
|
|
assert.notEqual($('.popover').length, 0, 'popover was inserted')
|
2014-07-18 20:37:11 +02:00
|
|
|
|
2015-03-06 13:34:28 +01:00
|
|
|
$div.find('a').trigger('click')
|
2015-02-24 07:41:08 +01:00
|
|
|
assert.strictEqual($('.popover').length, 0, 'popover was removed')
|
2014-07-18 20:37:11 +02:00
|
|
|
})
|
|
|
|
|
2015-02-24 07:04:48 +01:00
|
|
|
QUnit.test('should detach popover content rather than removing it so that event handlers are left intact', function (assert) {
|
2015-03-01 15:33:48 +01:00
|
|
|
assert.expect(1)
|
2014-12-22 23:02:31 +01:00
|
|
|
var $content = $('<div class="content-with-handler"><a class="btn btn-warning">Button with event handler</a></div>').appendTo('#qunit-fixture')
|
2014-07-18 20:37:11 +02:00
|
|
|
|
2014-12-30 03:34:35 +01:00
|
|
|
var handlerCalled = false
|
2015-03-06 13:34:28 +01:00
|
|
|
$('.content-with-handler .btn').on('click', function () {
|
2014-12-22 23:02:31 +01:00
|
|
|
handlerCalled = true
|
2014-12-30 03:34:35 +01:00
|
|
|
})
|
2014-12-22 23:02:31 +01:00
|
|
|
|
|
|
|
var $div = $('<div><a href="#">Show popover</a></div>')
|
2014-07-18 20:37:11 +02:00
|
|
|
.appendTo('#qunit-fixture')
|
|
|
|
.bootstrapPopover({
|
2014-12-22 23:02:31 +01:00
|
|
|
html: true,
|
|
|
|
trigger: 'manual',
|
|
|
|
container: 'body',
|
|
|
|
content: function () {
|
2014-12-30 03:34:35 +01:00
|
|
|
return $content
|
2014-12-22 23:02:31 +01:00
|
|
|
}
|
2014-07-18 20:37:11 +02:00
|
|
|
})
|
|
|
|
|
2015-01-21 04:40:50 +01:00
|
|
|
var done = assert.async()
|
2014-12-22 23:02:31 +01:00
|
|
|
$div
|
|
|
|
.one('shown.bs.popover', function () {
|
|
|
|
$div
|
|
|
|
.one('hidden.bs.popover', function () {
|
|
|
|
$div
|
|
|
|
.one('shown.bs.popover', function () {
|
2015-03-06 13:34:28 +01:00
|
|
|
$('.content-with-handler .btn').trigger('click')
|
2014-12-22 23:02:31 +01:00
|
|
|
$div.bootstrapPopover('destroy')
|
2015-02-24 06:55:07 +01:00
|
|
|
assert.ok(handlerCalled, 'content\'s event handler still present')
|
2015-01-21 04:40:50 +01:00
|
|
|
done()
|
2014-12-22 23:02:31 +01:00
|
|
|
})
|
|
|
|
.bootstrapPopover('show')
|
|
|
|
})
|
|
|
|
.bootstrapPopover('hide')
|
|
|
|
})
|
|
|
|
.bootstrapPopover('show')
|
2014-07-18 20:37:11 +02:00
|
|
|
})
|
2015-01-05 23:22:49 +01:00
|
|
|
|
2015-02-24 07:04:48 +01:00
|
|
|
QUnit.test('should throw an error when initializing popover on the document object without specifying a delegation selector', function (assert) {
|
2015-03-01 15:33:48 +01:00
|
|
|
assert.expect(1)
|
2015-02-24 06:55:07 +01:00
|
|
|
assert.throws(function () {
|
2015-01-05 23:22:49 +01:00
|
|
|
$(document).bootstrapPopover({ title: 'What am I on?', content: 'My selector is missing' })
|
|
|
|
}, new Error('`selector` option must be specified when initializing popover on the window.document object!'))
|
|
|
|
})
|
|
|
|
|
2015-03-03 22:32:24 +01:00
|
|
|
QUnit.test('should do nothing when an attempt is made to hide an uninitialized popover', function (assert) {
|
|
|
|
assert.expect(1)
|
|
|
|
|
|
|
|
var $popover = $('<span data-toggle="popover" data-title="some title" data-content="some content">some text</span>')
|
|
|
|
.appendTo('#qunit-fixture')
|
|
|
|
.on('hidden.bs.popover shown.bs.popover', function () {
|
|
|
|
assert.ok(false, 'should not fire any popover events')
|
|
|
|
})
|
|
|
|
.bootstrapPopover('hide')
|
|
|
|
assert.strictEqual($popover.data('bs.popover'), undefined, 'should not initialize the popover')
|
|
|
|
})
|
|
|
|
|
2013-04-23 09:34:27 +02:00
|
|
|
})
|