Fix different tooltips offset when hovering

diff --git a/js/src/tooltip.js b/js/src/tooltip.js
index e750dceccf6ca5a319f3dbbcc919a752610e9308..fe913e66086158e7926b38b10a43bcd8fba3ad0b 100644 (file)
--- a/js/src/tooltip.js
+++ b/js/src/tooltip.js
@@ -34,6 +34,7 @@ const Tooltip = (($) => {
   const JQUERY_NO_CONFLICT  = $.fn[NAME]
   const TRANSITION_DURATION = 150
   const CLASS_PREFIX        = 'bs-tether'
+  const TETHER_PREFIX_REGEX = new RegExp(`(^|\\s)${CLASS_PREFIX}\\S+`, 'g')
 
   const Default = {
     animation   : true,
@@ -340,6 +341,7 @@ const Tooltip = (($) => {
           tip.parentNode.removeChild(tip)
         }
 
+        this._cleanTipClass()
         this.element.removeAttribute('aria-describedby')
         $(this.element).trigger(this.constructor.Event.HIDDEN)
         this._isTransitioning = false
@@ -438,6 +440,14 @@ const Tooltip = (($) => {
       return AttachmentMap[placement.toUpperCase()]
     }
 
+    _cleanTipClass() {
+      const $tip = $(this.getTipElement())
+      const tabClass = $tip.attr('class').match(TETHER_PREFIX_REGEX)
+      if (tabClass !== null && tabClass.length > 0) {
+        $tip.removeClass(tabClass.join(''))
+      }
+    }
+
     _setListeners() {
       const triggers = this.config.trigger.split(' ')
 

diff --git a/js/tests/unit/tooltip.js b/js/tests/unit/tooltip.js
index e1aec5551ff4e9c90ca07c0e9c915ef87f82e754..e739f06a50ad0280beb9f8ba332055a911087301 100644 (file)
--- a/js/tests/unit/tooltip.js
+++ b/js/tests/unit/tooltip.js
@@ -869,4 +869,21 @@ $(function () {
       })
       .modal('show')
   })
+
+  QUnit.test('should reset tip classes when hidden event triggered', function (assert) {
+    assert.expect(2)
+    var done = assert.async()
+    var $el = $('<a href="#" rel="tooltip" title="Test tooltip"/>')
+      .appendTo('#qunit-fixture')
+      .bootstrapTooltip('show')
+      .on('hidden.bs.tooltip', function () {
+        var tooltip = $el.data('bs.tooltip')
+        var $tooltip = $(tooltip.getTipElement())
+        assert.ok($tooltip.hasClass('tooltip'))
+        assert.ok($tooltip.hasClass('fade'))
+        done()
+      })
+
+    $el.bootstrapTooltip('hide')
+  })
 })