diff options
author | GeoSot <geo.sotis@gmail.com> | 2021-12-15 11:41:31 +0300 |
---|---|---|
committer | GitHub <noreply@github.com> | 2021-12-15 11:41:31 +0300 |
commit | d40fae456e0273c7e8c98cbdd17c55fd5d69ec47 (patch) | |
tree | 8cc8b289b013254f1f02d6c41703d4f5e658e2fe /js | |
parent | cd04fe015f9118930a86c678f034b5657878885a (diff) |
Popover.js: Accept empty content through `data-bs-content` (#35514)
Co-authored-by: XhmikosR <xhmikosr@gmail.com>
Diffstat (limited to 'js')
-rw-r--r-- | js/src/popover.js | 2 | ||||
-rw-r--r-- | js/tests/unit/popover.spec.js | 44 |
2 files changed, 31 insertions, 15 deletions
diff --git a/js/src/popover.js b/js/src/popover.js index 375eb8b0ab..b62b6a2123 100644 --- a/js/src/popover.js +++ b/js/src/popover.js @@ -34,7 +34,7 @@ const Default = { const DefaultType = { ...Tooltip.DefaultType, - content: '(string|element|function)' + content: '(null|string|element|function)' } const Event = { diff --git a/js/tests/unit/popover.spec.js b/js/tests/unit/popover.spec.js index a2906ade71..a04bd21c60 100644 --- a/js/tests/unit/popover.spec.js +++ b/js/tests/unit/popover.spec.js @@ -1,4 +1,5 @@ import Popover from '../../src/popover' +import EventHandler from '../../src/dom/event-handler' import { clearFixture, getFixture, jQueryMock } from '../helpers/fixture' describe('Popover', () => { @@ -96,59 +97,74 @@ describe('Popover', () => { popover.show() }) - it('should show a popover with just content', done => { - fixtureEl.innerHTML = '<a href="#">BS twitter</a>' + it('should show a popover with just content without having header', done => { + fixtureEl.innerHTML = '<a href="#">Nice link</a>' const popoverEl = fixtureEl.querySelector('a') const popover = new Popover(popoverEl, { - content: 'Popover content' + content: 'Some beautiful content :)' }) popoverEl.addEventListener('shown.bs.popover', () => { const popoverDisplayed = document.querySelector('.popover') expect(popoverDisplayed).not.toBeNull() - expect(popoverDisplayed.querySelector('.popover-body').textContent).toEqual('Popover content') + expect(popoverDisplayed.querySelector('.popover-header')).toBeNull() + expect(popoverDisplayed.querySelector('.popover-body').textContent).toEqual('Some beautiful content :)') done() }) popover.show() }) - it('should show a popover with just content without having header', done => { + it('should show a popover with just title without having body', done => { fixtureEl.innerHTML = '<a href="#">Nice link</a>' const popoverEl = fixtureEl.querySelector('a') const popover = new Popover(popoverEl, { - content: 'Some beautiful content :)' + title: 'Title which does not require content' }) popoverEl.addEventListener('shown.bs.popover', () => { const popoverDisplayed = document.querySelector('.popover') expect(popoverDisplayed).not.toBeNull() - expect(popoverDisplayed.querySelector('.popover-header')).toBeNull() - expect(popoverDisplayed.querySelector('.popover-body').textContent).toEqual('Some beautiful content :)') + expect(popoverDisplayed.querySelector('.popover-body')).toBeNull() + expect(popoverDisplayed.querySelector('.popover-header').textContent).toEqual('Title which does not require content') done() }) popover.show() }) - it('should show a popover with just title without having body', done => { - fixtureEl.innerHTML = '<a href="#">Nice link</a>' + it('should show a popover with just title without having body using data-attribute to get config', done => { + fixtureEl.innerHTML = '<a href="#" data-bs-content="" title="Title which does not require content">Nice link</a>' const popoverEl = fixtureEl.querySelector('a') - const popover = new Popover(popoverEl, { - title: 'Title, which does not require content' - }) + const popover = new Popover(popoverEl) popoverEl.addEventListener('shown.bs.popover', () => { const popoverDisplayed = document.querySelector('.popover') expect(popoverDisplayed).not.toBeNull() expect(popoverDisplayed.querySelector('.popover-body')).toBeNull() - expect(popoverDisplayed.querySelector('.popover-header').textContent).toEqual('Title, which does not require content') + expect(popoverDisplayed.querySelector('.popover-header').textContent).toEqual('Title which does not require content') + done() + }) + + popover.show() + }) + + it('should NOT show a popover without `title` and `content`', done => { + fixtureEl.innerHTML = '<a href="#" data-bs-content="" title="">Nice link</a>' + + const popoverEl = fixtureEl.querySelector('a') + const popover = new Popover(popoverEl, { animation: false }) + spyOn(EventHandler, 'trigger').and.callThrough() + + setTimeout(() => { + expect(EventHandler.trigger).not.toHaveBeenCalled() + expect(document.querySelector('.popover')).toBeNull() done() }) |