Selectmenu: Don't use active items at all

Menus only use active items for nested menus which selectmenu doesn't support.
Selectmenu should only be working with focused items.

Ref gh-1224

tests/unit/selectmenu/selectmenu_core.js

@@ -185,36 +185,36 @@ $.each([
 	});
 
 	asyncTest( "item focus and active state - " + settings.type, function () {
-		expect( 8 );
+		expect( 4 );
 
-		var element = $( settings.selector ).selectmenu(),
+		var items, focusedItem, activeItem,
+			element = $( settings.selector ).selectmenu(),
 			button = element.selectmenu( "widget" ),
-			menu = element.selectmenu( "menuWidget" ),
-			links, focusedItem, activeItem;
+			menu = element.selectmenu( "menuWidget" );
 
-		// init menu
+		// Initialize menu
 		button.simulate( "focus" );
 
 		setTimeout(function() {
-			links = menu.find( "li.ui-menu-item" );
+			items = menu.find( "li.ui-menu-item" );
 
 			button.trigger( "click" );
 			setTimeout(function() {
 				checkItemClasses();
 
-				links.eq( 3 ).simulate( "mouseover" ).trigger( "click" );
+				items.eq( 3 ).simulate( "mouseover" ).trigger( "click" );
 
 				button.trigger( "click" );
-				links.eq( 2 ).simulate( "mouseover" );
+				items.eq( 2 ).simulate( "mouseover" );
 				$( document ).trigger( "click" );
 
 				button.trigger( "click" );
-				links.eq( 1 ).simulate( "mouseover" );
+				items.eq( 1 ).simulate( "mouseover" );
 				$( document ).trigger( "click" );
 
 				button.trigger( "click" );
 				setTimeout(function() {
-					 checkItemClasses();
+					checkItemClasses();
 					start();
 				}, 350 );
 			}, 350 );
@@ -223,11 +223,7 @@ $.each([
 		function checkItemClasses() {
 			focusedItem = menu.find( "li.ui-state-focus" );
 			equal( focusedItem.length, 1, "only one item has ui-state-focus class" );
-			equal( focusedItem.attr( "id" ), links.eq( element[ 0 ].selectedIndex ).attr( "id" ), "selected item has ui-state-focus class" );
-
-			activeItem = menu.find( "li.ui-state-active" );
-			equal( activeItem.length, 1, "only one item has ui-state-active class" );
-			equal( activeItem.attr( "id" ), links.eq( element[ 0 ].selectedIndex ).attr( "id" ), "selected item has ui-state-active class" );
+			equal( focusedItem.attr( "id" ), items.eq( element[ 0 ].selectedIndex ).attr( "id" ), "selected item has ui-state-focus class" );
 		}
 	});
 

ui/selectmenu.js

@@ -223,11 +223,10 @@ return $.widget( "ui.selectmenu", {
 		if ( !this.menuItems ) {
 			this._refreshMenu();
 		} else {
-			// TODO: Why is this necessary?
-			// Shouldn't the underlying menu always have accurate state?
+
+			// Menu clears focus on close, reset focus to selected item
 			this.menu.find( ".ui-state-focus" ).removeClass( "ui-state-focus" );
 			this.menuInstance.focus( null, this._getSelectedItem() );
-			this.menuItems.eq( this.element[ 0 ].selectedIndex ).addClass( "ui-state-active" );
 		}
 
 		this.isOpen = true;
@@ -252,11 +251,6 @@ return $.widget( "ui.selectmenu", {
 		this.isOpen = false;
 		this._toggleAttr();
 
-		// Check if we have an item to select
-		if ( this.menuItems ) {
-			this.menuInstance.active = this._getSelectedItem();
-		}
-
 		this._off( this.document );
 
 		this._trigger( "close", event );