Menu: More precise removal of ui-state-active class for easier CSS overrides. Fixes #9532 - Need a way in Menu to keep ui-state-active class on selected item

Author: kborchers

tests/unit/menu/menu_core.js

@@ -45,4 +45,17 @@ asyncTest( "#9044: Autofocus issue with dialog opened from menu widget", functio
 	});
 });
 
+asyncTest( "#9532: Need a way in Menu to keep ui-state-active class on selected item for Selectmenu", function() {
+	expect( 1 );
+	var element = $( "#menu1" ).menu(),
+		firstChild = element.children().eq( 0 );
+
+	element.menu( "focus", null, firstChild );
+	firstChild.addClass( "ui-state-active" );
+	setTimeout( function() {
+		ok( firstChild.is( ".ui-state-active" ), "ui-state-active improperly removed" );
+		start();
+	}, 500 );
+});
+
 })( jQuery );

ui/jquery.ui.menu.js

@@ -371,7 +371,7 @@ $.widget( "ui.menu", {
 		this._scrollIntoView( item );
 
 		this.active = item.first();
-		focused = this.active.addClass( "ui-state-focus" );
+		focused = this.active.addClass( "ui-state-focus" ).removeClass( "ui-state-active" );
 		// Only update aria-activedescendant if there's a role
 		// otherwise we assume focus is managed elsewhere
 		if ( this.options.role ) {
@@ -498,7 +498,7 @@ $.widget( "ui.menu", {
 				.attr( "aria-hidden", "true" )
 				.attr( "aria-expanded", "false" )
 			.end()
-			.find( ".ui-state-active" )
+			.find( ".ui-state-active" ).not( ".ui-state-focus" )
 				.removeClass( "ui-state-active" );
 	},