tests/unit/selectmenu/selectmenu_events.js

@@ -7,16 +7,18 @@ module( "selectmenu: events", {
 });
 
 test( "change", function () {
-	expect( 4 );
-
-	var that = this;
+	expect( 5 );
+
+	var that = this,
+		optionIndex = 1;
 
 	this.element.selectmenu({
 		change: function ( event, ui ) {
 			ok( event, "change event fired on change" );
 			equal( event.type, "selectmenuchange", "event type set to selectmenuchange" );
-			equal( ui.item.element[ 0 ], options.eq( ui.item.index )[ 0 ], "ui.item.element contains original option element" );
-			equal( ui.item.value, options.eq( ui.item.index ).text(), "ui.item.value property updated correctly" );
+			equal( ui.item.index, optionIndex, "ui.item.index contains correct option index" );
+			equal( ui.item.element[ 0 ], options.eq( optionIndex )[ 0 ], "ui.item.element contains original option element" );
+			equal( ui.item.value, options.eq( optionIndex ).text(), "ui.item.value property updated correctly" );
 		}
 	});
 
@@ -25,48 +27,58 @@ test( "change", function () {
 		options = this.element.find( "option" );
 
 	button.simulate( "focus" ).simulate( "click" );
-	menu.find( "a" ).first().simulate( "mouseover" ).simulate( "click" );
+	menu.find( "a" ).eq( optionIndex ).simulate( "mouseover" ).simulate( "click" );
 });
 
 
 test( "close", function () {
-	expect( 2 );
+	expect( 4 );
 
 	this.element.selectmenu({
 		close: function ( event, ui ) {
 			ok( event, "close event fired on close" );
 			equal( event.type, "selectmenuclose", "event type set to selectmenuclose" );
 		}
 	});
-
+	
 	this.element.selectmenu( "open" ).selectmenu( "close" );
+
+	this.element.selectmenu( "open" );
+	$( "body" ).simulate( "click" );
 });
 
 
 test( "focus", function () {
-	expect( 3 );
+	expect( 12 );
 
 	var button, menu, links,
+		optionIndex = this.element[ 0 ].selectedIndex + 1,
 		options = this.element.find( "option" );
 
 	this.element.selectmenu({
 		focus: function ( event, ui ) {
-			ok( event, "focus event fired on mouseover" );
+			ok( event, "focus event fired on element #" + optionIndex + " mouseover" );
 			equal( event.type, "selectmenufocus", "event type set to selectmenufocus" );
-			equal( ui.item.element[ 0 ], options.eq( ui.item.index )[ 0 ], "ui.item.element contains original option element" );
+			equal( ui.item.index, optionIndex, "ui.item.index contains correct option index" );
+			equal( ui.item.element[ 0 ], options.eq( optionIndex )[ 0 ], "ui.item.element contains original option element" );
 		}
 	});
 
 	button = this.element.selectmenu( "widget" ),
 	menu = this.element.selectmenu( "menuWidget" );
 
-	button.simulate( "focus" );
-	links = menu.find( "li.ui-menu-item a" );
+	button
+		.simulate( "focus" )
+		.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
 
 	button.simulate( "click" );
+	links = menu.find( "li.ui-menu-item a" );
+	optionIndex = 0;
+	links.eq( optionIndex ).simulate( "mouseover" );
+	optionIndex += 1;
+	links.eq( optionIndex ).simulate( "mouseover" );
 
-	menu.find( "a" ).last().simulate( "mouseover" );
-
+	// this tests for unwanted, additional focus event on close
 	this.element.selectmenu( "close" );
 });
 
@@ -86,22 +98,24 @@ test( "open", function () {
 
 
 test( "select", function () {
-	expect( 3 );
+	expect( 4 );
 
 	this.element.selectmenu({
 		select: function ( event, ui ) {
 			ok( event, "select event fired on item select" );
 			equal( event.type, "selectmenuselect", "event type set to selectmenuselect" );
-			equal( ui.item.element[ 0 ], options.eq( ui.item.index )[ 0 ], "ui.item.element contains original option element" );
+			equal( ui.item.index, optionIndex, "ui.item.index contains correct option index" );
+			equal( ui.item.element[ 0 ], options.eq( optionIndex )[ 0 ], "ui.item.element contains original option element" );
 		}
 	});
 
 	var button = this.element.selectmenu( "widget" ),
 		menu = this.element.selectmenu( "menuWidget" ).parent(),
-		options = this.element.find( "option" );
+		options = this.element.find( "option" ),
+		optionIndex = 1;
 
 	button.simulate( "focus" ).simulate( "click" );
-	menu.find( "a" ).first().simulate( "mouseover" ).simulate( "click" );
+	menu.find( "a" ).eq( optionIndex ).simulate( "mouseover" ).simulate( "click" );
 });
 
 })(jQuery);

ui/jquery.ui.selectmenu.js

@@ -99,8 +99,7 @@ $.widget( "ui.selectmenu", {
 	},
 
 	_drawMenu: function() {
-		var menuInstance,
-			that = this;
+		var that = this;
 
 		// Create menu portion, append to body
 		this.menu = $( "<ul>", {
@@ -118,7 +117,7 @@ $.widget( "ui.selectmenu", {
 			.appendTo( this._appendTo() );
 
 		// Init menu widget
-		menuInstance = this.menu.menu({
+		this.menuInstance = this.menu.menu({
 			select: function( event, ui ) {
 				var item = ui.item.data( "ui-selectmenu-item" );
 
@@ -133,7 +132,7 @@ $.widget( "ui.selectmenu", {
 				var item = ui.item.data( "ui-selectmenu-item" );
 
 				// prevent inital focus from firing and checks if its a newly focused item
-				if ( !that.isOpen && that.focusIndex !== undefined && item.index !== that.focusIndex ) {
+				if ( that.focusIndex != null && item.index !== that.focusIndex ) {
 					that._trigger( "focus", event, { item: item } );
 					if ( !that.isOpen ) {
 						that._select( item, event );
@@ -151,9 +150,9 @@ $.widget( "ui.selectmenu", {
 		this.menu.addClass( "ui-corner-bottom" ).removeClass( "ui-corner-all" );
 
 		// Make sure focus stays on selected item
-		menuInstance.delay = 999999999;
+		this.menuInstance.delay = 999999999;
 		// Unbind uneeded Menu events
-		menuInstance._off( this.menu, "mouseleave" );
+		this.menuInstance._off( this.menu, "mouseleave" );
 	},
 
 	refresh: function() {
@@ -210,7 +209,7 @@ $.widget( "ui.selectmenu", {
 
 		// Check if we have an item to select
 		if ( this.menuItems ) {
-			this.menu.menu( "focus", null, this._getSelectedItem() );
+			this.menuInstance.active = this._getSelectedItem();
 		}
 
 		this._off( this.document );