diff options
author | GeoSot <geo.sotis@gmail.com> | 2022-09-14 16:24:37 +0300 |
---|---|---|
committer | GitHub <noreply@github.com> | 2022-09-14 16:24:37 +0300 |
commit | 3bd57564140ef3953582a80e8f1084d81bdb5977 (patch) | |
tree | 1c3b3af0e793bffce5226cf6a2fe20f885e807cc /js/src/tooltip.js | |
parent | 4600a2540463b9ea5a3c505de92d1c0252c01fd5 (diff) |
fix: add trick to support tooltip selector usage on dynamic created tooltips that utilize `title` attribute (#36914)
Diffstat (limited to 'js/src/tooltip.js')
-rw-r--r-- | js/src/tooltip.js | 49 |
1 files changed, 18 insertions, 31 deletions
diff --git a/js/src/tooltip.js b/js/src/tooltip.js index e30701efcc..86c6056d82 100644 --- a/js/src/tooltip.js +++ b/js/src/tooltip.js @@ -121,6 +121,10 @@ class Tooltip extends BaseComponent { this.tip = null this._setListeners() + + if (!this._config.selector) { + this._fixTitle() + } } // Getters @@ -149,25 +153,12 @@ class Tooltip extends BaseComponent { this._isEnabled = !this._isEnabled } - toggle(event) { + toggle() { if (!this._isEnabled) { return } - if (event) { - const context = this._initializeOnDelegatedTarget(event) - - context._activeTrigger.click = !context._activeTrigger.click - - if (context._isWithActiveTrigger()) { - context._enter() - } else { - context._leave() - } - - return - } - + this._activeTrigger.click = !this._activeTrigger.click if (this._isShown()) { this._leave() return @@ -185,8 +176,8 @@ class Tooltip extends BaseComponent { this.tip.remove() } - if (this._config.originalTitle) { - this._element.setAttribute('title', this._config.originalTitle) + if (this._element.getAttribute('data-bs-original-title')) { + this._element.setAttribute('title', this._element.getAttribute('data-bs-original-title')) } this._disposePopper() @@ -375,7 +366,7 @@ class Tooltip extends BaseComponent { } _getTitle() { - return this._resolvePossibleFunction(this._config.title) || this._config.originalTitle + return this._resolvePossibleFunction(this._config.title) || this._element.getAttribute('data-bs-original-title') } // Private @@ -469,7 +460,10 @@ class Tooltip extends BaseComponent { for (const trigger of triggers) { if (trigger === 'click') { - EventHandler.on(this._element, this.constructor.eventName(EVENT_CLICK), this._config.selector, event => this.toggle(event)) + EventHandler.on(this._element, this.constructor.eventName(EVENT_CLICK), this._config.selector, event => { + const context = this._initializeOnDelegatedTarget(event) + context.toggle() + }) } else if (trigger !== TRIGGER_MANUAL) { const eventIn = trigger === TRIGGER_HOVER ? this.constructor.eventName(EVENT_MOUSEENTER) : @@ -500,20 +494,10 @@ class Tooltip extends BaseComponent { } EventHandler.on(this._element.closest(SELECTOR_MODAL), EVENT_MODAL_HIDE, this._hideModalHandler) - - if (this._config.selector) { - this._config = { - ...this._config, - trigger: 'manual', - selector: '' - } - } else { - this._fixTitle() - } } _fixTitle() { - const title = this._config.originalTitle + const title = this._element.getAttribute('title') if (!title) { return @@ -523,6 +507,7 @@ class Tooltip extends BaseComponent { this._element.setAttribute('aria-label', title) } + this._element.setAttribute('data-bs-original-title', title) // DO NOT USE IT. Is only for backwards compatibility this._element.removeAttribute('title') } @@ -593,7 +578,6 @@ class Tooltip extends BaseComponent { } } - config.originalTitle = this._element.getAttribute('title') || '' if (typeof config.title === 'number') { config.title = config.title.toString() } @@ -614,6 +598,9 @@ class Tooltip extends BaseComponent { } } + config.selector = false + config.trigger = 'manual' + // In the future can be replaced with: // const keysWithDifferentValues = Object.entries(this._config).filter(entry => this.constructor.Default[entry[0]] !== this._config[entry[0]]) // `Object.fromEntries(keysWithDifferentValues)` |