Tooltip: apply position class before positioning

2 files changed, 15 insertions, 1 deletions

diff --git a/js/tests/unit/tooltip.js b/js/tests/unit/tooltip.js
index 638edefc2..b1bf75e55 100644
--- a/js/tests/unit/tooltip.js
+++ b/js/tests/unit/tooltip.js
@@ -291,4 +291,18 @@ $(function () {
           container.remove()
         }, 100)
       })
+
+      test("should add position class before positioning so that position-specific styles are taken into account", function(){
+        $("head").append('<style> .tooltip.right { white-space: nowrap; } .tooltip.right .tooltip-inner { max-width: none; } </style>')
+        
+        var container = $("<div />").appendTo("body")
+          , target = $('<a href="#" rel="tooltip" title="very very very very very very very very long tooltip in one line">To my right</a>')
+          .appendTo(container)
+          .tooltip({placement: 'right'})
+          .tooltip('show')
+          , tooltip = container.find(".tooltip")
+        
+        ok( Math.round(target.offset().top + target[0].offsetHeight/2 - tooltip[0].offsetHeight/2) === tooltip.offset().top )
+        target.tooltip('hide')
+      })
 })
diff --git a/js/tooltip.js b/js/tooltip.js
index d95624bdc..1f84b5cf5 100644
--- a/js/tooltip.js
+++ b/js/tooltip.js
@@ -147,6 +147,7 @@
       $tip
         .detach()
         .css({ top: 0, left: 0, display: 'block' })
+        .addClass(placement)
 
       this.options.container ? $tip.appendTo(this.options.container) : $tip.insertAfter(this.$element)
 
@@ -183,7 +184,6 @@
 
     $tip
       .offset(offset)
-      .addClass(placement)
       .addClass('in')
 
     var actualWidth  = $tip[0].offsetWidth