third-party/jquery-ui-1.10.2/tests/unit/autocomplete/autocomplete_core.js

   1 (function( $ ) {
   2
   3 module( "autocomplete: core" );
   4
   5 test( "prevent form submit on enter when menu is active", function() {
   6         expect( 2 );
   7         var event,
   8                 element = $( "#autocomplete" )
   9                         .autocomplete({
  10                                 source: [ "java", "javascript" ]
  11                         })
  12                         .val( "ja" )
  13                         .autocomplete( "search" ),
  14                 menu = element.autocomplete( "widget" );
  15
  16         event = $.Event( "keydown" );
  17         event.keyCode = $.ui.keyCode.DOWN;
  18         element.trigger( event );
  19         deepEqual( menu.find( ".ui-menu-item:has(.ui-state-focus)" ).length, 1, "menu item is active" );
  20
  21         event = $.Event( "keydown" );
  22         event.keyCode = $.ui.keyCode.ENTER;
  23         element.trigger( event );
  24         ok( event.isDefaultPrevented(), "default action is prevented" );
  25 });
  26
  27 test( "allow form submit on enter when menu is not active", function() {
  28         expect( 1 );
  29         var event,
  30                 element = $( "#autocomplete" )
  31                         .autocomplete({
  32                                 autoFocus: false,
  33                                 source: [ "java", "javascript" ]
  34                         })
  35                         .val( "ja" )
  36                         .autocomplete( "search" );
  37
  38         event = $.Event( "keydown" );
  39         event.keyCode = $.ui.keyCode.ENTER;
  40         element.trigger( event );
  41         ok( !event.isDefaultPrevented(), "default action is prevented" );
  42 });
  43
  44 (function() {
  45         test( "up arrow invokes search - input", function() {
  46                 arrowsInvokeSearch( "#autocomplete", true, true );
  47         });
  48
  49         test( "down arrow invokes search - input", function() {
  50                 arrowsInvokeSearch( "#autocomplete", false, true );
  51         });
  52
  53         test( "up arrow invokes search - textarea", function() {
  54                 arrowsInvokeSearch( "#autocomplete-textarea", true, false );
  55         });
  56
  57         test( "down arrow invokes search - textarea", function() {
  58                 arrowsInvokeSearch( "#autocomplete-textarea", false, false );
  59         });
  60
  61         test( "up arrow invokes search - contenteditable", function() {
  62                 arrowsInvokeSearch( "#autocomplete-contenteditable", true, false );
  63         });
  64
  65         test( "down arrow invokes search - contenteditable", function() {
  66                 arrowsInvokeSearch( "#autocomplete-contenteditable", false, false );
  67         });
  68
  69         test( "up arrow moves focus - input", function() {
  70                 arrowsMoveFocus( "#autocomplete", true );
  71         });
  72
  73         test( "down arrow moves focus - input", function() {
  74                 arrowsMoveFocus( "#autocomplete", false );
  75         });
  76
  77         test( "up arrow moves focus - textarea", function() {
  78                 arrowsMoveFocus( "#autocomplete-textarea", true );
  79         });
  80
  81         test( "down arrow moves focus - textarea", function() {
  82                 arrowsMoveFocus( "#autocomplete-textarea", false );
  83         });
  84
  85         test( "up arrow moves focus - contenteditable", function() {
  86                 arrowsMoveFocus( "#autocomplete-contenteditable", true );
  87         });
  88
  89         test( "down arrow moves focus - contenteditable", function() {
  90                 arrowsMoveFocus( "#autocomplete-contenteditable", false );
  91         });
  92
  93         function arrowsInvokeSearch( id, isKeyUp, shouldMove ) {
  94                 expect( 1 );
  95
  96                 var didMove = false,
  97                         element = $( id ).autocomplete({
  98                                 source: [ "a" ],
  99                                 delay: 0,
 100                                 minLength: 0
 101                         });
 102                 element.data( "ui-autocomplete" )._move = function() {
 103                         didMove = true;
 104                 };
 105                 element.simulate( "keydown", { keyCode: ( isKeyUp ? $.ui.keyCode.UP : $.ui.keyCode.DOWN ) } );
 106                 equal( didMove, shouldMove, "respond to arrow" );
 107         }
 108
 109         function arrowsMoveFocus( id, isKeyUp ) {
 110                 expect( 1 );
 111
 112                 var element = $( id ).autocomplete({
 113                                 source: [ "a" ],
 114                                 delay: 0,
 115                                 minLength: 0
 116                         });
 117                 element.data( "ui-autocomplete" )._move = function() {
 118                         ok( true, "repsond to arrow" );
 119                 };
 120                 element.autocomplete( "search" );
 121                 element.simulate( "keydown", { keyCode: ( isKeyUp ? $.ui.keyCode.UP : $.ui.keyCode.DOWN ) } );
 122         }
 123 })();
 124
 125 asyncTest( "handle race condition", function() {
 126         expect( 3 );
 127         var count = 0,
 128                 element = $( "#autocomplete" ).autocomplete({
 129                 source: function( request, response ) {
 130                         count++;
 131                         if ( request.term.length === 1 ) {
 132                                 equal( count, 1, "request with 1 character is first" );
 133                                 setTimeout(function() {
 134                                         response([ "one" ]);
 135                                         setTimeout( checkResults, 1 );
 136                                 }, 1 );
 137                                 return;
 138                         }
 139                         equal( count, 2, "request with 2 characters is second" );
 140                         response([ "two" ]);
 141                 }
 142         });
 143
 144         element.autocomplete( "search", "a" );
 145         element.autocomplete( "search", "ab" );
 146
 147         function checkResults() {
 148                 equal( element.autocomplete( "widget" ).find( ".ui-menu-item" ).text(), "two",
 149                         "correct results displayed" );
 150                 start();
 151         }
 152 });
 153
 154 test( "ARIA", function() {
 155         expect( 7 );
 156         var element = $( "#autocomplete" ).autocomplete({
 157                         source: [ "java", "javascript" ]
 158                 }),
 159                 liveRegion = element.data( "ui-autocomplete" ).liveRegion;
 160
 161         equal( liveRegion.text(), "", "Empty live region on create" );
 162
 163         element.autocomplete( "search", "j" );
 164         equal( liveRegion.text(), "2 results are available, use up and down arrow keys to navigate.",
 165                 "Live region for multiple values" );
 166
 167         element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
 168         equal( liveRegion.text(), "2 results are available, use up and down arrow keys to navigate.",
 169                 "Live region not changed on focus" );
 170
 171         element.one( "autocompletefocus", function( event ) {
 172                 event.preventDefault();
 173         });
 174         element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
 175         equal( liveRegion.text(), "javascript",
 176                 "Live region updated when default focus is prevented" );
 177
 178         element.autocomplete( "search", "javas" );
 179         equal( liveRegion.text(), "1 result is available, use up and down arrow keys to navigate.",
 180                 "Live region for one value" );
 181
 182         element.autocomplete( "search", "z" );
 183         equal( liveRegion.text(), "No search results.",
 184                 "Live region for no values" );
 185
 186         element.autocomplete( "search", "j" );
 187         equal( liveRegion.text(), "2 results are available, use up and down arrow keys to navigate.",
 188                 "Live region for multiple values" );
 189 });
 190
 191 }( jQuery ) );