diff --git a/tests/unit/autocomplete/core.js b/tests/unit/autocomplete/core.js index e252970ee..33ccb2f34 100644 --- a/tests/unit/autocomplete/core.js +++ b/tests/unit/autocomplete/core.js @@ -1,12 +1,13 @@ define( [ + "qunit", "jquery", "ui/widgets/autocomplete" -], function( $ ) { +], function( QUnit, $ ) { -module( "autocomplete: core" ); +QUnit.module( "autocomplete: core" ); -test( "markup structure", function( assert ) { - expect( 2 ); +QUnit.test( "markup structure", function( assert ) { + assert.expect( 2 ); var element = $( "#autocomplete" ).autocomplete(), menu = element.autocomplete( "widget" ); @@ -14,8 +15,8 @@ test( "markup structure", function( assert ) { assert.hasClasses( menu, "ui-autocomplete ui-widget ui-widget-content" ); } ); -test( "prevent form submit on enter when menu is active", function() { - expect( 2 ); +QUnit.test( "prevent form submit on enter when menu is active", function( assert ) { + assert.expect( 2 ); var event, element = $( "#autocomplete" ) .autocomplete( { @@ -28,17 +29,17 @@ test( "prevent form submit on enter when menu is active", function() { event = $.Event( "keydown" ); event.keyCode = $.ui.keyCode.DOWN; element.trigger( event ); - equal( menu.find( ".ui-menu-item-wrapper.ui-state-active" ).length, 1, + assert.equal( menu.find( ".ui-menu-item-wrapper.ui-state-active" ).length, 1, "menu item is active" ); event = $.Event( "keydown" ); event.keyCode = $.ui.keyCode.ENTER; element.trigger( event ); - ok( event.isDefaultPrevented(), "default action is prevented" ); + assert.ok( event.isDefaultPrevented(), "default action is prevented" ); } ); -test( "allow form submit on enter when menu is not active", function() { - expect( 1 ); +QUnit.test( "allow form submit on enter when menu is not active", function( assert ) { + assert.expect( 1 ); var event, element = $( "#autocomplete" ) .autocomplete( { @@ -51,84 +52,84 @@ test( "allow form submit on enter when menu is not active", function() { event = $.Event( "keydown" ); event.keyCode = $.ui.keyCode.ENTER; element.trigger( event ); - ok( !event.isDefaultPrevented(), "default action is prevented" ); + assert.ok( !event.isDefaultPrevented(), "default action is prevented" ); } ); ( function() { - test( "up arrow invokes search - input", function() { - arrowsInvokeSearch( "#autocomplete", true, true ); + QUnit.test( "up arrow invokes search - input", function( assert ) { + arrowsInvokeSearch( assert, "#autocomplete", true, true ); } ); - test( "down arrow invokes search - input", function() { - arrowsInvokeSearch( "#autocomplete", false, true ); + QUnit.test( "down arrow invokes search - input", function( assert ) { + arrowsInvokeSearch( assert, "#autocomplete", false, true ); } ); - test( "up arrow invokes search - textarea", function() { - arrowsInvokeSearch( "#autocomplete-textarea", true, false ); + QUnit.test( "up arrow invokes search - textarea", function( assert ) { + arrowsInvokeSearch( assert, "#autocomplete-textarea", true, false ); } ); - test( "down arrow invokes search - textarea", function() { - arrowsInvokeSearch( "#autocomplete-textarea", false, false ); + QUnit.test( "down arrow invokes search - textarea", function( assert ) { + arrowsInvokeSearch( assert, "#autocomplete-textarea", false, false ); } ); - test( "up arrow invokes search - contenteditable", function() { - arrowsInvokeSearch( "#autocomplete-contenteditable", true, false ); + QUnit.test( "up arrow invokes search - contenteditable", function( assert ) { + arrowsInvokeSearch( assert, "#autocomplete-contenteditable", true, false ); } ); - test( "down arrow invokes search - contenteditable", function() { - arrowsInvokeSearch( "#autocomplete-contenteditable", false, false ); + QUnit.test( "down arrow invokes search - contenteditable", function( assert ) { + arrowsInvokeSearch( assert, "#autocomplete-contenteditable", false, false ); } ); - test( "up arrow moves focus - input", function() { - arrowsMoveFocus( "#autocomplete", true ); + QUnit.test( "up arrow moves focus - input", function( assert ) { + arrowsMoveFocus( assert, "#autocomplete", true ); } ); - test( "down arrow moves focus - input", function() { - arrowsMoveFocus( "#autocomplete", false ); + QUnit.test( "down arrow moves focus - input", function( assert ) { + arrowsMoveFocus( assert, "#autocomplete", false ); } ); - test( "up arrow moves focus - textarea", function() { - arrowsMoveFocus( "#autocomplete-textarea", true ); + QUnit.test( "up arrow moves focus - textarea", function( assert ) { + arrowsMoveFocus( assert, "#autocomplete-textarea", true ); } ); - test( "down arrow moves focus - textarea", function() { - arrowsMoveFocus( "#autocomplete-textarea", false ); + QUnit.test( "down arrow moves focus - textarea", function( assert ) { + arrowsMoveFocus( assert, "#autocomplete-textarea", false ); } ); - test( "up arrow moves focus - contenteditable", function() { - arrowsMoveFocus( "#autocomplete-contenteditable", true ); + QUnit.test( "up arrow moves focus - contenteditable", function( assert ) { + arrowsMoveFocus( assert, "#autocomplete-contenteditable", true ); } ); - test( "down arrow moves focus - contenteditable", function() { - arrowsMoveFocus( "#autocomplete-contenteditable", false ); + QUnit.test( "down arrow moves focus - contenteditable", function( assert ) { + arrowsMoveFocus( assert, "#autocomplete-contenteditable", false ); } ); - test( "up arrow moves cursor - input", function() { - arrowsNavigateElement( "#autocomplete", true, false ); + QUnit.test( "up arrow moves cursor - input", function( assert ) { + arrowsNavigateElement( assert, "#autocomplete", true, false ); } ); - test( "down arrow moves cursor - input", function() { - arrowsNavigateElement( "#autocomplete", false, false ); + QUnit.test( "down arrow moves cursor - input", function( assert ) { + arrowsNavigateElement( assert, "#autocomplete", false, false ); } ); - test( "up arrow moves cursor - textarea", function() { - arrowsNavigateElement( "#autocomplete-textarea", true, true ); + QUnit.test( "up arrow moves cursor - textarea", function( assert ) { + arrowsNavigateElement( assert, "#autocomplete-textarea", true, true ); } ); - test( "down arrow moves cursor - textarea", function() { - arrowsNavigateElement( "#autocomplete-textarea", false, true ); + QUnit.test( "down arrow moves cursor - textarea", function( assert ) { + arrowsNavigateElement( assert, "#autocomplete-textarea", false, true ); } ); - test( "up arrow moves cursor - contenteditable", function() { - arrowsNavigateElement( "#autocomplete-contenteditable", true, true ); + QUnit.test( "up arrow moves cursor - contenteditable", function( assert ) { + arrowsNavigateElement( assert, "#autocomplete-contenteditable", true, true ); } ); - test( "down arrow moves cursor - contenteditable", function() { - arrowsNavigateElement( "#autocomplete-contenteditable", false, true ); + QUnit.test( "down arrow moves cursor - contenteditable", function( assert ) { + arrowsNavigateElement( assert, "#autocomplete-contenteditable", false, true ); } ); - function arrowsInvokeSearch( id, isKeyUp, shouldMove ) { - expect( 1 ); + function arrowsInvokeSearch( assert, id, isKeyUp, shouldMove ) { + assert.expect( 1 ); var didMove = false, element = $( id ).autocomplete( { @@ -140,11 +141,11 @@ test( "allow form submit on enter when menu is not active", function() { didMove = true; }; element.simulate( "keydown", { keyCode: ( isKeyUp ? $.ui.keyCode.UP : $.ui.keyCode.DOWN ) } ); - equal( didMove, shouldMove, "respond to arrow" ); + assert.equal( didMove, shouldMove, "respond to arrow" ); } - function arrowsMoveFocus( id, isKeyUp ) { - expect( 1 ); + function arrowsMoveFocus( assert, id, isKeyUp ) { + assert.expect( 1 ); var element = $( id ).autocomplete( { source: [ "a" ], @@ -152,14 +153,14 @@ test( "allow form submit on enter when menu is not active", function() { minLength: 0 } ); element.autocomplete( "instance" )._move = function() { - ok( true, "repsond to arrow" ); + assert.ok( true, "repsond to arrow" ); }; element.autocomplete( "search" ); element.simulate( "keydown", { keyCode: ( isKeyUp ? $.ui.keyCode.UP : $.ui.keyCode.DOWN ) } ); } - function arrowsNavigateElement( id, isKeyUp, shouldMove ) { - expect( 1 ); + function arrowsNavigateElement( assert, id, isKeyUp, shouldMove ) { + assert.expect( 1 ); var didMove = false, element = $( id ).autocomplete( { @@ -172,19 +173,20 @@ test( "allow form submit on enter when menu is not active", function() { } ); element.simulate( "keydown", { keyCode: ( isKeyUp ? $.ui.keyCode.UP : $.ui.keyCode.DOWN ) } ); element.simulate( "keypress" ); - equal( didMove, shouldMove, "respond to arrow" ); + assert.equal( didMove, shouldMove, "respond to arrow" ); } } )(); -asyncTest( "past end of menu in multiline autocomplete", function() { - expect( 2 ); +QUnit.test( "past end of menu in multiline autocomplete", function( assert ) { + var ready = assert.async(); + assert.expect( 2 ); var customVal = "custom value", element = $( "#autocomplete-contenteditable" ).autocomplete( { delay: 0, source: [ "javascript" ], focus: function( event, ui ) { - equal( ui.item.value, "javascript", "Item gained focus" ); + assert.equal( ui.item.value, "javascript", "Item gained focus" ); $( this ).text( customVal ); event.preventDefault(); } @@ -197,20 +199,21 @@ asyncTest( "past end of menu in multiline autocomplete", function() { setTimeout( function() { element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - equal( element.text(), customVal ); - start(); + assert.equal( element.text(), customVal ); + ready(); } ); } ); -asyncTest( "ESCAPE in multiline autocomplete", function() { - expect( 2 ); +QUnit.test( "ESCAPE in multiline autocomplete", function( assert ) { + var ready = assert.async(); + assert.expect( 2 ); var customVal = "custom value", element = $( "#autocomplete-contenteditable" ).autocomplete( { delay: 0, source: [ "javascript" ], focus: function( event, ui ) { - equal( ui.item.value, "javascript", "Item gained focus" ); + assert.equal( ui.item.value, "javascript", "Item gained focus" ); $( this ).text( customVal ); event.preventDefault(); } @@ -223,26 +226,27 @@ asyncTest( "ESCAPE in multiline autocomplete", function() { setTimeout( function() { element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); element.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE } ); - equal( element.text(), customVal ); - start(); + assert.equal( element.text(), customVal ); + ready(); } ); } ); -asyncTest( "handle race condition", function() { - expect( 3 ); +QUnit.test( "handle race condition", function( assert ) { + var ready = assert.async(); + assert.expect( 3 ); var count = 0, element = $( "#autocomplete" ).autocomplete( { source: function( request, response ) { count++; if ( request.term.length === 1 ) { - equal( count, 1, "request with 1 character is first" ); + assert.equal( count, 1, "request with 1 character is first" ); setTimeout( function() { response( [ "one" ] ); setTimeout( checkResults ); } ); return; } - equal( count, 2, "request with 2 characters is second" ); + assert.equal( count, 2, "request with 2 characters is second" ); response( [ "two" ] ); } } ); @@ -251,14 +255,15 @@ asyncTest( "handle race condition", function() { element.autocomplete( "search", "ab" ); function checkResults() { - equal( element.autocomplete( "widget" ).find( ".ui-menu-item" ).text(), "two", + assert.equal( element.autocomplete( "widget" ).find( ".ui-menu-item" ).text(), "two", "correct results displayed" ); - start(); + ready(); } } ); -asyncTest( "simultaneous searches (#9334)", function() { - expect( 2 ); +QUnit.test( "simultaneous searches (#9334)", function( assert ) { + var ready = assert.async(); + assert.expect( 2 ); var element = $( "#autocomplete" ).autocomplete( { source: function( request, response ) { setTimeout( function() { @@ -266,7 +271,7 @@ asyncTest( "simultaneous searches (#9334)", function() { } ); }, response: function() { - ok( true, "response from first instance" ); + assert.ok( true, "response from first instance" ); } } ), element2 = $( "#autocomplete-textarea" ).autocomplete( { @@ -276,8 +281,8 @@ asyncTest( "simultaneous searches (#9334)", function() { } ); }, response: function() { - ok( true, "response from second instance" ); - start(); + assert.ok( true, "response from second instance" ); + ready(); } } ); @@ -285,60 +290,60 @@ asyncTest( "simultaneous searches (#9334)", function() { element2.autocomplete( "search", "test" ); } ); -test( "ARIA", function() { - expect( 13 ); +QUnit.test( "ARIA", function( assert ) { + assert.expect( 13 ); var element = $( "#autocomplete" ).autocomplete( { source: [ "java", "javascript" ] } ), liveRegion = element.autocomplete( "instance" ).liveRegion; - equal( liveRegion.children().length, 0, "Empty live region on create" ); - equal( liveRegion.attr( "aria-live" ), "assertive", + assert.equal( liveRegion.children().length, 0, "Empty live region on create" ); + assert.equal( liveRegion.attr( "aria-live" ), "assertive", "Live region's aria-live attribute must be assertive" ); - equal( liveRegion.attr( "aria-relevant" ), "additions", + assert.equal( liveRegion.attr( "aria-relevant" ), "additions", "Live region's aria-relevant attribute must be additions" ); - equal( liveRegion.attr( "role" ), "status", + assert.equal( liveRegion.attr( "role" ), "status", "Live region's role attribute must be status" ); element.autocomplete( "search", "j" ); - equal( liveRegion.children().first().text(), + assert.equal( liveRegion.children().first().text(), "2 results are available, use up and down arrow keys to navigate.", "Live region for multiple values" ); element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - equal( liveRegion.children().filter( ":visible" ).text(), "java", + assert.equal( liveRegion.children().filter( ":visible" ).text(), "java", "Live region changed on keydown to announce the highlighted value" ); element.one( "autocompletefocus", function( event ) { event.preventDefault(); } ); element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - equal( liveRegion.children().filter( ":visible" ).text(), "javascript", + assert.equal( liveRegion.children().filter( ":visible" ).text(), "javascript", "Live region updated when default focus is prevented" ); element.autocomplete( "search", "javas" ); - equal( liveRegion.children().filter( ":visible" ).text(), + assert.equal( liveRegion.children().filter( ":visible" ).text(), "1 result is available, use up and down arrow keys to navigate.", "Live region for one value" ); element.autocomplete( "search", "z" ); - equal( liveRegion.children().filter( ":visible" ).text(), "No search results.", + assert.equal( liveRegion.children().filter( ":visible" ).text(), "No search results.", "Live region for no values" ); - equal( liveRegion.children().length, 5, + assert.equal( liveRegion.children().length, 5, "Should be five children in the live region after the above" ); - equal( liveRegion.children().filter( ":visible" ).length, 1, + assert.equal( liveRegion.children().filter( ":visible" ).length, 1, "Only one should be still visible" ); - ok( liveRegion.children().filter( ":visible" )[ 0 ] === liveRegion.children().last()[ 0 ], + assert.ok( liveRegion.children().filter( ":visible" )[ 0 ] === liveRegion.children().last()[ 0 ], "The last one should be the visible one" ); element.autocomplete( "destroy" ); - equal( liveRegion.parent().length, 0, + assert.equal( liveRegion.parent().length, 0, "The liveRegion should be detached after destroy" ); } ); -test( "ARIA, aria-label announcement", function() { - expect( 1 ); +QUnit.test( "ARIA, aria-label announcement", function( assert ) { + assert.expect( 1 ); $.widget( "custom.catcomplete", $.ui.autocomplete, { _renderMenu: function( ul, items ) { var that = this; @@ -354,31 +359,32 @@ test( "ARIA, aria-label announcement", function() { liveRegion = element.catcomplete( "instance" ).liveRegion; element.catcomplete( "search", "a" ); element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - equal( liveRegion.children().filter( ":visible" ).text(), "People : anders andersson", + assert.equal( liveRegion.children().filter( ":visible" ).text(), "People : anders andersson", "Live region changed on keydown to announce the highlighted value's aria-label attribute" ); } ); -test( "ARIA, init on detached input", function() { - expect( 1 ); +QUnit.test( "ARIA, init on detached input", function( assert ) { + assert.expect( 1 ); var element = $( "" ).autocomplete( { source: [ "java", "javascript" ] } ), liveRegion = element.autocomplete( "instance" ).liveRegion; - equal( liveRegion.parent().length, 1, "liveRegion must have a parent" ); + assert.equal( liveRegion.parent().length, 1, "liveRegion must have a parent" ); } ); -test( ".replaceWith() (#9172)", function() { - expect( 1 ); +QUnit.test( ".replaceWith() (#9172)", function( assert ) { + assert.expect( 1 ); var element = $( "#autocomplete" ).autocomplete(), replacement = "
test
", parent = element.parent(); element.replaceWith( replacement ); - equal( parent.html().toLowerCase(), replacement ); + assert.equal( parent.html().toLowerCase(), replacement ); } ); -asyncTest( "Search if the user retypes the same value (#7434)", function() { - expect( 3 ); +QUnit.test( "Search if the user retypes the same value (#7434)", function( assert ) { + var ready = assert.async(); + assert.expect( 3 ); var element = $( "#autocomplete" ).autocomplete( { source: [ "java", "javascript" ], delay: 0 @@ -387,19 +393,20 @@ asyncTest( "Search if the user retypes the same value (#7434)", function() { element.val( "j" ).simulate( "keydown" ); setTimeout( function() { - ok( menu.is( ":visible" ), "menu displays initially" ); + assert.ok( menu.is( ":visible" ), "menu displays initially" ); element.trigger( "blur" ); - ok( !menu.is( ":visible" ), "menu hidden after blur" ); + assert.ok( !menu.is( ":visible" ), "menu hidden after blur" ); element.val( "j" ).simulate( "keydown" ); setTimeout( function() { - ok( menu.is( ":visible" ), "menu displays after typing the same value" ); - start(); + assert.ok( menu.is( ":visible" ), "menu displays after typing the same value" ); + ready(); } ); } ); } ); -asyncTest( "Close on click outside when focus remains", function() { - expect( 2 ); +QUnit.test( "Close on click outside when focus remains", function( assert ) { + var ready = assert.async(); + assert.expect( 2 ); var element = $( "#autocomplete" ).autocomplete( { source: [ "java", "javascript" ], @@ -413,11 +420,11 @@ asyncTest( "Close on click outside when focus remains", function() { element.val( "j" ).autocomplete( "search", "j" ); setTimeout( function() { - ok( menu.is( ":visible" ), "menu displays initially" ); + assert.ok( menu.is( ":visible" ), "menu displays initially" ); $( "body" ).simulate( "mousedown" ); setTimeout( function() { - ok( menu.is( ":hidden" ), "menu closes after clicking elsewhere" ); - start(); + assert.ok( menu.is( ":hidden" ), "menu closes after clicking elsewhere" ); + ready(); } ); } ); } ); diff --git a/tests/unit/autocomplete/events.js b/tests/unit/autocomplete/events.js index 688763f7e..f02d36dd7 100644 --- a/tests/unit/autocomplete/events.js +++ b/tests/unit/autocomplete/events.js @@ -1,9 +1,10 @@ define( [ + "qunit", "jquery", "ui/widgets/autocomplete" -], function( $ ) { +], function( QUnit, $ ) { -module( "autocomplete: events" ); +QUnit.module( "autocomplete: events" ); var data = [ "Clojure", "COBOL", "ColdFusion", "Java", "JavaScript", "Scala", "Scheme" ]; @@ -24,18 +25,19 @@ $.each( [ valueMethod: "text" } ], function( i, settings ) { - asyncTest( "all events - " + settings.type, function() { - expect( 13 ); + QUnit.test( "all events - " + settings.type, function( assert ) { + var ready = assert.async(); + assert.expect( 13 ); var element = $( settings.selector ) .autocomplete( { autoFocus: false, delay: 0, source: data, search: function( event ) { - equal( event.originalEvent.type, "keydown", "search originalEvent" ); + assert.equal( event.originalEvent.type, "keydown", "search originalEvent" ); }, response: function( event, ui ) { - deepEqual( ui.content, [ + assert.deepEqual( ui.content, [ { label: "Clojure", value: "Clojure" }, { label: "Java", value: "Java" }, { label: "JavaScript", value: "JavaScript" } @@ -43,32 +45,32 @@ $.each( [ ui.content.splice( 0, 1 ); }, open: function() { - ok( menu.is( ":visible" ), "menu open on open" ); + assert.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" ); + assert.equal( event.originalEvent.type, "menufocus", "focus originalEvent" ); + assert.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" ); + assert.equal( event.originalEvent.type, "menuselect", "close originalEvent" ); + assert.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" ); + assert.equal( event.originalEvent.type, "menuselect", "select originalEvent" ); + assert.deepEqual( ui.item, { label: "Java", value: "Java" }, "select ui.item" ); }, change: function( event, ui ) { - equal( event.originalEvent.type, "blur", "change originalEvent" ); - deepEqual( ui.item, { label: "Java", value: "Java" }, "change ui.item" ); - ok( menu.is( ":hidden" ), "menu closed on change" ); - start(); + assert.equal( event.originalEvent.type, "blur", "change originalEvent" ); + assert.deepEqual( ui.item, { label: "Java", value: "Java" }, "change ui.item" ); + assert.ok( menu.is( ":hidden" ), "menu closed on change" ); + ready(); } } ), menu = element.autocomplete( "widget" ); element.simulate( "focus" )[ settings.valueMethod ]( "j" ).trigger( "keydown" ); setTimeout( function() { - ok( menu.is( ":visible" ), "menu is visible after delay" ); + assert.ok( menu.is( ":visible" ), "menu is visible after delay" ); element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); @@ -80,53 +82,56 @@ $.each( [ } ); } ); -asyncTest( "change without selection", function() { - expect( 1 ); +QUnit.test( "change without selection", function( assert ) { + var ready = assert.async(); + assert.expect( 1 ); var element = $( "#autocomplete" ).autocomplete( { delay: 0, source: data, change: function( event, ui ) { - strictEqual( ui.item, null ); - start(); + assert.strictEqual( ui.item, null ); + ready(); } } ); element.triggerHandler( "focus" ); element.val( "ja" ).triggerHandler( "blur" ); } ); -asyncTest( "cancel search", function() { - expect( 6 ); +QUnit.test( "cancel search", function( assert ) { + var ready = assert.async(); + assert.expect( 6 ); var first = true, element = $( "#autocomplete" ).autocomplete( { delay: 0, source: data, search: function() { if ( first ) { - equal( element.val(), "ja", "val on first search" ); + assert.equal( element.val(), "ja", "val on first search" ); first = false; return false; } - equal( element.val(), "java", "val on second search" ); + assert.equal( element.val(), "java", "val on second search" ); }, open: function() { - ok( true, "menu opened" ); + assert.ok( true, "menu opened" ); } } ), menu = element.autocomplete( "widget" ); element.val( "ja" ).trigger( "keydown" ); setTimeout( function() { - ok( menu.is( ":hidden" ), "menu is hidden after first search" ); + assert.ok( menu.is( ":hidden" ), "menu is hidden after first search" ); element.val( "java" ).trigger( "keydown" ); setTimeout( function() { - ok( menu.is( ":visible" ), "menu is visible after second search" ); - equal( menu.find( ".ui-menu-item" ).length, 2, "# of menu items" ); - start(); + assert.ok( menu.is( ":visible" ), "menu is visible after second search" ); + assert.equal( menu.find( ".ui-menu-item" ).length, 2, "# of menu items" ); + ready(); } ); } ); } ); -asyncTest( "cancel focus", function() { - expect( 1 ); +QUnit.test( "cancel focus", function( assert ) { + var ready = assert.async(); + assert.expect( 1 ); var customVal = "custom value", element = $( "#autocomplete" ).autocomplete( { delay: 0, @@ -139,13 +144,14 @@ asyncTest( "cancel focus", function() { element.val( "ja" ).trigger( "keydown" ); setTimeout( function() { element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); - equal( element.val(), customVal ); - start(); + assert.equal( element.val(), customVal ); + ready(); } ); } ); -asyncTest( "cancel select", function() { - expect( 1 ); +QUnit.test( "cancel select", function( assert ) { + var ready = assert.async(); + assert.expect( 1 ); var customVal = "custom value", element = $( "#autocomplete" ).autocomplete( { delay: 0, @@ -159,25 +165,26 @@ asyncTest( "cancel select", function() { setTimeout( function() { element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } ); element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } ); - equal( element.val(), customVal ); - start(); + assert.equal( element.val(), customVal ); + ready(); } ); } ); -asyncTest( "blur during remote search", function() { - expect( 1 ); +QUnit.test( "blur during remote search", function( assert ) { + var ready = assert.async(); + assert.expect( 1 ); var ac = $( "#autocomplete" ).autocomplete( { delay: 0, source: function( request, response ) { - ok( true, "trigger request" ); + assert.ok( true, "trigger request" ); ac.simulate( "blur" ); setTimeout( function() { response( [ "result" ] ); - start(); + ready(); }, 25 ); }, open: function() { - ok( false, "opened after a blur" ); + assert.ok( false, "opened after a blur" ); } } ); ac.val( "ro" ).trigger( "keydown" ); diff --git a/tests/unit/autocomplete/methods.js b/tests/unit/autocomplete/methods.js index 0ebdc0d7e..7aa3058b3 100644 --- a/tests/unit/autocomplete/methods.js +++ b/tests/unit/autocomplete/methods.js @@ -1,19 +1,20 @@ define( [ + "qunit", "jquery", "ui/widgets/autocomplete" -], function( $ ) { +], function( QUnit, $ ) { -module( "autocomplete: methods" ); +QUnit.module( "autocomplete: methods" ); -test( "destroy", function( assert ) { - expect( 1 ); +QUnit.test( "destroy", function( assert ) { + assert.expect( 1 ); assert.domEqual( "#autocomplete", function() { $( "#autocomplete" ).autocomplete().autocomplete( "destroy" ); } ); } ); -test( "search, close", function() { - expect( 6 ); +QUnit.test( "search, close", function( assert ) { + assert.expect( 6 ); var data = [ "c++", "java", "php", "coldfusion", "javascript", "asp", "ruby", "python", "c", "scala", "groovy", "haskell", "perl" ], element = $( "#autocomplete" ).autocomplete( { source: data, @@ -21,27 +22,27 @@ test( "search, close", function() { } ), menu = element.autocomplete( "widget" ); - ok( menu.is( ":hidden" ), "menu is hidden on init" ); + assert.ok( menu.is( ":hidden" ), "menu is hidden on init" ); element.autocomplete( "search" ); - ok( menu.is( ":visible" ), "menu is visible after search" ); - equal( menu.find( ".ui-menu-item" ).length, data.length, "all items for a blank search" ); + assert.ok( menu.is( ":visible" ), "menu is visible after search" ); + assert.equal( menu.find( ".ui-menu-item" ).length, data.length, "all items for a blank search" ); element.val( "has" ).autocomplete( "search" ); - equal( menu.find( ".ui-menu-item" ).text(), "haskell", "only one item for set input value" ); + assert.equal( menu.find( ".ui-menu-item" ).text(), "haskell", "only one item for set input value" ); element.autocomplete( "search", "ja" ); - equal( menu.find( ".ui-menu-item" ).length, 2, "only java and javascript for 'ja'" ); + assert.equal( menu.find( ".ui-menu-item" ).length, 2, "only java and javascript for 'ja'" ); element.autocomplete( "close" ); - ok( menu.is( ":hidden" ), "menu is hidden after close" ); + assert.ok( menu.is( ":hidden" ), "menu is hidden after close" ); } ); -test( "widget", function( assert ) { - expect( 2 ); +QUnit.test( "widget", function( assert ) { + assert.expect( 2 ); var element = $( "#autocomplete" ).autocomplete(), widgetElement = element.autocomplete( "widget" ); - equal( widgetElement.length, 1, "one element" ); + assert.equal( widgetElement.length, 1, "one element" ); assert.hasClasses( widgetElement, "ui-menu" ); } ); diff --git a/tests/unit/autocomplete/options.js b/tests/unit/autocomplete/options.js index 76c13e754..c3f445db1 100644 --- a/tests/unit/autocomplete/options.js +++ b/tests/unit/autocomplete/options.js @@ -1,108 +1,110 @@ define( [ + "qunit", "jquery", "ui/widgets/autocomplete" -], function( $ ) { +], function( QUnit, $ ) { -module( "autocomplete: options" ); +QUnit.module( "autocomplete: options" ); var data = [ "c++", "java", "php", "coldfusion", "javascript", "asp", "ruby", "python", "c", "scala", "groovy", "haskell", "perl" ]; -test( "appendTo: null", function() { - expect( 1 ); +QUnit.test( "appendTo: null", function( assert ) { + assert.expect( 1 ); var element = $( "#autocomplete" ).autocomplete(); - equal( element.autocomplete( "widget" ).parent()[ 0 ], document.body, + assert.equal( element.autocomplete( "widget" ).parent()[ 0 ], document.body, "defaults to body" ); element.autocomplete( "destroy" ); } ); -test( "appendTo: explicit", function() { - expect( 6 ); +QUnit.test( "appendTo: explicit", function( assert ) { + assert.expect( 6 ); var detached = $( "
" ), element = $( "#autocomplete" ); element.autocomplete( { appendTo: ".autocomplete-wrap" } ); - equal( element.autocomplete( "widget" ).parent()[ 0 ], + assert.equal( element.autocomplete( "widget" ).parent()[ 0 ], $( "#autocomplete-wrap1" )[ 0 ], "first found element" ); - equal( $( "#autocomplete-wrap2 .ui-autocomplete" ).length, 0, + assert.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 ], + assert.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 ], + assert.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 ], + assert.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 ], + assert.equal( element.autocomplete( "widget" ).parent()[ 0 ], detached[ 0 ], "detached DOM element via option()" ); element.autocomplete( "destroy" ); } ); -test( "appendTo: ui-front", function() { - expect( 2 ); +QUnit.test( "appendTo: ui-front", function( assert ) { + assert.expect( 2 ); var element = $( "#autocomplete" ); $( "#autocomplete-wrap2" ).addClass( "ui-front" ); element.autocomplete(); - equal( element.autocomplete( "widget" ).parent()[ 0 ], + assert.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 ], + assert.equal( element.autocomplete( "widget" ).parent()[ 0 ], $( "#autocomplete-wrap2" )[ 0 ], "empty jQuery object, inside .ui-front" ); } ); -function autoFocusTest( afValue, focusedLength ) { +function autoFocusTest( assert, afValue, focusedLength ) { + var ready = assert.async(); var element = $( "#autocomplete" ).autocomplete( { autoFocus: afValue, delay: 0, source: data, open: function() { - equal( + assert.equal( element.autocomplete( "widget" ) .find( ".ui-menu-item-wrapper.ui-state-active" ) .length, focusedLength, "first item is " + ( afValue ? "" : "not" ) + " auto focused" ); - start(); + ready(); } } ); element.val( "ja" ).trigger( "keydown" ); - stop(); } -test( "autoFocus: false", function() { - expect( 1 ); - autoFocusTest( false, 0 ); +QUnit.test( "autoFocus: false", function( assert ) { + assert.expect( 1 ); + autoFocusTest( assert, false, 0 ); } ); -test( "autoFocus: true", function() { - expect( 1 ); - autoFocusTest( true, 1 ); +QUnit.test( "autoFocus: true", function( assert ) { + assert.expect( 1 ); + autoFocusTest( assert, true, 1 ); } ); -asyncTest( "delay", function() { - expect( 2 ); +QUnit.test( "delay", function( assert ) { + var ready = assert.async(); + assert.expect( 2 ); var element = $( "#autocomplete" ).autocomplete( { source: data, delay: 25 @@ -110,16 +112,17 @@ asyncTest( "delay", function() { menu = element.autocomplete( "widget" ); element.val( "ja" ).trigger( "keydown" ); - ok( menu.is( ":hidden" ), "menu is closed immediately after search" ); + assert.ok( menu.is( ":hidden" ), "menu is closed immediately after search" ); setTimeout( function() { - ok( menu.is( ":visible" ), "menu is open after delay" ); - start(); + assert.ok( menu.is( ":visible" ), "menu is open after delay" ); + ready(); }, 50 ); } ); -asyncTest( "disabled", function( assert ) { - expect( 5 ); +QUnit.test( "disabled", function( assert ) { + var ready = assert.async(); + assert.expect( 5 ); var element = $( "#autocomplete" ).autocomplete( { source: data, delay: 0 @@ -127,38 +130,39 @@ asyncTest( "disabled", function( assert ) { menu = element.autocomplete( "disable" ).autocomplete( "widget" ); element.val( "ja" ).trigger( "keydown" ); - ok( menu.is( ":hidden" ) ); + assert.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" ); + assert.ok( !element.attr( "aria-disabled" ), "element doesn't get aria-disabled" ); setTimeout( function() { - ok( menu.is( ":hidden" ) ); - start(); + assert.ok( menu.is( ":hidden" ) ); + ready(); } ); } ); -test( "minLength", function() { - expect( 2 ); +QUnit.test( "minLength", function( assert ) { + assert.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" ); + assert.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" ); + assert.ok( menu.is( ":visible" ), "blank enough for minLength: 0" ); } ); -asyncTest( "minLength, exceed then drop below", function() { - expect( 4 ); +QUnit.test( "minLength, exceed then drop below", function( assert ) { + var ready = assert.async(); + assert.expect( 4 ); var element = $( "#autocomplete" ).autocomplete( { minLength: 2, source: function( req, res ) { - equal( req.term, "12", "correct search term" ); + assert.equal( req.term, "12", "correct search term" ); setTimeout( function() { res( [ "item" ] ); } ); @@ -166,20 +170,20 @@ asyncTest( "minLength, exceed then drop below", function() { } ), menu = element.autocomplete( "widget" ); - ok( menu.is( ":hidden" ), "menu is hidden before first search" ); + assert.ok( menu.is( ":hidden" ), "menu is hidden before first search" ); element.autocomplete( "search", "12" ); - ok( menu.is( ":hidden" ), "menu is hidden before second search" ); + assert.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(); + assert.ok( menu.is( ":hidden" ), "menu is hidden after searches" ); + ready(); } ); } ); -test( "minLength, exceed then drop below then exceed", function() { - expect( 3 ); +QUnit.test( "minLength, exceed then drop below then exceed", function( assert ) { + assert.expect( 3 ); var _res = [], element = $( "#autocomplete" ).autocomplete( { minLength: 2, @@ -190,11 +194,11 @@ test( "minLength, exceed then drop below then exceed", function() { menu = element.autocomplete( "widget" ); // Trigger a valid search - ok( menu.is( ":hidden" ), "menu is hidden before first search" ); + assert.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" ); + assert.ok( menu.is( ":hidden" ), "menu is hidden before second search" ); element.autocomplete( "search", "1" ); // Trigger a valid search @@ -206,46 +210,47 @@ test( "minLength, exceed then drop below then exceed", function() { // React to second search _res[ 1 ]( [ "13" ] ); - ok( menu.is( ":visible" ), "menu is visible after searches" ); + assert.ok( menu.is( ":visible" ), "menu is visible after searches" ); } ); -test( "source, local string array", function() { - expect( 1 ); +QUnit.test( "source, local string array", function( assert ) { + assert.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" ); + assert.equal( menu.find( ".ui-menu-item" ).text(), "javajavascript" ); } ); -function sourceTest( source, async ) { +function sourceTest( assert, source, async ) { + var ready; 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" ), { + assert.equal( items.length, 3, "Should find three results." ); + assert.deepEqual( items.eq( 0 ).data( "ui-autocomplete-item" ), { label: "java", value: "java" } ); - deepEqual( items.eq( 1 ).data( "ui-autocomplete-item" ), { + assert.deepEqual( items.eq( 1 ).data( "ui-autocomplete-item" ), { label: "javascript", value: "javascript" } ); - deepEqual( items.eq( 2 ).data( "ui-autocomplete-item" ), { + assert.deepEqual( items.eq( 2 ).data( "ui-autocomplete-item" ), { label: "clojure", value: "clojure" } ); element.autocomplete( "destroy" ); if ( async ) { - start(); + ready(); } } if ( async ) { - stop(); + ready = assert.async(); $( document ).one( "ajaxStop", result ); } element.val( "j" ).autocomplete( "search" ); @@ -254,9 +259,9 @@ function sourceTest( source, async ) { } } -test( "source, local object array, only labels", function() { - expect( 4 ); - sourceTest( [ +QUnit.test( "source, local object array, only labels", function( assert ) { + assert.expect( 4 ); + sourceTest( assert, [ { label: "java", value: null }, { label: "php", value: null }, { label: "coldfusion", value: "" }, @@ -265,9 +270,9 @@ test( "source, local object array, only labels", function() { ] ); } ); -test( "source, local object array, only values", function() { - expect( 4 ); - sourceTest( [ +QUnit.test( "source, local object array, only values", function( assert ) { + assert.expect( 4 ); + sourceTest( assert, [ { value: "java", label: null }, { value: "php", label: null }, { value: "coldfusion", label: "" }, @@ -276,25 +281,25 @@ test( "source, local object array, only values", function() { ] ); } ); -test( "source, url string with remote json string array", function() { - expect( 4 ); - sourceTest( "remote_string_array.txt", true ); +QUnit.test( "source, url string with remote json string array", function( assert ) { + assert.expect( 4 ); + sourceTest( assert, "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 ); +QUnit.test( "source, url string with remote json object array, only value properties", function( assert ) { + assert.expect( 4 ); + sourceTest( assert, "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 ); +QUnit.test( "source, url string with remote json object array, only label properties", function( assert ) { + assert.expect( 4 ); + sourceTest( assert, "remote_object_array_labels.txt", true ); } ); -test( "source, custom", function() { - expect( 5 ); - sourceTest( function( request, response ) { - equal( request.term, "j" ); +QUnit.test( "source, custom", function( assert ) { + assert.expect( 5 ); + sourceTest( assert, function( request, response ) { + assert.equal( request.term, "j" ); response( [ "java", { label: "javascript", value: null }, @@ -303,17 +308,17 @@ test( "source, custom", function() { } ); } ); -test( "source, update after init", function() { - expect( 2 ); +QUnit.test( "source, update after init", function( assert ) { + assert.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" ); + assert.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" ); + assert.equal( menu.find( ".ui-menu-item" ).text(), "php" ); } ); } );