diff options
author | Johann-S <johann.servoire@gmail.com> | 2019-05-08 22:32:50 +0300 |
---|---|---|
committer | Johann-S <johann.servoire@gmail.com> | 2019-07-23 15:23:50 +0300 |
commit | c9e650a56f84a1f8526806b6fa9874aa6d258d24 (patch) | |
tree | e9125d29b5c0f98cb5a9d9954f322b2809b93ece | |
parent | 1ac07a66ce56e6ee3d2b48a649e957417f56c83e (diff) |
rewrite popover unit tests
-rw-r--r-- | build/build-plugins.js | 2 | ||||
-rw-r--r-- | js/index.esm.js | 2 | ||||
-rw-r--r-- | js/index.umd.js | 2 | ||||
-rw-r--r-- | js/src/popover/popover.js (renamed from js/src/popover.js) | 10 | ||||
-rw-r--r-- | js/src/popover/popover.spec.js | 251 | ||||
-rw-r--r-- | js/tests/unit/popover.js | 474 |
6 files changed, 259 insertions, 482 deletions
diff --git a/build/build-plugins.js b/build/build-plugins.js index d0d473f666..2995e638e0 100644 --- a/build/build-plugins.js +++ b/build/build-plugins.js @@ -38,7 +38,7 @@ const bsPlugins = { Collapse: path.resolve(__dirname, '../js/src/collapse/collapse.js'), Dropdown: path.resolve(__dirname, '../js/src/dropdown/dropdown.js'), Modal: path.resolve(__dirname, '../js/src/modal/modal.js'), - Popover: path.resolve(__dirname, '../js/src/popover.js'), + Popover: path.resolve(__dirname, '../js/src/popover/popover.js'), ScrollSpy: path.resolve(__dirname, '../js/src/scrollspy.js'), Tab: path.resolve(__dirname, '../js/src/tab.js'), Toast: path.resolve(__dirname, '../js/src/toast/toast.js'), diff --git a/js/index.esm.js b/js/index.esm.js index c2912d1910..0f48d63b4e 100644 --- a/js/index.esm.js +++ b/js/index.esm.js @@ -11,7 +11,7 @@ import Carousel from './src/carousel/carousel' import Collapse from './src/collapse/collapse' import Dropdown from './src/dropdown/dropdown' import Modal from './src/modal/modal' -import Popover from './src/popover' +import Popover from './src/popover/popover' import ScrollSpy from './src/scrollspy' import Tab from './src/tab' import Toast from './src/toast/toast' diff --git a/js/index.umd.js b/js/index.umd.js index eafc90141d..03b58715ef 100644 --- a/js/index.umd.js +++ b/js/index.umd.js @@ -11,7 +11,7 @@ import Carousel from './src/carousel/carousel' import Collapse from './src/collapse/collapse' import Dropdown from './src/dropdown/dropdown' import Modal from './src/modal/modal' -import Popover from './src/popover' +import Popover from './src/popover/popover' import ScrollSpy from './src/scrollspy' import Tab from './src/tab' import Toast from './src/toast/toast' diff --git a/js/src/popover.js b/js/src/popover/popover.js index 3cb5549df0..3a55083c43 100644 --- a/js/src/popover.js +++ b/js/src/popover/popover.js @@ -5,10 +5,10 @@ * -------------------------------------------------------------------------- */ -import { jQuery as $ } from './util/index' -import Data from './dom/data' -import SelectorEngine from './dom/selector-engine' -import Tooltip from './tooltip' +import { jQuery as $ } from '../util/index' +import Data from '../dom/data' +import SelectorEngine from '../dom/selector-engine' +import Tooltip from '../tooltip' /** * ------------------------------------------------------------------------ @@ -178,7 +178,7 @@ class Popover extends Tooltip { * jQuery * ------------------------------------------------------------------------ */ - +/* istanbul ignore if */ if (typeof $ !== 'undefined') { const JQUERY_NO_CONFLICT = $.fn[NAME] $.fn[NAME] = Popover._jQueryInterface diff --git a/js/src/popover/popover.spec.js b/js/src/popover/popover.spec.js new file mode 100644 index 0000000000..cb16bf271a --- /dev/null +++ b/js/src/popover/popover.spec.js @@ -0,0 +1,251 @@ +import Popover from './popover' +import { makeArray } from '../util/index' + +/** Test helpers */ +import { getFixture, clearFixture, jQueryMock } from '../../tests/helpers/fixture' + +describe('Popover', () => { + let fixtureEl + + beforeAll(() => { + fixtureEl = getFixture() + }) + + afterEach(() => { + clearFixture() + + const popoverList = makeArray(document.querySelectorAll('.popover')) + + popoverList.forEach(backdrop => { + document.body.removeChild(backdrop) + }) + }) + + describe('VERSION', () => { + it('should return plugin version', () => { + expect(Popover.VERSION).toEqual(jasmine.any(String)) + }) + }) + + describe('Default', () => { + it('should return plugin default config', () => { + expect(Popover.Default).toEqual(jasmine.any(Object)) + }) + }) + + describe('NAME', () => { + it('should return plugin name', () => { + expect(Popover.NAME).toEqual(jasmine.any(String)) + }) + }) + + describe('DATA_KEY', () => { + it('should return plugin data key', () => { + expect(Popover.DATA_KEY).toEqual('bs.popover') + }) + }) + + describe('Event', () => { + it('should return plugin events', () => { + expect(Popover.Event).toEqual(jasmine.any(Object)) + }) + }) + + describe('EVENT_KEY', () => { + it('should return plugin event key', () => { + expect(Popover.EVENT_KEY).toEqual('.bs.popover') + }) + }) + + describe('DefaultType', () => { + it('should return plugin default type', () => { + expect(Popover.DefaultType).toEqual(jasmine.any(Object)) + }) + }) + + describe('show', () => { + it('should show a popover', done => { + fixtureEl.innerHTML = '<a href="#" title="Popover" data-content="https://twitter.com/getbootstrap">BS twitter</a>' + + const popoverEl = fixtureEl.querySelector('a') + const popover = new Popover(popoverEl) + + popoverEl.addEventListener('shown.bs.popover', () => { + expect(document.querySelector('.popover')).toBeDefined() + done() + }) + + popover.show() + }) + + it('should set title and content from functions', done => { + fixtureEl.innerHTML = '<a href="#">BS twitter</a>' + + const popoverEl = fixtureEl.querySelector('a') + const popover = new Popover(popoverEl, { + title: () => 'Bootstrap', + content: () => 'loves writing tests (╯°□°)╯︵ ┻━┻' + }) + + popoverEl.addEventListener('shown.bs.popover', () => { + const popoverDisplayed = document.querySelector('.popover') + + expect(popoverDisplayed).toBeDefined() + expect(popoverDisplayed.querySelector('.popover-header').textContent).toEqual('Bootstrap') + expect(popoverDisplayed.querySelector('.popover-body').textContent).toEqual('loves writing tests (╯°□°)╯︵ ┻━┻') + done() + }) + + popover.show() + }) + + it('should show a popover with just content', done => { + fixtureEl.innerHTML = '<a href="#">BS twitter</a>' + + const popoverEl = fixtureEl.querySelector('a') + const popover = new Popover(popoverEl, { + content: 'Popover content' + }) + + popoverEl.addEventListener('shown.bs.popover', () => { + const popoverDisplayed = document.querySelector('.popover') + + expect(popoverDisplayed).toBeDefined() + expect(popoverDisplayed.querySelector('.popover-body').textContent).toEqual('Popover content') + done() + }) + + popover.show() + }) + }) + + describe('hide', () => { + it('should hide a popover', done => { + fixtureEl.innerHTML = '<a href="#" title="Popover" data-content="https://twitter.com/getbootstrap">BS twitter</a>' + + const popoverEl = fixtureEl.querySelector('a') + const popover = new Popover(popoverEl) + + popoverEl.addEventListener('shown.bs.popover', () => { + popover.hide() + }) + + popoverEl.addEventListener('hidden.bs.popover', () => { + expect(document.querySelector('.popover')).toBeNull() + done() + }) + + popover.show() + }) + }) + + describe('_jQueryInterface', () => { + it('should create a popover', () => { + fixtureEl.innerHTML = '<a href="#" title="Popover" data-content="https://twitter.com/getbootstrap">BS twitter</a>' + + const popoverEl = fixtureEl.querySelector('a') + + jQueryMock.fn.popover = Popover._jQueryInterface + jQueryMock.elements = [popoverEl] + + jQueryMock.fn.popover.call(jQueryMock) + + expect(Popover._getInstance(popoverEl)).toBeDefined() + }) + + it('should create a popover with a config object', () => { + fixtureEl.innerHTML = '<a href="#" title="Popover">BS twitter</a>' + + const popoverEl = fixtureEl.querySelector('a') + + jQueryMock.fn.popover = Popover._jQueryInterface + jQueryMock.elements = [popoverEl] + + jQueryMock.fn.popover.call(jQueryMock, { + content: 'Popover content' + }) + + expect(Popover._getInstance(popoverEl)).toBeDefined() + }) + + it('should not re create a popover', () => { + fixtureEl.innerHTML = '<a href="#" title="Popover" data-content="https://twitter.com/getbootstrap">BS twitter</a>' + + const popoverEl = fixtureEl.querySelector('a') + const popover = new Popover(popoverEl) + + jQueryMock.fn.popover = Popover._jQueryInterface + jQueryMock.elements = [popoverEl] + + jQueryMock.fn.popover.call(jQueryMock) + + expect(Popover._getInstance(popoverEl)).toEqual(popover) + }) + + it('should throw error on undefined method', () => { + fixtureEl.innerHTML = '<a href="#" title="Popover" data-content="https://twitter.com/getbootstrap">BS twitter</a>' + + const popoverEl = fixtureEl.querySelector('a') + const action = 'undefinedMethod' + + jQueryMock.fn.popover = Popover._jQueryInterface + jQueryMock.elements = [popoverEl] + + try { + jQueryMock.fn.popover.call(jQueryMock, action) + } catch (error) { + expect(error.message).toEqual(`No method named "${action}"`) + } + }) + + it('should should call show method', () => { + fixtureEl.innerHTML = '<a href="#" title="Popover" data-content="https://twitter.com/getbootstrap">BS twitter</a>' + + const popoverEl = fixtureEl.querySelector('a') + const popover = new Popover(popoverEl) + + jQueryMock.fn.popover = Popover._jQueryInterface + jQueryMock.elements = [popoverEl] + + spyOn(popover, 'show') + + jQueryMock.fn.popover.call(jQueryMock, 'show') + + expect(popover.show).toHaveBeenCalled() + }) + + it('should do nothing if dipose is called when a popover do not exist', () => { + fixtureEl.innerHTML = '<a href="#" title="Popover" data-content="https://twitter.com/getbootstrap">BS twitter</a>' + + const popoverEl = fixtureEl.querySelector('a') + + jQueryMock.fn.popover = Popover._jQueryInterface + jQueryMock.elements = [popoverEl] + + spyOn(Popover.prototype, 'dispose') + + jQueryMock.fn.popover.call(jQueryMock, 'dispose') + + expect(Popover.prototype.dispose).not.toHaveBeenCalled() + }) + }) + + describe('_getInstance', () => { + it('should return popover instance', () => { + fixtureEl.innerHTML = '<a href="#" title="Popover" data-content="https://twitter.com/getbootstrap">BS twitter</a>' + + const popoverEl = fixtureEl.querySelector('a') + const popover = new Popover(popoverEl) + + expect(Popover._getInstance(popoverEl)).toEqual(popover) + }) + + it('should return null when there is no popover instance', () => { + fixtureEl.innerHTML = '<a href="#" title="Popover" data-content="https://twitter.com/getbootstrap">BS twitter</a>' + + const popoverEl = fixtureEl.querySelector('a') + + expect(Popover._getInstance(popoverEl)).toEqual(null) + }) + }) +}) diff --git a/js/tests/unit/popover.js b/js/tests/unit/popover.js deleted file mode 100644 index 3782ed7eed..0000000000 --- a/js/tests/unit/popover.js +++ /dev/null @@ -1,474 +0,0 @@ -$(function () { - 'use strict' - - var Popover = typeof window.bootstrap === 'undefined' ? window.Popover : window.bootstrap.Popover - - QUnit.module('popover plugin') - - QUnit.test('should be defined on jquery object', function (assert) { - assert.expect(1) - assert.ok($(document.body).popover, 'popover method is defined') - }) - - QUnit.module('popover', { - beforeEach: function () { - // 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() - }, - afterEach: function () { - $.fn.popover = $.fn.bootstrapPopover - delete $.fn.bootstrapPopover - $('.popover').remove() - $('#qunit-fixture').html('') - } - }) - - QUnit.test('should provide no conflict', function (assert) { - assert.expect(1) - assert.strictEqual(typeof $.fn.popover, 'undefined', 'popover was set back to undefined (org value)') - }) - - QUnit.test('should throw explicit error on undefined method', function (assert) { - assert.expect(1) - var $el = $('<div/>') - $el.bootstrapPopover() - try { - $el.bootstrapPopover('noMethod') - } catch (error) { - assert.strictEqual(error.message, 'No method named "noMethod"') - } - }) - - QUnit.test('should return jquery collection containing the element', function (assert) { - assert.expect(2) - var $el = $('<div/>') - var $popover = $el.bootstrapPopover() - assert.ok($popover instanceof $, 'returns jquery collection') - assert.strictEqual($popover[0], $el[0], 'collection contains element') - }) - - QUnit.test('should render popover element', function (assert) { - assert.expect(2) - var done = assert.async() - $('<a href="#" title="mdo" data-content="https://twitter.com/mdo">@mdo</a>') - .appendTo('#qunit-fixture') - .on('shown.bs.popover', function () { - assert.notEqual($('.popover').length, 0, 'popover was inserted') - $(this).bootstrapPopover('hide') - }) - .on('hidden.bs.popover', function () { - assert.strictEqual($('.popover').length, 0, 'popover removed') - done() - }) - .bootstrapPopover('show') - }) - - QUnit.test('should store popover instance in popover data object', function (assert) { - assert.expect(1) - var $popover = $('<a href="#" title="mdo" data-content="https://twitter.com/mdo">@mdo</a>').bootstrapPopover() - - assert.ok(Popover._getInstance($popover[0]), 'popover instance exists') - }) - - QUnit.test('should store popover trigger in popover instance data object', function (assert) { - assert.expect(1) - var $popover = $('<a href="#" title="ResentedHook">@ResentedHook</a>') - .appendTo('#qunit-fixture') - .bootstrapPopover() - - $popover.bootstrapPopover('show') - - assert.ok(Popover._getInstance($('.popover')[0]), 'popover trigger stored in instance data') - }) - - 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({ - title: function () { - return '@fat' - }, - content: function () { - return 'loves writing tests (╯°□°)╯︵ ┻━┻' - } - }) - - $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) { - assert.expect(5) - var title = document.createTextNode('@glebm <3 writing tests') - var content = $('<i>¯\\_(ツ)_/¯</i>').get(0) - var $popover = $('<a href="#" rel="tooltip"/>') - .appendTo('#qunit-fixture') - .bootstrapPopover({ - html: true, - title: title, - content: content - }) - - $popover.bootstrapPopover('show') - - assert.notEqual($('.popover').length, 0, 'popover inserted') - assert.strictEqual($('.popover .popover-header').text(), '@glebm <3 writing tests', 'title inserted') - assert.ok($.contains($('.popover').get(0), title), 'title node moved, not copied') - // toLowerCase because IE8 will return <I>...</I> - assert.strictEqual($('.popover .popover-body').html().toLowerCase(), '<i>¯\\_(ツ)_/¯</i>', 'content inserted') - assert.ok($.contains($('.popover').get(0), content), 'content node moved, not copied') - }) - - QUnit.test('should allow DOMElement title and content (html: false)', function (assert) { - assert.expect(5) - var title = document.createTextNode('@glebm <3 writing tests') - var content = $('<i>¯\\_(ツ)_/¯</i>').get(0) - var $popover = $('<a href="#" rel="tooltip"/>') - .appendTo('#qunit-fixture') - .bootstrapPopover({ - title: title, - content: content - }) - - $popover.bootstrapPopover('show') - - assert.notEqual($('.popover').length, 0, 'popover inserted') - assert.strictEqual($('.popover .popover-header').text(), '@glebm <3 writing tests', 'title inserted') - assert.ok(!$.contains($('.popover').get(0), title), 'title node copied, not moved') - assert.strictEqual($('.popover .popover-body').html(), '¯\\_(ツ)_/¯', 'content inserted') - assert.ok(!$.contains($('.popover').get(0), content), 'content node copied, not moved') - }) - - 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>') - .appendTo('#qunit-fixture') - .bootstrapPopover({ - html: true, - content: function () { - return $div - } - }) - - function popoverInserted() { - assert.notEqual($('.popover').length, 0, 'popover was inserted') - assert.equal($('.popover .popover-body').html(), $div[0].outerHTML, 'content correctly inserted') - } - - $popover - .one('shown.bs.popover', function () { - popoverInserted() - - $popover.one('hidden.bs.popover', function () { - 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') - }) - - 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') - }) - - 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({ - title: 'Test', - content: 'Test', - template: '<div class="popover foobar"><div class="popover-arrow"></div><div class="inner"><h3 class="title"/><div class="content"><p/></div></div></div>' - }) - .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) { - assert.expect(3) - var $popover = $('<div/>') - .bootstrapPopover({ - trigger: 'hover' - }) - .on('click.foo', $.noop) - - assert.ok(Popover._getInstance($popover[0]), 'popover has data') - - $popover.bootstrapPopover('show') - $popover.bootstrapPopover('dispose') - - assert.ok(!$popover.hasClass('show'), 'popover is hidden') - assert.ok(!Popover._getInstance($popover[0]), 'popover does not have data') - }) - - 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')[0].click() - }) - .one('hidden.bs.popover', function () { - assert.strictEqual($('.popover').length, 0, 'popover was removed') - done() - }) - - $div.find('a')[0].click() - }) - - QUnit.test('should detach popover content rather than removing it so that event handlers are left intact', function (assert) { - assert.expect(1) - var $content = $('<div class="content-with-handler"><a class="btn btn-warning">Button with event handler</a></div>').appendTo('#qunit-fixture') - - var handlerCalled = false - $('.content-with-handler .btn').on('click', function () { - handlerCalled = true - }) - - var $div = $('<div><a href="#">Show popover</a></div>') - .appendTo('#qunit-fixture') - .bootstrapPopover({ - html: true, - trigger: 'manual', - container: 'body', - animation: false, - content: function () { - return $content - } - }) - - var done = assert.async() - $div - .one('shown.bs.popover', function () { - $div - .one('hidden.bs.popover', function () { - $div - .one('shown.bs.popover', function () { - $('.content-with-handler .btn').trigger('click') - assert.ok(handlerCalled, 'content\'s event handler still present') - $div.bootstrapPopover('dispose') - done() - }) - .bootstrapPopover('show') - }) - .bootstrapPopover('hide') - }) - .bootstrapPopover('show') - }) - - 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.ok(Popover._getInstance($popover[0]) === null, 'should not initialize the popover') - }) - - QUnit.test('should fire inserted event', function (assert) { - assert.expect(2) - var done = assert.async() - - $('<a href="#">@Johann-S</a>') - .appendTo('#qunit-fixture') - .on('inserted.bs.popover', function () { - assert.notEqual($('.popover').length, 0, 'popover was inserted') - assert.ok(true, 'inserted event fired') - done() - }) - .bootstrapPopover({ - title: 'Test', - content: 'Test' - }) - .bootstrapPopover('show') - }) - - QUnit.test('should throw an error when show is called on hidden elements', function (assert) { - assert.expect(1) - var done = assert.async() - - try { - $('<div data-toggle="popover" data-title="some title" data-content="@Johann-S" style="display: none"/>').bootstrapPopover('show') - } catch (error) { - assert.strictEqual(error.message, 'Please use show on visible elements') - done() - } - }) - - QUnit.test('should hide popovers 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">' + - '<button id="popover-test" type="button" class="btn btn-secondary" data-toggle="popover" data-placement="top" data-content="Popover">' + - 'Popover on top' + - '</button>' + - '</div>' + - '</div>' + - '</div>' + - '</div>' - - $(templateHTML).appendTo('#qunit-fixture') - $('#popover-test') - .on('shown.bs.popover', function () { - $('#modal-test').modal('hide') - }) - .on('hide.bs.popover', function () { - assert.ok(true, 'popover hide') - done() - }) - - $('#modal-test') - .on('shown.bs.modal', function () { - $('#popover-test').bootstrapPopover('show') - }) - .modal('show') - }) - - QUnit.test('should convert number to string without error for content and title', function (assert) { - assert.expect(2) - var done = assert.async() - var $popover = $('<a href="#">@mdo</a>') - .appendTo('#qunit-fixture') - .bootstrapPopover({ - title: 5, - content: 7 - }) - .on('shown.bs.popover', function () { - assert.strictEqual($('.popover .popover-header').text(), '5') - assert.strictEqual($('.popover .popover-body').text(), '7') - done() - }) - - $popover.bootstrapPopover('show') - }) - - QUnit.test('popover should be shown right away after the call of disable/enable', function (assert) { - assert.expect(2) - var done = assert.async() - var $popover = $('<a href="#">@mdo</a>') - .appendTo('#qunit-fixture') - .bootstrapPopover({ - title: 'Test popover', - content: 'with disable/enable' - }) - .on('shown.bs.popover', function () { - assert.strictEqual($('.popover').hasClass('show'), true) - done() - }) - - $popover.bootstrapPopover('disable') - $popover[0].click() - setTimeout(function () { - assert.strictEqual($('.popover').length === 0, true) - $popover.bootstrapPopover('enable') - $popover[0].click() - }, 200) - }) - - QUnit.test('popover should call content function only once', function (assert) { - assert.expect(1) - var done = assert.async() - var nbCall = 0 - $('<div id="popover" style="display:none">content</div>').appendTo('#qunit-fixture') - var $popover = $('<a href="#">@Johann-S</a>') - .appendTo('#qunit-fixture') - .bootstrapPopover({ - content: function () { - nbCall++ - return $('#popover').clone().show().get(0) - } - }) - .on('shown.bs.popover', function () { - assert.strictEqual(nbCall, 1) - done() - }) - - $popover[0].click() - }) - - QUnit.test('should return the version', function (assert) { - assert.expect(1) - assert.strictEqual(typeof Popover.VERSION, 'string') - }) -}) |