Menu: Ignore mouse events triggered due to page scrolling

Fixes #9356
Closes gh-1806
This commit is contained in:
Scott González 2017-04-18 16:51:23 -04:00
parent 7d992ae29d
commit 50efd6e1b0
3 changed files with 16 additions and 4 deletions

View File

@ -251,13 +251,13 @@ $.each( [
wrappers = menu.find( "li.ui-menu-item .ui-menu-item-wrapper" );
button.trigger( "click" );
wrappers.first().simulate( "mouseover" ).trigger( "click" );
wrappers.first().simulate( "mouseover", { clientX: 2, clientY: 2 } ).trigger( "click" );
assert.equal( element[ 0 ].selectedIndex, 0, "First item is selected" );
button.simulate( "keydown", { keyCode: $.ui.keyCode.UP } );
assert.equal( element[ 0 ].selectedIndex, 0, "No looping beyond first item" );
button.trigger( "click" );
wrappers.last().simulate( "mouseover" ).trigger( "click" );
wrappers.last().simulate( "mouseover", { clientX: 3, clientY: 3 } ).trigger( "click" );
assert.equal( element[ 0 ].selectedIndex, wrappers.length - 1, "Last item is selected" );
button.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
assert.equal( element[ 0 ].selectedIndex, wrappers.length - 1, "No looping behind last item" );

View File

@ -89,9 +89,9 @@ QUnit.test( "focus", function( assert ) {
button.trigger( "click" );
links = menu.find( "li.ui-menu-item" );
optionIndex = 0;
links.eq( optionIndex ).simulate( "mouseover" );
links.eq( optionIndex ).simulate( "mouseover", { clientX: 2, clientY: 2 } );
optionIndex += 1;
links.eq( optionIndex ).simulate( "mouseover" );
links.eq( optionIndex ).simulate( "mouseover", { clientX: 3, clientY: 3 } );
// This tests for unwanted, additional focus event on close
that.element.selectmenu( "close" );

View File

@ -64,6 +64,7 @@ return $.widget( "ui.menu", {
// Flag used to prevent firing of the click handler
// as the event bubbles up through nested menus
this.mouseHandled = false;
this.lastMousePosition = { x: null, y: null };
this.element
.uniqueId()
.attr( {
@ -161,6 +162,17 @@ return $.widget( "ui.menu", {
return;
}
// If the mouse didn't actually move, but the page was scrolled, ignore the event (#9356)
if ( event.clientX === this.lastMousePosition.x &&
event.clientY === this.lastMousePosition.y ) {
return;
}
this.lastMousePosition = {
x: event.clientX,
y: event.clientY
};
var actualTarget = $( event.target ).closest( ".ui-menu-item" ),
target = $( event.currentTarget );