jquery-ui/tests/unit/tooltip/options.js

216 lines
5.7 KiB
JavaScript
Raw Normal View History

define( [
"jquery",
"ui/widgets/tooltip"
], function( $ ) {
2010-10-26 12:26:53 +00:00
2011-05-28 17:30:00 +00:00
module( "tooltip: options" );
test( "disabled: true", function() {
expect( 1 );
2015-08-24 12:50:46 +00:00
$( "#tooltipped1" ).tooltip( {
disabled: true
2015-08-24 12:50:46 +00:00
} ).tooltip( "open" );
equal( $( ".ui-tooltip" ).length, 0 );
2015-08-24 12:50:46 +00:00
} );
2011-05-28 17:30:00 +00:00
test( "content: default", function() {
expect( 1 );
2011-05-28 19:43:22 +00:00
var element = $( "#tooltipped1" ).tooltip().tooltip( "open" );
deepEqual( $( "#" + element.data( "ui-tooltip-id" ) ).text(), "anchortitle" );
2015-08-24 12:50:46 +00:00
} );
test( "content: default; HTML escaping", function() {
expect( 2 );
var scriptText = "<script>$.ui.tooltip.hacked = true;</script>",
element = $( "#tooltipped1" );
$.ui.tooltip.hacked = false;
element.attr( "title", scriptText )
.tooltip()
.tooltip( "open" );
equal( $.ui.tooltip.hacked, false, "script did not execute" );
deepEqual( $( "#" + element.data( "ui-tooltip-id" ) ).text(), scriptText,
"correct tooltip text" );
2015-08-24 12:50:46 +00:00
} );
2011-05-28 17:30:00 +00:00
test( "content: return string", function() {
expect( 1 );
2015-08-24 12:50:46 +00:00
var element = $( "#tooltipped1" ).tooltip( {
2010-10-26 12:26:53 +00:00
content: function() {
return "customstring";
}
2015-08-24 12:50:46 +00:00
} ).tooltip( "open" );
deepEqual( $( "#" + element.data( "ui-tooltip-id" ) ).text(), "customstring" );
2015-08-24 12:50:46 +00:00
} );
2010-10-26 12:26:53 +00:00
2011-05-28 17:30:00 +00:00
test( "content: return jQuery", function() {
expect( 2 );
2015-08-24 12:50:46 +00:00
var element = $( "#tooltipped1" ).tooltip( {
2010-10-26 13:36:43 +00:00
content: function() {
return $( "<div id='unique'>" ).html( "cu<b id='bold'>s</b>tomstring" );
2010-10-26 13:36:43 +00:00
}
2015-08-24 12:50:46 +00:00
} ).tooltip( "open" ),
liveRegion = element.tooltip( "instance" ).liveRegion;
deepEqual( $( "#" + element.data( "ui-tooltip-id" ) ).text(), "customstring" );
equal( liveRegion.children().last().html().toLowerCase(), "<div>cu<b>s</b>tomstring</div>",
"The accessibility live region will strip the ids but keep the structure" );
2015-08-24 12:50:46 +00:00
} );
2010-10-26 13:36:43 +00:00
asyncTest( "content: sync + async callback", function() {
expect( 2 );
2015-08-24 12:50:46 +00:00
var element = $( "#tooltipped1" ).tooltip( {
content: function( response ) {
2015-08-24 12:50:46 +00:00
setTimeout( function() {
deepEqual( $( "#" + element.data( "ui-tooltip-id" ) ).text(), "loading..." );
response( "customstring2" );
2015-08-24 12:50:46 +00:00
setTimeout( function() {
deepEqual( $( "#" + element.data( "ui-tooltip-id" ) ).text(), "customstring2" );
start();
}, 13 );
}, 13 );
return "loading...";
2010-10-26 12:26:53 +00:00
}
2015-08-24 12:50:46 +00:00
} ).tooltip( "open" );
} );
// http://bugs.jqueryui.com/ticket/8740
asyncTest( "content: async callback loses focus before load", function() {
expect( 1 );
2015-08-24 12:50:46 +00:00
var element = $( "#tooltipped1" ).tooltip( {
content: function( response ) {
2015-08-24 12:50:46 +00:00
setTimeout( function() {
element.trigger( "mouseleave" );
2015-08-24 12:50:46 +00:00
setTimeout( function() {
response( "sometext" );
2015-08-24 12:50:46 +00:00
setTimeout( function() {
ok( !$( "#" + element.data( "ui-tooltip-id" ) ).is( ":visible" ),
"Tooltip should not display" );
start();
2015-08-24 12:50:46 +00:00
} );
} );
} );
}
2015-08-24 12:50:46 +00:00
} );
element.trigger( "mouseover" );
2015-08-24 12:50:46 +00:00
} );
test( "content: change while open", function() {
expect( 2 ) ;
2015-08-24 12:50:46 +00:00
var element = $( "#tooltipped1" ).tooltip( {
content: function() {
return "old";
}
2015-08-24 12:50:46 +00:00
} );
element.one( "tooltipopen", function( event, ui ) {
equal( ui.tooltip.text(), "old", "original content" );
element.tooltip( "option", "content", function() {
return "new";
2015-08-24 12:50:46 +00:00
} );
equal( ui.tooltip.text(), "new", "updated content" );
2015-08-24 12:50:46 +00:00
} );
element.tooltip( "open" );
2015-08-24 12:50:46 +00:00
} );
test( "content: string", function() {
expect( 1 );
2015-08-24 12:50:46 +00:00
$( "#tooltipped1" ).tooltip( {
content: "just a string",
open: function( event, ui ) {
equal( ui.tooltip.text(), "just a string" );
}
2015-08-24 12:50:46 +00:00
} ).tooltip( "open" );
} );
test( "content: element", function() {
expect( 1 );
var content = "<p>this is a <i>test</i> of the emergency broadcast system.</p>",
element = $( content )[ 0 ];
2015-08-24 12:50:46 +00:00
$( "#tooltipped1" ).tooltip( {
content: element,
open: function( event, ui ) {
equal( ui.tooltip.children().html().toLowerCase(), content );
}
2015-08-24 12:50:46 +00:00
} ).tooltip( "open" );
} );
test( "content: jQuery", function() {
expect( 1 );
var content = "<p>this is a <i>test</i> of the emergency broadcast system.</p>",
element = $( content );
2015-08-24 12:50:46 +00:00
$( "#tooltipped1" ).tooltip( {
content: element,
open: function( event, ui ) {
equal( ui.tooltip.children().html().toLowerCase(), content );
}
2015-08-24 12:50:46 +00:00
} ).tooltip( "open" );
} );
test( "items", function() {
expect( 2 );
2012-04-19 02:36:15 +00:00
var event,
2015-08-24 12:50:46 +00:00
element = $( "#qunit-fixture" ).tooltip( {
2012-04-19 02:36:15 +00:00
items: "#fixture-span"
2015-08-24 12:50:46 +00:00
} );
2012-04-19 02:36:15 +00:00
event = $.Event( "mouseenter" );
event.target = $( "#fixture-span" )[ 0 ];
element.tooltip( "open", event );
deepEqual( $( "#" + $( "#fixture-span" ).data( "ui-tooltip-id" ) ).text(), "title-text" );
// Make sure default [title] doesn't get used
event.target = $( "#tooltipped1" )[ 0 ];
element.tooltip( "open", event );
deepEqual( $( "#tooltipped1" ).data( "ui-tooltip-id" ), undefined );
element.tooltip( "destroy" );
2015-08-24 12:50:46 +00:00
} );
test( "track + show delay", function() {
expect( 2 );
var event,
leftVal = 314,
topVal = 159,
offsetVal = 26,
2015-08-24 12:50:46 +00:00
element = $( "#tooltipped1" ).tooltip( {
track: true,
show: {
delay: 1
},
position: {
my: "left+" + offsetVal + " top+" + offsetVal,
at: "right bottom"
}
2015-08-24 12:50:46 +00:00
} );
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" );
2015-08-24 12:50:46 +00:00
} );
test( "track and programmatic focus", function() {
expect( 1 );
2015-08-24 12:50:46 +00:00
$( "#qunit-fixture div input" ).tooltip( {
track: true
2015-08-24 12:50:46 +00:00
} ).trigger( "focus" );
equal( "inputtitle", $( ".ui-tooltip" ).text() );
2015-08-24 12:50:46 +00:00
} );
} );