Tooltip: Fixed handling of disabled tooltips.

Author: scottgonzalez

tests/unit/tooltip/tooltip_methods.js

@@ -28,6 +28,32 @@ test( "open/close", function() {
 	$.fx.off = false;
 });
 
+test( "enable/disable", function() {
+	expect( 7 );
+	$.fx.off = true;
+	var element = $( "#tooltipped1" ).tooltip();
+	equal( $( ".ui-tooltip" ).length, 0, "no tooltip on init" );
+
+	element.tooltip( "open" );
+	var tooltip = $( "#" + element.attr( "aria-describedby" ) );
+	ok( tooltip.is( ":visible" ) );
+
+	element.tooltip( "disable" );
+	equal( $( ".ui-tooltip" ).length, 0, "no tooltip when disabled" );
+	equal( tooltip.attr( "title" ), "", "title removed on disable" );
+
+	element.tooltip( "open" );
+	equal( $( ".ui-tooltip" ).length, 0, "open does nothing when disabled" );
+
+	element.tooltip( "enable" );
+	equal( element.attr( "title" ), "anchortitle", "title restored on enable" );
+
+	element.tooltip( "open" );
+	tooltip = $( "#" + element.attr( "aria-describedby" ) );
+	ok( tooltip.is( ":visible" ) );
+	$.fx.off = false;
+});
+
 /*
 TODO currently tooltip doesn't override widget
 can't return anything useful if no element is kept around and there's no useful reference

ui/jquery.ui.tooltip.js

@@ -42,14 +42,46 @@ $.widget( "ui.tooltip", {
 	},
 
 	_setOption: function( key, value ) {
-		// only set option, disable element style changes
 		if ( key === "disabled" ) {
+			this[ value ? "_disable" : "_enable" ]();
 			this.options[ key ] = value;
+			// disable element style changes
 			return;
 		}
 		this._super( "_setOption", key, value );
 	},
 
+	_disable: function() {
+		var that = this;
+
+		// close open tooltips
+		$.each( this.tooltips, function( id, element ) {
+			var event = $.Event( "blur" );
+			event.target = event.currentTarget = element[0];
+			that.close( event, true );
+		});
+
+		// remove title attributes to prevent native tooltips
+		this.element.find( this.options.items ).andSelf().each(function() {
+			var element = $( this );
+			if ( element.is( "[title]" ) ) {
+				element
+					.data( "tooltip-title", element.attr( "title" ) )
+					.attr( "title", "" );
+			}
+		});
+	},
+
+	_enable: function() {
+		// restore title attributes
+		this.element.find( this.options.items ).andSelf().each(function() {
+			var element = $( this );
+			if ( element.data( "tooltip-title" ) ) {
+				element.attr( "title", element.data( "tooltip-title" ) );
+			}
+		});
+	},
+
 	open: function( event ) {
 		var content,
 			that = this,
@@ -83,24 +115,17 @@ $.widget( "ui.tooltip", {
 		}
 
 		// if we have a title, clear it to prevent the native tooltip
-		// we do this before the disabled check to prevent native tooltips
-		// even when disabled
-		// TODO: the above doesn't work since ._bind() does a disabled check
 		// we have to check first to avoid defining a title if none exists
 		// (we don't want to cause an element to start matching [title])
 		// TODO: document why we don't use .removeAttr()
 		if ( target.is( "[title]" ) ) {
 			target.attr( "title", "" );
 		}
 
-		if ( this.options.disabled ) {
-			return;
-		}
-
 		// ajaxy tooltip can update an existing one
 		var tooltip = this._find( target );
 		if ( !tooltip.length ) {
-			tooltip = this._tooltip();
+			tooltip = this._tooltip( target );
 			target.attr( "aria-describedby", tooltip.attr( "id" ) );
 		}
 		tooltip.find( ".ui-tooltip-content" ).html( content );
@@ -124,22 +149,22 @@ $.widget( "ui.tooltip", {
 		});
 	},
 
-	close: function( event ) {
+	close: function( event, force ) {
 		var that = this,
 			target = $( event ? event.currentTarget : this.element ),
 			tooltip = this._find( target );
 
-		// only set title if we had one before (see comment in _open())
-		if ( target.data( "tooltip-title" ) ) {
-			target.attr( "title", target.data( "tooltip-title" ) );
-		}
-
 		// don't close if the element has focus
 		// this prevents the tooltip from closing if you hover while focused
-		if ( this.options.disabled || document.activeElement === target[0] ) {
+		if ( !force && document.activeElement === target[0] ) {
 			return;
 		}
 
+		// only set title if we had one before (see comment in _open())
+		if ( target.data( "tooltip-title" ) ) {
+			target.attr( "title", target.data( "tooltip-title" ) );
+		}
+
 		target.removeAttr( "aria-describedby" );
 
 		tooltip.stop( true );
@@ -153,7 +178,7 @@ $.widget( "ui.tooltip", {
 		this._trigger( "close", event );
 	},
 
-	_tooltip: function() {
+	_tooltip: function( element ) {
 		var id = "ui-tooltip-" + increments++,
 			tooltip = $( "<div>" )
 				.attr({
@@ -169,7 +194,7 @@ $.widget( "ui.tooltip", {
 		if ( $.fn.bgiframe ) {
 			tooltip.bgiframe();
 		}
-		this.tooltips[ id ] = true;
+		this.tooltips[ id ] = element;
 		return tooltip;
 	},