2015-04-07 00:28:55 +00:00
|
|
|
define( [
|
2016-04-06 13:59:12 +00:00
|
|
|
"qunit",
|
2015-04-07 00:28:55 +00:00
|
|
|
"jquery",
|
2020-05-16 07:16:24 +00:00
|
|
|
"./helper",
|
2015-07-15 02:12:14 +00:00
|
|
|
"ui/widgets/tooltip"
|
2020-05-16 07:16:24 +00:00
|
|
|
], function( QUnit, $, testHelper ) {
|
2021-06-06 22:58:12 +00:00
|
|
|
"use strict";
|
2010-10-26 12:26:53 +00:00
|
|
|
|
2020-05-16 07:16:24 +00:00
|
|
|
var beforeAfterEach = testHelper.beforeAfterEach;
|
|
|
|
|
|
|
|
QUnit.module( "tooltip: options", beforeAfterEach() );
|
2010-10-26 15:07:22 +00:00
|
|
|
|
2016-04-06 13:59:12 +00:00
|
|
|
QUnit.test( "disabled: true", function( assert ) {
|
|
|
|
assert.expect( 1 );
|
2015-08-24 12:50:46 +00:00
|
|
|
$( "#tooltipped1" ).tooltip( {
|
2012-10-24 14:00:39 +00:00
|
|
|
disabled: true
|
2015-08-24 12:50:46 +00:00
|
|
|
} ).tooltip( "open" );
|
2016-04-06 13:59:12 +00:00
|
|
|
assert.equal( $( ".ui-tooltip" ).length, 0 );
|
2015-08-24 12:50:46 +00:00
|
|
|
} );
|
2012-10-24 14:00:39 +00:00
|
|
|
|
2016-04-06 13:59:12 +00:00
|
|
|
QUnit.test( "content: default", function( assert ) {
|
|
|
|
assert.expect( 1 );
|
2011-05-28 19:43:22 +00:00
|
|
|
var element = $( "#tooltipped1" ).tooltip().tooltip( "open" );
|
2016-04-06 13:59:12 +00:00
|
|
|
assert.deepEqual( $( "#" + element.data( "ui-tooltip-id" ) ).text(), "anchortitle" );
|
2015-08-24 12:50:46 +00:00
|
|
|
} );
|
2010-04-15 07:45:35 +00:00
|
|
|
|
2016-04-06 13:59:12 +00:00
|
|
|
QUnit.test( "content: default; HTML escaping", function( assert ) {
|
|
|
|
assert.expect( 2 );
|
2012-11-27 16:21:33 +00:00
|
|
|
var scriptText = "<script>$.ui.tooltip.hacked = true;</script>",
|
|
|
|
element = $( "#tooltipped1" );
|
|
|
|
|
|
|
|
$.ui.tooltip.hacked = false;
|
|
|
|
element.attr( "title", scriptText )
|
|
|
|
.tooltip()
|
|
|
|
.tooltip( "open" );
|
2016-04-06 13:59:12 +00:00
|
|
|
assert.equal( $.ui.tooltip.hacked, false, "script did not execute" );
|
|
|
|
assert.deepEqual( $( "#" + element.data( "ui-tooltip-id" ) ).text(), scriptText,
|
2012-11-27 16:21:33 +00:00
|
|
|
"correct tooltip text" );
|
2015-08-24 12:50:46 +00:00
|
|
|
} );
|
2012-11-27 16:21:33 +00:00
|
|
|
|
2016-04-06 13:59:12 +00:00
|
|
|
QUnit.test( "content: return string", function( assert ) {
|
|
|
|
assert.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" );
|
2016-04-06 13:59:12 +00:00
|
|
|
assert.deepEqual( $( "#" + element.data( "ui-tooltip-id" ) ).text(), "customstring" );
|
2015-08-24 12:50:46 +00:00
|
|
|
} );
|
2010-10-26 12:26:53 +00:00
|
|
|
|
2016-04-06 13:59:12 +00:00
|
|
|
QUnit.test( "content: return jQuery", function( assert ) {
|
|
|
|
assert.expect( 2 );
|
2015-08-24 12:50:46 +00:00
|
|
|
var element = $( "#tooltipped1" ).tooltip( {
|
2010-10-26 13:36:43 +00:00
|
|
|
content: function() {
|
2013-10-26 15:31:07 +00:00
|
|
|
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" ),
|
2013-10-26 15:31:07 +00:00
|
|
|
liveRegion = element.tooltip( "instance" ).liveRegion;
|
2016-04-06 13:59:12 +00:00
|
|
|
assert.deepEqual( $( "#" + element.data( "ui-tooltip-id" ) ).text(), "customstring" );
|
|
|
|
assert.equal( liveRegion.children().last().html().toLowerCase(), "<div>cu<b>s</b>tomstring</div>",
|
2013-10-26 15:31:07 +00:00
|
|
|
"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
|
|
|
|
2016-04-06 13:59:12 +00:00
|
|
|
QUnit.test( "content: sync + async callback", function( assert ) {
|
|
|
|
var ready = assert.async();
|
|
|
|
assert.expect( 2 );
|
2015-08-24 12:50:46 +00:00
|
|
|
var element = $( "#tooltipped1" ).tooltip( {
|
2011-05-28 21:36:57 +00:00
|
|
|
content: function( response ) {
|
2015-08-24 12:50:46 +00:00
|
|
|
setTimeout( function() {
|
2016-04-06 13:59:12 +00:00
|
|
|
assert.deepEqual( $( "#" + element.data( "ui-tooltip-id" ) ).text(), "loading..." );
|
2011-05-28 21:36:57 +00:00
|
|
|
|
|
|
|
response( "customstring2" );
|
2015-08-24 12:50:46 +00:00
|
|
|
setTimeout( function() {
|
2016-04-06 13:59:12 +00:00
|
|
|
assert.deepEqual( $( "#" + element.data( "ui-tooltip-id" ) ).text(), "customstring2" );
|
|
|
|
ready();
|
2011-05-28 21:36:57 +00:00
|
|
|
}, 13 );
|
|
|
|
}, 13 );
|
|
|
|
return "loading...";
|
2010-10-26 12:26:53 +00:00
|
|
|
}
|
2015-08-24 12:50:46 +00:00
|
|
|
} ).tooltip( "open" );
|
|
|
|
} );
|
2010-04-15 07:45:35 +00:00
|
|
|
|
2015-02-24 00:33:01 +00:00
|
|
|
// http://bugs.jqueryui.com/ticket/8740
|
2016-04-06 13:59:12 +00:00
|
|
|
QUnit.test( "content: async callback loses focus before load", function( assert ) {
|
|
|
|
var ready = assert.async();
|
|
|
|
assert.expect( 1 );
|
2015-02-24 00:33:01 +00:00
|
|
|
|
2015-08-24 12:50:46 +00:00
|
|
|
var element = $( "#tooltipped1" ).tooltip( {
|
2015-02-24 00:33:01 +00:00
|
|
|
content: function( response ) {
|
2015-08-24 12:50:46 +00:00
|
|
|
setTimeout( function() {
|
2015-02-24 00:33:01 +00:00
|
|
|
element.trigger( "mouseleave" );
|
2015-08-24 12:50:46 +00:00
|
|
|
setTimeout( function() {
|
2015-02-24 00:33:01 +00:00
|
|
|
response( "sometext" );
|
2015-08-24 12:50:46 +00:00
|
|
|
setTimeout( function() {
|
2016-04-06 13:59:12 +00:00
|
|
|
assert.ok( !$( "#" + element.data( "ui-tooltip-id" ) ).is( ":visible" ),
|
2015-02-24 00:33:01 +00:00
|
|
|
"Tooltip should not display" );
|
2016-04-06 13:59:12 +00:00
|
|
|
ready();
|
2015-08-24 12:50:46 +00:00
|
|
|
} );
|
|
|
|
} );
|
|
|
|
} );
|
2015-02-24 00:33:01 +00:00
|
|
|
}
|
2015-08-24 12:50:46 +00:00
|
|
|
} );
|
2015-02-24 00:33:01 +00:00
|
|
|
element.trigger( "mouseover" );
|
2015-08-24 12:50:46 +00:00
|
|
|
} );
|
2015-02-24 00:33:01 +00:00
|
|
|
|
2016-04-06 13:59:12 +00:00
|
|
|
QUnit.test( "content: change while open", function( assert ) {
|
2021-06-06 22:58:12 +00:00
|
|
|
assert.expect( 2 );
|
2015-08-24 12:50:46 +00:00
|
|
|
var element = $( "#tooltipped1" ).tooltip( {
|
2012-08-31 19:38:21 +00:00
|
|
|
content: function() {
|
|
|
|
return "old";
|
|
|
|
}
|
2015-08-24 12:50:46 +00:00
|
|
|
} );
|
2012-08-31 19:38:21 +00:00
|
|
|
|
|
|
|
element.one( "tooltipopen", function( event, ui ) {
|
2016-04-06 13:59:12 +00:00
|
|
|
assert.equal( ui.tooltip.text(), "old", "original content" );
|
2012-08-31 19:38:21 +00:00
|
|
|
element.tooltip( "option", "content", function() {
|
|
|
|
return "new";
|
2015-08-24 12:50:46 +00:00
|
|
|
} );
|
2016-04-06 13:59:12 +00:00
|
|
|
assert.equal( ui.tooltip.text(), "new", "updated content" );
|
2015-08-24 12:50:46 +00:00
|
|
|
} );
|
2012-08-31 19:38:21 +00:00
|
|
|
|
|
|
|
element.tooltip( "open" );
|
2015-08-24 12:50:46 +00:00
|
|
|
} );
|
2012-08-31 19:38:21 +00:00
|
|
|
|
2016-04-06 13:59:12 +00:00
|
|
|
QUnit.test( "content: string", function( assert ) {
|
|
|
|
assert.expect( 1 );
|
2015-08-24 12:50:46 +00:00
|
|
|
$( "#tooltipped1" ).tooltip( {
|
2012-08-31 19:41:45 +00:00
|
|
|
content: "just a string",
|
|
|
|
open: function( event, ui ) {
|
2016-04-06 13:59:12 +00:00
|
|
|
assert.equal( ui.tooltip.text(), "just a string" );
|
2012-08-31 19:41:45 +00:00
|
|
|
}
|
2015-08-24 12:50:46 +00:00
|
|
|
} ).tooltip( "open" );
|
|
|
|
} );
|
2012-08-31 19:41:45 +00:00
|
|
|
|
2016-04-06 13:59:12 +00:00
|
|
|
QUnit.test( "content: element", function( assert ) {
|
|
|
|
assert.expect( 1 );
|
2013-05-08 17:15:44 +00:00
|
|
|
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( {
|
2013-05-08 17:15:44 +00:00
|
|
|
content: element,
|
|
|
|
open: function( event, ui ) {
|
2016-04-06 13:59:12 +00:00
|
|
|
assert.equal( ui.tooltip.children().html().toLowerCase(), content );
|
2013-05-08 17:15:44 +00:00
|
|
|
}
|
2015-08-24 12:50:46 +00:00
|
|
|
} ).tooltip( "open" );
|
|
|
|
} );
|
2013-05-08 17:15:44 +00:00
|
|
|
|
2016-04-06 13:59:12 +00:00
|
|
|
QUnit.test( "content: jQuery", function( assert ) {
|
|
|
|
assert.expect( 1 );
|
2013-05-08 17:15:44 +00:00
|
|
|
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( {
|
2013-05-08 17:15:44 +00:00
|
|
|
content: element,
|
|
|
|
open: function( event, ui ) {
|
2016-04-06 13:59:12 +00:00
|
|
|
assert.equal( ui.tooltip.children().html().toLowerCase(), content );
|
2013-05-08 17:15:44 +00:00
|
|
|
}
|
2015-08-24 12:50:46 +00:00
|
|
|
} ).tooltip( "open" );
|
|
|
|
} );
|
2013-05-08 17:15:44 +00:00
|
|
|
|
2016-04-06 13:59:12 +00:00
|
|
|
QUnit.test( "items", function( assert ) {
|
|
|
|
assert.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
|
|
|
} );
|
2011-05-28 21:55:45 +00:00
|
|
|
|
2012-04-19 02:36:15 +00:00
|
|
|
event = $.Event( "mouseenter" );
|
2011-05-28 21:55:45 +00:00
|
|
|
event.target = $( "#fixture-span" )[ 0 ];
|
|
|
|
element.tooltip( "open", event );
|
2016-04-06 13:59:12 +00:00
|
|
|
assert.deepEqual( $( "#" + $( "#fixture-span" ).data( "ui-tooltip-id" ) ).text(), "title-text" );
|
2011-05-28 21:55:45 +00:00
|
|
|
|
2015-08-21 04:04:13 +00:00
|
|
|
// Make sure default [title] doesn't get used
|
2011-05-28 21:55:45 +00:00
|
|
|
event.target = $( "#tooltipped1" )[ 0 ];
|
|
|
|
element.tooltip( "open", event );
|
2016-04-06 13:59:12 +00:00
|
|
|
assert.deepEqual( $( "#tooltipped1" ).data( "ui-tooltip-id" ), undefined );
|
2011-05-28 21:55:45 +00:00
|
|
|
|
|
|
|
element.tooltip( "destroy" );
|
2015-08-24 12:50:46 +00:00
|
|
|
} );
|
2011-05-28 21:55:45 +00:00
|
|
|
|
2016-04-06 13:59:12 +00:00
|
|
|
QUnit.test( "track + show delay", function( assert ) {
|
|
|
|
assert.expect( 2 );
|
2012-10-16 16:55:50 +00:00
|
|
|
var event,
|
|
|
|
leftVal = 314,
|
|
|
|
topVal = 159,
|
|
|
|
offsetVal = 26,
|
2015-08-24 12:50:46 +00:00
|
|
|
element = $( "#tooltipped1" ).tooltip( {
|
2012-10-16 16:55:50 +00:00
|
|
|
track: true,
|
|
|
|
show: {
|
|
|
|
delay: 1
|
|
|
|
},
|
|
|
|
position: {
|
|
|
|
my: "left+" + offsetVal + " top+" + offsetVal,
|
|
|
|
at: "right bottom"
|
|
|
|
}
|
2015-08-24 12:50:46 +00:00
|
|
|
} );
|
2012-10-16 16:55:50 +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 );
|
|
|
|
|
2016-07-06 20:39:05 +00:00
|
|
|
assert.close(
|
|
|
|
parseFloat( $( ".ui-tooltip" ).css( "left" ) ),
|
|
|
|
leftVal + offsetVal, 0.5,
|
|
|
|
"left position"
|
|
|
|
);
|
|
|
|
assert.close(
|
|
|
|
parseFloat( $( ".ui-tooltip" ).css( "top" ) ),
|
|
|
|
topVal + offsetVal, 0.5,
|
|
|
|
"top position"
|
|
|
|
);
|
2015-08-24 12:50:46 +00:00
|
|
|
} );
|
2012-10-16 16:55:50 +00:00
|
|
|
|
2016-04-06 13:59:12 +00:00
|
|
|
QUnit.test( "track and programmatic focus", function( assert ) {
|
|
|
|
assert.expect( 1 );
|
2015-08-24 12:50:46 +00:00
|
|
|
$( "#qunit-fixture div input" ).tooltip( {
|
2012-11-05 17:59:52 +00:00
|
|
|
track: true
|
2015-08-24 12:50:46 +00:00
|
|
|
} ).trigger( "focus" );
|
2016-04-06 13:59:12 +00:00
|
|
|
assert.equal( "inputtitle", $( ".ui-tooltip" ).text() );
|
2015-08-24 12:50:46 +00:00
|
|
|
} );
|
2012-11-05 17:59:52 +00:00
|
|
|
|
2015-04-07 00:28:55 +00:00
|
|
|
} );
|