mirror of
https://github.com/twbs/bootstrap.git
synced 2025-03-13 13:29:25 +01:00
Regression on tooltip template creation process. (#34628)
* Regression on tooltip template creation process. * check if template content does not exist, or given argument is empty * call `setContent()` once.
This commit is contained in:
parent
23fd488c38
commit
a6a2d1e2df
@ -84,9 +84,7 @@ class Popover extends Tooltip {
|
||||
return this.getTitle() || this._getContent()
|
||||
}
|
||||
|
||||
setContent() {
|
||||
const tip = this.getTipElement()
|
||||
|
||||
setContent(tip) {
|
||||
this._sanitizeAndSetContent(tip, this.getTitle(), SELECTOR_TITLE)
|
||||
this._sanitizeAndSetContent(tip, this._getContent(), SELECTOR_CONTENT)
|
||||
}
|
||||
|
@ -243,8 +243,6 @@ class Tooltip extends BaseComponent {
|
||||
tip.setAttribute('id', tipId)
|
||||
this._element.setAttribute('aria-describedby', tipId)
|
||||
|
||||
this.setContent()
|
||||
|
||||
if (this._config.animation) {
|
||||
tip.classList.add(CLASS_NAME_FADE)
|
||||
}
|
||||
@ -371,20 +369,21 @@ class Tooltip extends BaseComponent {
|
||||
element.innerHTML = this._config.template
|
||||
|
||||
const tip = element.children[0]
|
||||
this.setContent(tip)
|
||||
tip.classList.remove(CLASS_NAME_FADE, CLASS_NAME_SHOW)
|
||||
|
||||
this.tip = tip
|
||||
return this.tip
|
||||
}
|
||||
|
||||
setContent() {
|
||||
const tip = this.getTipElement()
|
||||
setContent(tip) {
|
||||
this._sanitizeAndSetContent(tip, this.getTitle(), SELECTOR_TOOLTIP_INNER)
|
||||
}
|
||||
|
||||
_sanitizeAndSetContent(template, content, selector) {
|
||||
const templateElement = SelectorEngine.findOne(selector, template)
|
||||
if (!content) {
|
||||
|
||||
if (!content && templateElement) {
|
||||
templateElement.remove()
|
||||
return
|
||||
}
|
||||
|
@ -1,7 +1,7 @@
|
||||
import Popover from '../../src/popover'
|
||||
|
||||
/** Test helpers */
|
||||
import { getFixture, clearFixture, jQueryMock } from '../helpers/fixture'
|
||||
import { clearFixture, getFixture, jQueryMock } from '../helpers/fixture'
|
||||
|
||||
describe('Popover', () => {
|
||||
let fixtureEl
|
||||
@ -157,6 +157,37 @@ describe('Popover', () => {
|
||||
popover.show()
|
||||
})
|
||||
|
||||
it('should call setContent once', done => {
|
||||
fixtureEl.innerHTML = '<a href="#">BS twitter</a>'
|
||||
|
||||
const popoverEl = fixtureEl.querySelector('a')
|
||||
const popover = new Popover(popoverEl, {
|
||||
content: 'Popover content'
|
||||
})
|
||||
|
||||
const spy = spyOn(popover, 'setContent').and.callThrough()
|
||||
let times = 1
|
||||
|
||||
popoverEl.addEventListener('hidden.bs.popover', () => {
|
||||
popover.show()
|
||||
})
|
||||
|
||||
popoverEl.addEventListener('shown.bs.popover', () => {
|
||||
const popoverDisplayed = document.querySelector('.popover')
|
||||
|
||||
expect(popoverDisplayed).not.toBeNull()
|
||||
expect(popoverDisplayed.querySelector('.popover-body').textContent).toEqual('Popover content')
|
||||
expect(spy).toHaveBeenCalledTimes(1)
|
||||
if (times > 1) {
|
||||
done()
|
||||
}
|
||||
|
||||
times++
|
||||
popover.hide()
|
||||
})
|
||||
popover.show()
|
||||
})
|
||||
|
||||
it('should show a popover with provided custom class', done => {
|
||||
fixtureEl.innerHTML = '<a href="#" title="Popover" data-bs-content="https://twitter.com/getbootstrap" data-bs-custom-class="custom-class">BS twitter</a>'
|
||||
|
||||
|
@ -1045,10 +1045,10 @@ describe('Tooltip', () => {
|
||||
const tooltipEl = fixtureEl.querySelector('a')
|
||||
const tooltip = new Tooltip(tooltipEl)
|
||||
|
||||
tooltip.setContent()
|
||||
|
||||
const tip = tooltip.getTipElement()
|
||||
|
||||
tooltip.setContent(tip)
|
||||
|
||||
expect(tip.classList.contains('show')).toEqual(false)
|
||||
expect(tip.classList.contains('fade')).toEqual(false)
|
||||
expect(tip.querySelector('.tooltip-inner').textContent).toEqual('Another tooltip')
|
||||
|
Loading…
x
Reference in New Issue
Block a user