diff --git a/src/popover/test/popover-html.spec.js b/src/popover/test/popover-html.spec.js
index fb25ba969e..fd43e51f15 100644
--- a/src/popover/test/popover-html.spec.js
+++ b/src/popover/test/popover-html.spec.js
@@ -21,6 +21,7 @@ describe('popover', function() {
scope.template = $sce.trustAsHtml('My template');
$compile(elmBody)(scope);
scope.$digest();
+ $document.find('body').append(elmBody);
elm = elmBody.find('span');
elmScope = elm.scope();
tooltipScope = elmScope.$$childTail;
@@ -87,6 +88,7 @@ describe('popover', function() {
it('should hide popover when template becomes empty', inject(function($timeout) {
elm.trigger('click');
tooltipScope.$digest();
+ $timeout.flush(0);
expect(tooltipScope.isOpen).toBe(true);
scope.template = '';
diff --git a/src/popover/test/popover-template.spec.js b/src/popover/test/popover-template.spec.js
index e52c2f8aa8..b46e668b06 100644
--- a/src/popover/test/popover-template.spec.js
+++ b/src/popover/test/popover-template.spec.js
@@ -25,6 +25,7 @@ describe('popover template', function() {
scope = $rootScope;
$compile(elmBody)(scope);
+ $document.find('body').append(elmBody);
scope.templateUrl = 'myUrl';
scope.$digest();
@@ -35,6 +36,7 @@ describe('popover template', function() {
afterEach(function() {
$document.off('keypress');
+ elmBody.remove();
});
it('should open on click', inject(function() {
@@ -75,6 +77,7 @@ describe('popover template', function() {
it('should hide popover when template becomes empty', inject(function($timeout) {
elm.trigger('click');
tooltipScope.$digest();
+ $timeout.flush(0);
expect(tooltipScope.isOpen).toBe(true);
scope.templateUrl = '';
diff --git a/src/tooltip/test/tooltip-template.spec.js b/src/tooltip/test/tooltip-template.spec.js
index cec7d4b5cc..e474c6dbc3 100644
--- a/src/tooltip/test/tooltip-template.spec.js
+++ b/src/tooltip/test/tooltip-template.spec.js
@@ -75,6 +75,7 @@ describe('tooltip template', function() {
it('should hide tooltip when template becomes empty', inject(function($timeout) {
trigger(elm, 'mouseenter');
+ $timeout.flush(0);
expect(tooltipScope.isOpen).toBe(true);
scope.templateUrl = '';
diff --git a/src/tooltip/test/tooltip2.spec.js b/src/tooltip/test/tooltip2.spec.js
index e8df646479..81326e466b 100644
--- a/src/tooltip/test/tooltip2.spec.js
+++ b/src/tooltip/test/tooltip2.spec.js
@@ -1,5 +1,5 @@
describe('tooltip directive', function() {
- var $rootScope, $compile, $document, $timeout;
+ var $rootScope, $compile, $document, $timeout, body, fragment;
beforeEach(module('ui.bootstrap.tooltip'));
beforeEach(module('uib/template/tooltip/tooltip-popup.html'));
@@ -10,6 +10,8 @@ describe('tooltip directive', function() {
$compile = _$compile_;
$document = _$document_;
$timeout = _$timeout_;
+
+ body = $document.find('body');
}));
beforeEach(function() {
@@ -39,12 +41,13 @@ describe('tooltip directive', function() {
afterEach(function() {
$document.off('keypress');
+ fragment.remove();
});
function compileTooltip(ttipMarkup) {
- var fragment = $compile('
' + ttipMarkup + '
')($rootScope);
+ fragment = $compile('' + ttipMarkup + '
')($rootScope);
$rootScope.$digest();
- return fragment;
+ body.append(fragment);
}
function closeTooltip(hostEl, triggerEvt, shouldNotFlush) {
@@ -62,7 +65,7 @@ describe('tooltip directive', function() {
describe('basic scenarios with default options', function() {
it('shows default tooltip on mouse enter and closes on mouse leave', function() {
- var fragment = compileTooltip('Trigger here');
+ compileTooltip('Trigger here');
trigger(fragment.find('span'), 'mouseenter');
expect(fragment).toHaveOpenTooltips();
@@ -72,16 +75,17 @@ describe('tooltip directive', function() {
});
it('should not show a tooltip when its content is empty', function() {
- var fragment = compileTooltip('');
+ compileTooltip('');
trigger(fragment.find('span'), 'mouseenter');
expect(fragment).not.toHaveOpenTooltips();
});
it('should not show a tooltip when its content becomes empty', function() {
$rootScope.content = 'some text';
- var fragment = compileTooltip('');
+ compileTooltip('');
trigger(fragment.find('span'), 'mouseenter');
+ $timeout.flush(0);
expect(fragment).toHaveOpenTooltips();
$rootScope.content = '';
@@ -92,7 +96,7 @@ describe('tooltip directive', function() {
it('should update tooltip when its content becomes empty', function() {
$rootScope.content = 'some text';
- var fragment = compileTooltip('');
+ compileTooltip('');
$rootScope.content = '';
$rootScope.$digest();
@@ -119,7 +123,7 @@ describe('tooltip directive', function() {
describe(key, function() {
describe('placement', function() {
it('can specify an alternative, valid placement', function() {
- var fragment = compileTooltip('Trigger here');
+ compileTooltip('Trigger here');
trigger(fragment.find('span'), 'mouseenter');
var ttipElement = fragment.find('div.tooltip');
@@ -133,7 +137,7 @@ describe('tooltip directive', function() {
describe('class', function() {
it('can specify a custom class', function() {
- var fragment = compileTooltip('Trigger here');
+ compileTooltip('Trigger here');
trigger(fragment.find('span'), 'mouseenter');
var ttipElement = fragment.find('div.tooltip');
@@ -149,7 +153,7 @@ describe('tooltip directive', function() {
});
it('should show even after close trigger is called multiple times - issue #1847', function() {
- var fragment = compileTooltip('Trigger here');
+ compileTooltip('Trigger here');
trigger(fragment.find('span'), 'mouseenter');
expect(fragment).toHaveOpenTooltips();
@@ -169,7 +173,7 @@ describe('tooltip directive', function() {
});
it('should hide even after show trigger is called multiple times', function() {
- var fragment = compileTooltip('Trigger here');
+ compileTooltip('Trigger here');
trigger(fragment.find('span'), 'mouseenter');
trigger(fragment.find('span'), 'mouseenter');
@@ -179,7 +183,7 @@ describe('tooltip directive', function() {
});
it('should not show tooltips element is disabled (button) - issue #3167', function() {
- var fragment = compileTooltip('');
+ compileTooltip('');
trigger(fragment.find('button'), 'mouseenter');
expect(fragment).toHaveOpenTooltips();
diff --git a/src/tooltip/tooltip.js b/src/tooltip/tooltip.js
index cb3a508561..ae8001db32 100644
--- a/src/tooltip/tooltip.js
+++ b/src/tooltip/tooltip.js
@@ -163,11 +163,14 @@ angular.module('ui.bootstrap.tooltip', ['ui.bootstrap.position', 'ui.bootstrap.s
if (!positionTimeout) {
positionTimeout = $timeout(function() {
var ttPosition = $position.positionElements(element, tooltip, ttScope.placement, appendToBody);
+ var initialHeight = angular.isDefined(tooltip.offsetHeight) ? tooltip.offsetHeight : tooltip.prop('offsetHeight');
+ var elementPos = appendToBody ? $position.offset(element) : $position.position(element);
tooltip.css({ top: ttPosition.top + 'px', left: ttPosition.left + 'px' });
+ var placementClasses = ttPosition.placement.split('-');
- if (!tooltip.hasClass(ttPosition.placement.split('-')[0])) {
+ if (!tooltip.hasClass(placementClasses[0])) {
tooltip.removeClass(lastPlacement.split('-')[0]);
- tooltip.addClass(ttPosition.placement.split('-')[0]);
+ tooltip.addClass(placementClasses[0]);
}
if (!tooltip.hasClass(options.placementClassPrefix + ttPosition.placement)) {
@@ -175,6 +178,13 @@ angular.module('ui.bootstrap.tooltip', ['ui.bootstrap.position', 'ui.bootstrap.s
tooltip.addClass(options.placementClassPrefix + ttPosition.placement);
}
+ $timeout(function() {
+ var currentHeight = angular.isDefined(tooltip.offsetHeight) ? tooltip.offsetHeight : tooltip.prop('offsetHeight');
+ if (placementClasses.indexOf('top') !== -1 && initialHeight !== currentHeight) {
+ tooltip.css({top: elementPos.top - currentHeight + 'px'});
+ }
+ }, 0, false);
+
// first time through tt element will have the
// uib-position-measure class or if the placement
// has changed we need to position the arrow.