fix(tooltip): remove when body is clicked

src/tooltip/test/tooltip2.spec.js

@@ -51,6 +51,20 @@ describe('tooltip directive', function () {
       expect(fragment).not.toHaveOpenTooltips();
     });
 
+    it('should close the tooltip when any part of the body of the page is clicked', function() {
+      var fragment = compileTooltip('<span tooltip="tooltip text" tooltip-trigger="click">Trigger here</span>');
+
+      $document.find('body').append(fragment);
+      fragment.find('span').trigger( 'click' );
+      expect(fragment).toHaveOpenTooltips();
+
+      fragment.trigger( 'click' );
+      $timeout.flush();
+      expect(fragment).not.toHaveOpenTooltips();
+
+      fragment.remove();
+    });
+
     it('should not show a tooltip when its content is empty', function () {
       var fragment = compileTooltip('<span tooltip=""></span>');
       fragment.find('span').trigger( 'mouseenter' );

src/tooltip/tooltip.js

@@ -135,9 +135,9 @@ angular.module( 'ui.bootstrap.tooltip', [ 'ui.bootstrap.position', 'ui.bootstrap
 
             function toggleTooltipBind () {
               if ( ! scope.tt_isOpen ) {
-                showTooltipBind();
+                return showTooltipBind();
               } else {
-                hideTooltipBind();
+                return hideTooltipBind();
               }
             }
 
@@ -156,12 +156,19 @@ angular.module( 'ui.bootstrap.tooltip', [ 'ui.bootstrap.position', 'ui.bootstrap
               } else {
                 show()();
               }
+              return false;
             }
 
             function hideTooltipBind () {
               scope.$apply(function () {
                 hide();
               });
+              return false;
+            }
+
+            function hideTooltipGlobal () {
+              hideTooltipBind();
+              // don't return false as we don't want to block other handlers
             }
 
             // Show the tooltip popup element.
@@ -186,7 +193,7 @@ angular.module( 'ui.bootstrap.tooltip', [ 'ui.bootstrap.position', 'ui.bootstrap
               // Set the initial positioning.
               tooltip.css({ top: 0, left: 0, display: 'block' });
 
-              // Now we add it to the DOM because need some info about it. But it's not 
+              // Now we add it to the DOM because need some info about it. But it's not
               // visible yet anyway.
               if ( appendToBody ) {
                   $document.find( 'body' ).append( tooltip );
@@ -200,6 +207,9 @@ angular.module( 'ui.bootstrap.tooltip', [ 'ui.bootstrap.position', 'ui.bootstrap
               scope.tt_isOpen = true;
               scope.$digest(); // digest required as $apply is not called
 
+              // If we click on the document then hide the tooltip
+              $document.find( 'body' ).bind('click', hideTooltipGlobal);
+
               // Return positioning function as promise callback for correct
               // positioning after draw.
               return positionTooltip;
@@ -210,11 +220,15 @@ angular.module( 'ui.bootstrap.tooltip', [ 'ui.bootstrap.position', 'ui.bootstrap
               // First things first: we don't show it anymore.
               scope.tt_isOpen = false;
 
+              // Remove hide handler
+              $document.find( 'body' ).unbind('click', hideTooltipGlobal);
+
+
               //if tooltip is going to be shown after delay, we must cancel this
               $timeout.cancel( popupTimeout );
               popupTimeout = null;
 
-              // And now we remove it from the DOM. However, if we have animation, we 
+              // And now we remove it from the DOM. However, if we have animation, we
               // need to wait for it to expire beforehand.
               // FIXME: this is a placeholder for a port of the transitions library.
               if ( scope.tt_animation ) {