Skip to content
Permalink
Browse files

Menu: Ignore bubbled mouseenter events on parent items

Test uses QUnit 2.x API - inconsistent with the other tests, but also
a good reference.

Fixes #11641
Closes gh-1535
  • Loading branch information...
jzaefferer committed Apr 8, 2015
1 parent 2d0f05b commit c770605db05347edfa9c6224aebd42974092ed22
Showing with 52 additions and 1 deletion.
  1. +42 −0 tests/unit/menu/menu_events.js
  2. +10 −1 ui/menu.js
@@ -111,6 +111,48 @@ asyncTest( "handle focus of menu with active item", function() {
});
});

test( "handle mouseenter on nested menu item", function( assert ) {
assert.expect( 8 );
$.ui.menu.prototype.delay = 1;
var activeItem,
done = assert.async(),
element = $( "#menu2" ).menu();

element
.menu( "previous" )
.menu( "expand" );

function checkSubmenus() {
equal( element.find( "ul[aria-expanded='true']" ).length, 2, "both submenus expanded" );
}
function menumouseenter1() {
element.menu( "expand" );
setTimeout( menumouseenter2, 25 );
}
function menumouseenter2() {
checkSubmenus();
activeItem = $( "#" + element.attr( "aria-activedescendant" ) );
assert.hasClasses( activeItem, "ui-state-active" );
activeItem.trigger( "mouseleave" );
setTimeout( menumouseenter3, 25 );
}
function menumouseenter3() {
checkSubmenus();
assert.lacksClasses( activeItem, "ui-state-active" );
activeItem.trigger( "mouseenter" );
setTimeout( menumouseenter4, 25 );
}
function menumouseenter4() {
checkSubmenus();
activeItem.parents( ".ui-menu-item" ).each( function( index, item ) {
assert.hasClasses( $( item ).children( ".ui-menu-item-wrapper" ), "ui-state-active" );
} );
$.ui.menu.prototype.delay = 300;
done();
}
setTimeout( menumouseenter1, 25 );
} );

asyncTest( "handle submenu auto collapse: mouseleave, default markup", function() {
expect( 4 );
$.ui.menu.prototype.delay = 1;
@@ -108,13 +108,22 @@ return $.widget( "ui.menu", {
}
},
"mouseenter .ui-menu-item": function( event ) {

// Ignore mouse events while typeahead is active, see #10458.
// Prevents focusing the wrong item when typeahead causes a scroll while the mouse
// is over an item in the menu
if ( this.previousFilter ) {
return;
}
var target = $( event.currentTarget );

var actualTarget = $( event.target ).closest( ".ui-menu-item" ),
target = $( event.currentTarget );

// Ignore bubbled events on parent items, see #11641
if ( actualTarget[ 0 ] !== target[ 0 ] ) {
return;
}

// Remove ui-state-active class from siblings of the newly focused menu item
// to avoid a jump caused by adjacent elements both having a class with a border
this._removeClass( target.siblings().children( ".ui-state-active" ),

0 comments on commit c770605

Please sign in to comment.
You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.