jquery-ui/tests/unit/autocomplete/events.js

186 lines
4.9 KiB
JavaScript
Raw Normal View History

define( [
"jquery",
"ui/autocomplete"
], function( $ ) {
2010-01-20 14:00:14 +00:00
2011-06-13 18:09:44 +00:00
module( "autocomplete: events" );
2010-01-20 14:00:14 +00:00
var data = [ "Clojure", "COBOL", "ColdFusion", "Java", "JavaScript", "Scala", "Scheme" ];
2010-01-20 14:00:14 +00:00
$.each([
{
type: "input",
selector: "#autocomplete",
valueMethod: "val"
},
{
type: "textarea",
selector: "#autocomplete-textarea",
valueMethod: "val"
},
{
type: "contenteditable",
selector: "#autocomplete-contenteditable",
valueMethod: "text"
}
], function( i, settings ) {
asyncTest( "all events - " + settings.type, function() {
expect( 13 );
var element = $( settings.selector )
.autocomplete({
autoFocus: false,
delay: 0,
source: data,
search: function( event ) {
equal( event.originalEvent.type, "keydown", "search originalEvent" );
},
response: function( event, ui ) {
deepEqual( ui.content, [
{ label: "Clojure", value: "Clojure" },
{ label: "Java", value: "Java" },
{ label: "JavaScript", value: "JavaScript" }
], "response ui.content" );
ui.content.splice( 0, 1 );
},
open: function() {
ok( menu.is( ":visible" ), "menu open on open" );
},
focus: function( event, ui ) {
equal( event.originalEvent.type, "menufocus", "focus originalEvent" );
deepEqual( ui.item, { label: "Java", value: "Java" }, "focus ui.item" );
},
close: function( event ) {
equal( event.originalEvent.type, "menuselect", "close originalEvent" );
ok( menu.is( ":hidden" ), "menu closed on close" );
},
select: function( event, ui ) {
equal( event.originalEvent.type, "menuselect", "select originalEvent" );
deepEqual( ui.item, { label: "Java", value: "Java" }, "select ui.item" );
},
change: function( event, ui ) {
equal( event.originalEvent.type, "blur", "change originalEvent" );
2011-11-01 20:26:31 +00:00
deepEqual( ui.item, { label: "Java", value: "Java" }, "change ui.item" );
ok( menu.is( ":hidden" ), "menu closed on change" );
start();
}
}),
menu = element.autocomplete( "widget" );
element.simulate( "focus" )[ settings.valueMethod ]( "j" ).trigger( "keydown" );
setTimeout(function() {
ok( menu.is( ":visible" ), "menu is visible after delay" );
element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
// blur must be async for IE to handle it properly
setTimeout(function() {
element.simulate( "blur" );
});
});
});
2010-01-20 14:00:14 +00:00
});
2011-06-13 18:09:44 +00:00
asyncTest( "change without selection", function() {
expect( 1 );
var element = $( "#autocomplete" ).autocomplete({
delay: 0,
source: data,
2011-06-13 18:09:44 +00:00
change: function( event, ui ) {
strictEqual( ui.item, null );
start();
}
});
2011-06-13 18:09:44 +00:00
element.triggerHandler( "focus" );
element.val( "ja" ).triggerHandler( "blur" );
});
2011-06-13 18:09:44 +00:00
asyncTest( "cancel search", function() {
expect( 6 );
var first = true,
element = $( "#autocomplete" ).autocomplete({
delay: 0,
source: data,
search: function() {
if ( first ) {
equal( element.val(), "ja", "val on first search" );
first = false;
return false;
}
equal( element.val(), "java", "val on second search" );
},
open: function() {
ok( true, "menu opened" );
2010-01-20 14:00:14 +00:00
}
2011-06-13 18:09:44 +00:00
}),
menu = element.autocomplete( "widget" );
element.val( "ja" ).trigger( "keydown" );
2010-01-20 14:00:14 +00:00
setTimeout(function() {
2011-06-13 18:09:44 +00:00
ok( menu.is( ":hidden" ), "menu is hidden after first search" );
element.val( "java" ).trigger( "keydown" );
2010-01-20 14:00:14 +00:00
setTimeout(function() {
2011-06-13 18:09:44 +00:00
ok( menu.is( ":visible" ), "menu is visible after second search" );
equal( menu.find( ".ui-menu-item" ).length, 2, "# of menu items" );
2010-01-20 14:00:14 +00:00
start();
});
});
2010-01-20 14:00:14 +00:00
});
2011-06-13 18:09:44 +00:00
asyncTest( "cancel focus", function() {
expect( 1 );
2012-04-19 14:50:09 +00:00
var customVal = "custom value",
2011-06-13 18:09:44 +00:00
element = $( "#autocomplete" ).autocomplete({
delay: 0,
source: data,
focus: function() {
2011-06-13 18:09:44 +00:00
$( this ).val( customVal );
return false;
}
});
element.val( "ja" ).trigger( "keydown" );
2010-01-20 14:00:14 +00:00
setTimeout(function() {
2011-06-13 18:09:44 +00:00
element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
equal( element.val(), customVal );
2010-01-20 14:00:14 +00:00
start();
});
2010-01-20 14:00:14 +00:00
});
2011-06-13 18:09:44 +00:00
asyncTest( "cancel select", function() {
expect( 1 );
var customVal = "custom value",
element = $( "#autocomplete" ).autocomplete({
delay: 0,
source: data,
select: function() {
2011-06-13 18:09:44 +00:00
$( this ).val( customVal );
return false;
}
});
element.val( "ja" ).trigger( "keydown" );
2010-01-20 14:00:14 +00:00
setTimeout(function() {
2011-06-13 18:09:44 +00:00
element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
equal( element.val(), customVal );
2010-01-20 14:00:14 +00:00
start();
});
2010-01-20 14:00:14 +00:00
});
asyncTest( "blur during remote search", function() {
expect( 1 );
var ac = $( "#autocomplete" ).autocomplete({
delay: 0,
source: function( request, response ) {
ok( true, "trigger request" );
ac.simulate( "blur" );
setTimeout(function() {
response([ "result" ]);
start();
}, 25);
},
open: function() {
ok( false, "opened after a blur" );
}
});
ac.val( "ro" ).trigger( "keydown" );
});
} );