aboutsummaryrefslogtreecommitdiffstats
path: root/tests/unit/autocomplete/options.js
diff options
context:
space:
mode:
Diffstat (limited to 'tests/unit/autocomplete/options.js')
-rw-r--r--tests/unit/autocomplete/options.js317
1 files changed, 317 insertions, 0 deletions
diff --git a/tests/unit/autocomplete/options.js b/tests/unit/autocomplete/options.js
new file mode 100644
index 000000000..a07a8d636
--- /dev/null
+++ b/tests/unit/autocomplete/options.js
@@ -0,0 +1,317 @@
+define( [
+ "jquery",
+ "ui/autocomplete"
+], function( $ ) {
+
+module( "autocomplete: options" );
+
+var data = [ "c++", "java", "php", "coldfusion", "javascript", "asp", "ruby",
+ "python", "c", "scala", "groovy", "haskell", "perl" ];
+
+test( "appendTo: null", function() {
+ expect( 1 );
+ var element = $( "#autocomplete" ).autocomplete();
+ equal( element.autocomplete( "widget" ).parent()[ 0 ], document.body,
+ "defaults to body" );
+ element.autocomplete( "destroy" );
+});
+
+test( "appendTo: explicit", function() {
+ expect( 6 );
+ var detached = $( "<div>" ),
+ element = $( "#autocomplete" );
+
+ element.autocomplete({
+ appendTo: ".autocomplete-wrap"
+ });
+ equal( element.autocomplete( "widget" ).parent()[ 0 ],
+ $( "#autocomplete-wrap1" )[ 0 ], "first found element" );
+ equal( $( "#autocomplete-wrap2 .ui-autocomplete" ).length, 0,
+ "only appends to one element" );
+ element.autocomplete( "destroy" );
+
+ element.autocomplete().autocomplete( "option", "appendTo", "#autocomplete-wrap1" );
+ equal( element.autocomplete( "widget" ).parent()[ 0 ],
+ $( "#autocomplete-wrap1" )[ 0 ], "modified after init" );
+ element.autocomplete( "destroy" );
+
+ element.autocomplete({
+ appendTo: detached
+ });
+ equal( element.autocomplete( "widget" ).parent()[ 0 ], detached[ 0 ],
+ "detached jQuery object" );
+ element.autocomplete( "destroy" );
+
+ element.autocomplete({
+ appendTo: detached[ 0 ]
+ });
+ equal( element.autocomplete( "widget" ).parent()[ 0 ], detached[ 0 ],
+ "detached DOM element" );
+ element.autocomplete( "destroy" );
+
+ element.autocomplete().autocomplete( "option", "appendTo", detached );
+ equal( element.autocomplete( "widget" ).parent()[ 0 ], detached[ 0 ],
+ "detached DOM element via option()" );
+ element.autocomplete( "destroy" );
+});
+
+test( "appendTo: ui-front", function() {
+ expect( 2 );
+ var element = $( "#autocomplete" );
+
+ $( "#autocomplete-wrap2" ).addClass( "ui-front" );
+ element.autocomplete();
+ equal( element.autocomplete( "widget" ).parent()[ 0 ],
+ $( "#autocomplete-wrap2" )[ 0 ], "null, inside .ui-front" );
+ element.autocomplete( "destroy" );
+
+ element.autocomplete({
+ appendTo: $()
+ });
+ equal( element.autocomplete( "widget" ).parent()[ 0 ],
+ $( "#autocomplete-wrap2" )[ 0 ], "empty jQuery object, inside .ui-front" );
+});
+
+function autoFocusTest( afValue, focusedLength ) {
+ var element = $( "#autocomplete" ).autocomplete({
+ autoFocus: afValue,
+ delay: 0,
+ source: data,
+ open: function() {
+ equal(
+ element.autocomplete( "widget" )
+ .find( ".ui-menu-item-wrapper.ui-state-active" )
+ .length,
+ focusedLength,
+ "first item is " + (afValue ? "" : "not") + " auto focused" );
+ start();
+ }
+ });
+ element.val( "ja" ).keydown();
+ stop();
+}
+
+test( "autoFocus: false", function() {
+ expect( 1 );
+ autoFocusTest( false, 0 );
+});
+
+test( "autoFocus: true", function() {
+ expect( 1 );
+ autoFocusTest( true, 1 );
+});
+
+asyncTest( "delay", function() {
+ expect( 2 );
+ var element = $( "#autocomplete" ).autocomplete({
+ source: data,
+ delay: 25
+ }),
+ menu = element.autocomplete( "widget" );
+ element.val( "ja" ).keydown();
+
+ ok( menu.is( ":hidden" ), "menu is closed immediately after search" );
+
+ setTimeout(function() {
+ ok( menu.is( ":visible" ), "menu is open after delay" );
+ start();
+ }, 50 );
+});
+
+asyncTest( "disabled", function( assert ) {
+ expect( 5 );
+ var element = $( "#autocomplete" ).autocomplete({
+ source: data,
+ delay: 0
+ }),
+ menu = element.autocomplete( "disable" ).autocomplete( "widget" );
+ element.val( "ja" ).keydown();
+
+ ok( menu.is( ":hidden" ) );
+
+ assert.lacksClasses( element, "ui-state-disabled" );
+ assert.hasClasses( menu, "ui-autocomplete-disabled" );
+ ok( !element.attr( "aria-disabled" ), "element doesn't get aria-disabled" );
+
+ setTimeout(function() {
+ ok( menu.is( ":hidden" ) );
+ start();
+ });
+});
+
+test( "minLength", function() {
+ expect( 2 );
+ var element = $( "#autocomplete" ).autocomplete({
+ source: data
+ }),
+ menu = element.autocomplete( "widget" );
+ element.autocomplete( "search", "" );
+ ok( menu.is( ":hidden" ), "blank not enough for minLength: 1" );
+
+ element.autocomplete( "option", "minLength", 0 );
+ element.autocomplete( "search", "" );
+ ok( menu.is( ":visible" ), "blank enough for minLength: 0" );
+});
+
+asyncTest( "minLength, exceed then drop below", function() {
+ expect( 4 );
+ var element = $( "#autocomplete" ).autocomplete({
+ minLength: 2,
+ source: function( req, res ) {
+ equal( req.term, "12", "correct search term" );
+ setTimeout(function() {
+ res([ "item" ]);
+ });
+ }
+ }),
+ menu = element.autocomplete( "widget" );
+
+ ok( menu.is( ":hidden" ), "menu is hidden before first search" );
+ element.autocomplete( "search", "12" );
+
+ ok( menu.is( ":hidden" ), "menu is hidden before second search" );
+ element.autocomplete( "search", "1" );
+
+ setTimeout(function() {
+ ok( menu.is( ":hidden" ), "menu is hidden after searches" );
+ start();
+ });
+});
+
+test( "minLength, exceed then drop below then exceed", function() {
+ expect( 3 );
+ var _res = [],
+ element = $( "#autocomplete" ).autocomplete({
+ minLength: 2,
+ source: function( req, res ) {
+ _res.push( res );
+ }
+ }),
+ menu = element.autocomplete( "widget" );
+
+ // trigger a valid search
+ ok( menu.is( ":hidden" ), "menu is hidden before first search" );
+ element.autocomplete( "search", "12" );
+
+ // trigger a search below the minLength, to turn on cancelSearch flag
+ ok( menu.is( ":hidden" ), "menu is hidden before second search" );
+ element.autocomplete( "search", "1" );
+
+ // trigger a valid search
+ element.autocomplete( "search", "13" );
+ // react as if the first search was cancelled (default ajax behavior)
+ _res[ 0 ]([]);
+ // react to second search
+ _res[ 1 ]([ "13" ]);
+
+ ok( menu.is( ":visible" ), "menu is visible after searches" );
+});
+
+test( "source, local string array", function() {
+ expect( 1 );
+ var element = $( "#autocomplete" ).autocomplete({
+ source: data
+ }),
+ menu = element.autocomplete( "widget" );
+ element.val( "ja" ).autocomplete( "search" );
+ equal( menu.find( ".ui-menu-item" ).text(), "javajavascript" );
+});
+
+function sourceTest( source, async ) {
+ var element = $( "#autocomplete" ).autocomplete({
+ source: source
+ }),
+ menu = element.autocomplete( "widget" );
+ function result() {
+ var items = menu.find( ".ui-menu-item" );
+ equal( items.length, 3, "Should find three results." );
+ deepEqual( items.eq( 0 ).data( "ui-autocomplete-item" ), {
+ label: "java",
+ value: "java"
+ });
+ deepEqual( items.eq( 1 ).data( "ui-autocomplete-item" ), {
+ label: "javascript",
+ value: "javascript"
+ });
+ deepEqual( items.eq( 2 ).data( "ui-autocomplete-item" ), {
+ label: "clojure",
+ value: "clojure"
+ });
+ element.autocomplete( "destroy" );
+ if ( async ) {
+ start();
+ }
+ }
+ if ( async ) {
+ stop();
+ $( document ).one( "ajaxStop", result );
+ }
+ element.val( "j" ).autocomplete( "search" );
+ if ( !async ) {
+ result();
+ }
+}
+
+test( "source, local object array, only labels", function() {
+ expect( 4 );
+ sourceTest([
+ { label: "java", value: null },
+ { label: "php", value: null },
+ { label: "coldfusion", value: "" },
+ { label: "javascript", value: "" },
+ { label: "clojure" }
+ ]);
+});
+
+test( "source, local object array, only values", function() {
+ expect( 4 );
+ sourceTest([
+ { value: "java", label: null },
+ { value: "php", label: null },
+ { value: "coldfusion", label: "" },
+ { value: "javascript", label: "" },
+ { value: "clojure" }
+ ]);
+});
+
+test( "source, url string with remote json string array", function() {
+ expect( 4 );
+ sourceTest( "remote_string_array.txt", true );
+});
+
+test( "source, url string with remote json object array, only value properties", function() {
+ expect( 4 );
+ sourceTest( "remote_object_array_values.txt", true );
+});
+
+test( "source, url string with remote json object array, only label properties", function() {
+ expect( 4 );
+ sourceTest( "remote_object_array_labels.txt", true );
+});
+
+test( "source, custom", function() {
+ expect( 5 );
+ sourceTest(function( request, response ) {
+ equal( request.term, "j" );
+ response([
+ "java",
+ { label: "javascript", value: null },
+ { value: "clojure", label: null }
+ ]);
+ });
+});
+
+test( "source, update after init", function() {
+ expect( 2 );
+ var element = $( "#autocomplete" ).autocomplete({
+ source: [ "java", "javascript", "haskell" ]
+ }),
+ menu = element.autocomplete( "widget" );
+ element.val( "ja" ).autocomplete( "search" );
+ equal( menu.find( ".ui-menu-item" ).text(), "javajavascript" );
+ element.autocomplete( "option", "source", [ "php", "asp" ] );
+ element.val( "ph" ).autocomplete( "search" );
+ equal( menu.find( ".ui-menu-item" ).text(), "php" );
+});
+
+} );