diff --git a/tests/unit/menu/core.js b/tests/unit/menu/core.js index a8e0ece00..200812f4e 100644 --- a/tests/unit/menu/core.js +++ b/tests/unit/menu/core.js @@ -73,4 +73,34 @@ asyncTest( "#9532: Need a way in Menu to keep ui-state-active class on selected } ); } ); +asyncTest( "active menu item styling", function( assert ) { + expect( 5 ); + function isActive( item ) { + assert.hasClasses( item.children( ".ui-menu-item-wrapper" ), "ui-state-active" ); + } + function isInactive( item ) { + assert.lacksClasses( item.children( ".ui-menu-item-wrapper" ), "ui-state-active" ); + } + $.ui.menu.prototype.delay = 0; + var element = $( "#menu4" ).menu(); + var parentItem = element.children( "li:eq(1)" ); + var childItem = parentItem.find( "li:eq(0)" ); + element.menu( "focus", null, parentItem ); + setTimeout( function() { + isActive( parentItem ); + element.menu( "focus", null, childItem ); + setTimeout( function() { + isActive( parentItem ); + isActive( childItem ); + element.blur(); + setTimeout( function() { + isInactive( parentItem ); + isInactive( childItem ); + $.ui.menu.prototype.delay = 300; + start(); + }, 50 ); + } ); + } ); +} ); + } ); diff --git a/ui/widgets/menu.js b/ui/widgets/menu.js index e7b13e7c9..c5627cc20 100644 --- a/ui/widgets/menu.js +++ b/ui/widgets/menu.js @@ -487,6 +487,10 @@ return $.widget( "ui.menu", { this._close( currentMenu ); this.blur( event ); + + // Work around active item staying active after menu is blurred + this._removeClass( currentMenu.find( ".ui-state-active" ), null, "ui-state-active" ); + this.activeMenu = currentMenu; }, this.delay ); }, @@ -498,14 +502,10 @@ return $.widget( "ui.menu", { startMenu = this.active ? this.active.parent() : this.element; } - var active = startMenu - .find( ".ui-menu" ) - .hide() - .attr( "aria-hidden", "true" ) - .attr( "aria-expanded", "false" ) - .end() - .find( ".ui-state-active" ).not( ".ui-menu-item-wrapper" ); - this._removeClass( active, null, "ui-state-active" ); + startMenu.find( ".ui-menu" ) + .hide() + .attr( "aria-hidden", "true" ) + .attr( "aria-expanded", "false" ); }, _closeOnDocumentClick: function( event ) {