Fix bad position for Tooltips with animation at true

1 files changed, 19 insertions, 5 deletions

diff --git a/js/src/tooltip.js b/js/src/tooltip.js
index eb517252e0..6d3db06ab9 100644
--- a/js/src/tooltip.js
+++ b/js/src/tooltip.js
@@ -306,8 +306,6 @@ const Tooltip = (($) => {
           }
         })
 
-        Util.reflow(tip)
-
         $(tip).addClass(ClassName.SHOW)
 
         // if this is a touch-enabled device we add extra
@@ -319,6 +317,9 @@ const Tooltip = (($) => {
         }
 
         const complete = () => {
+          if (this.config.animation) {
+            this._fixTransition()
+          }
           const prevHoverState = this._hoverState
           this._hoverState     = null
 
@@ -333,10 +334,10 @@ const Tooltip = (($) => {
           $(this.tip)
             .one(Util.TRANSITION_END, complete)
             .emulateTransitionEnd(Tooltip._TRANSITION_DURATION)
-          return
         }
-
-        complete()
+        else {
+          complete()
+        }
       }
     }
 
@@ -663,6 +664,19 @@ const Tooltip = (($) => {
       this.addAttachmentClass(this._getAttachment(data.placement))
     }
 
+    _fixTransition() {
+      const tip                 = this.getTipElement()
+      const initConfigAnimation = this.config.animation
+      if (tip.getAttribute('x-placement') !== null) {
+        return;
+      }
+      $(tip).removeClass(ClassName.FADE)
+      this.config.animation = false
+      this.hide()
+      this.show()
+      this.config.animation = initConfigAnimation
+    }
+
     // static
 
     static _jQueryInterface(config) {