diff options
| author | Johann-S <[email protected]> | 2019-05-08 21:32:50 +0200 |
|---|---|---|
| committer | Johann-S <[email protected]> | 2019-07-23 14:23:50 +0200 |
| commit | c9e650a56f84a1f8526806b6fa9874aa6d258d24 (patch) | |
| tree | e9125d29b5c0f98cb5a9d9954f322b2809b93ece /js/src | |
| parent | 1ac07a66ce56e6ee3d2b48a649e957417f56c83e (diff) | |
| download | bootstrap-c9e650a56f84a1f8526806b6fa9874aa6d258d24.tar.xz bootstrap-c9e650a56f84a1f8526806b6fa9874aa6d258d24.zip | |
rewrite popover unit tests
Diffstat (limited to 'js/src')
| -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 |
2 files changed, 256 insertions, 5 deletions
diff --git a/js/src/popover.js b/js/src/popover/popover.js index 3cb5549df..3a55083c4 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 000000000..cb16bf271 --- /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) + }) + }) +}) |
