rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-01 13:24:25 +01:00
Code Issues Actions Packages Releases Activity

prevent quick interactions from misplacing tooltips

Browse Source
This commit is contained in:
Ryan Berliner 2021-03-06 23:57:23 +02:00 committed by XhmikosR
parent d491c29aa0
commit 6ef70b342c
2 changed files with 10 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
js/src/tooltip.js
View File

@ -283,6 +283,10 @@ class Tooltip extends BaseComponent {
EventHandler.trigger(this._element, this.constructor.Event.INSERTED)
if (this._popper) {
this._popper.destroy()
}
this._popper = Popper.createPopper(this._element, tip, this._getPopperConfig(attachment))
tip.classList.add(CLASS_NAME_SHOW)
@ -650,7 +654,7 @@ class Tooltip extends BaseComponent {
if (event) {
context._activeTrigger[
event.type === 'focusout' ? TRIGGER_FOCUS : TRIGGER_HOVER
] = false
] = context._element.contains(event.relatedTarget)
}
if (context._isWithActiveTrigger()) {

7
js/tests/unit/tooltip.spec.js
View File

@ -708,8 +708,9 @@ describe('Tooltip', () => {
tooltipEl.dispatchEvent(createEvent('mouseover'))
})
it('should not hide tooltip if leave event occurs and enter event occurs during hide transition', done => {
fixtureEl.innerHTML = '<a href="#" rel="tooltip" title="Another tooltip">'
it('should properly maintain tooltip state if leave event occurs and enter event occurs during hide transition', done => {
// Style this tooltip to give it plenty of room for popper to do what it wants
fixtureEl.innerHTML = '<a href="#" rel="tooltip" title="Another tooltip" data-bs-placement="top" style="position:fixed;left:50%;top:50%;">Trigger</a>'
const tooltipEl = fixtureEl.querySelector('a')
const tooltip = new Tooltip(tooltipEl)
@ -721,6 +722,7 @@ describe('Tooltip', () => {
setTimeout(() => {
expect(tooltip._popper).not.toBeNull()
expect(tooltip.getTipElement().getAttribute('data-popper-placement')).toBe('top')
tooltipEl.dispatchEvent(createEvent('mouseout'))
setTimeout(() => {
@ -730,6 +732,7 @@ describe('Tooltip', () => {
setTimeout(() => {
expect(tooltip._popper).not.toBeNull()
expect(tooltip.getTipElement().getAttribute('data-popper-placement')).toBe('top')
done()
}, 200)
}, 0)