diff --git a/tests/unit/tooltip/tooltip_options.js b/tests/unit/tooltip/tooltip_options.js index db193e8fa53..e5046f4648b 100644 --- a/tests/unit/tooltip/tooltip_options.js +++ b/tests/unit/tooltip/tooltip_options.js @@ -103,4 +103,39 @@ test( "tooltipClass", function() { ok( $( "#" + element.data( "ui-tooltip-id" ) ).hasClass( "custom" ) ); }); +test( "track + show delay", function() { + expect( 2 ); + var event, + leftVal = 314, + topVal = 159, + offsetVal = 26, + element = $( "#tooltipped1" ).tooltip({ + track: true, + show: { + delay: 1 + }, + position: { + my: "left+" + offsetVal + " top+" + offsetVal, + at: "right bottom" + } + }); + + event = $.Event( "mouseover" ); + event.target = $( "#tooltipped1" )[ 0 ]; + event.originalEvent = { type: "mouseover" }; + event.pageX = leftVal; + event.pageY = topVal; + element.trigger( event ); + + event = $.Event( "mousemove" ); + event.target = $( "#tooltipped1" )[ 0 ]; + event.originalEvent = { type: "mousemove" }; + event.pageX = leftVal; + event.pageY = topVal; + element.trigger( event ); + + equal( $( ".ui-tooltip" ).css( "left" ), leftVal + offsetVal + "px" ); + equal( $( ".ui-tooltip" ).css( "top" ), topVal + offsetVal + "px" ); +}); + }( jQuery ) ); diff --git a/tests/visual/tooltip/tooltip.html b/tests/visual/tooltip/tooltip.html index 97fa99bb949..598af0ee850 100644 --- a/tests/visual/tooltip/tooltip.html +++ b/tests/visual/tooltip/tooltip.html @@ -91,7 +91,12 @@ } }); - $( "#blurs-on-click" ).tooltip().click(function() { + $( "#blurs-on-click" ).tooltip({ + track: true, + show: { + delay: 500 + } + }).click(function() { $( "#focus-on-me" ).focus(); }); }); diff --git a/ui/jquery.ui.tooltip.js b/ui/jquery.ui.tooltip.js index 1be56c7ea35..a04b8428936 100644 --- a/ui/jquery.ui.tooltip.js +++ b/ui/jquery.ui.tooltip.js @@ -206,7 +206,8 @@ $.widget( "ui.tooltip", { }, _open: function( event, target, content ) { - var tooltip, positionOption, events; + var tooltip, events, delayedShow, + positionOption = $.extend( {}, this.options.position ); if ( !content ) { return; @@ -241,10 +242,12 @@ $.widget( "ui.tooltip", { function position( event ) { positionOption.of = event; + if ( tooltip.is( ":hidden" ) ) { + return; + } tooltip.position( positionOption ); } if ( this.options.track && event && /^mouse/.test( event.originalEvent.type ) ) { - positionOption = $.extend( {}, this.options.position ); this._on( this.document, { mousemove: position }); @@ -259,6 +262,17 @@ $.widget( "ui.tooltip", { tooltip.hide(); this._show( tooltip, this.options.show ); + // Handle tracking tooltips that are shown with a delay (#8644). As soon + // as the tooltip is visible, position the tooltip using the most recent + // event. + if ( this.options.show && this.options.show.delay ) { + delayedShow = setInterval(function() { + if ( tooltip.is( ":visible" ) ) { + position( positionOption.of ); + clearInterval( delayedShow ); + } + }, $.fx.interval ); + } this._trigger( "open", event, { tooltip: tooltip } );