[MenuItem] lists of menu items produce double highlighting when using both keyboard and mouse controls

[akalman]

Problem description

When we display a list of MenuItems, hovering the mouse results in whatever the mouse landing on being highlighted. From that state, keyboard controls (assuming the list is receiving them) change what is selected, and therefore the highlighting, but the hover highlight does not go away. Moving the mouse between menu items replaces both highlightings.

Steps to reproduce

create a paper element
create a series of menuitem elements inside the paper element
hover mouse over a menu item
press the down arrow

Versions

• Material-UI: 1.0.0-beta.4
• React: 15.6.1
• Browser: IE11, chrome 60.0.3112.90

[akalman]

I'm sure this breaks functionality for other use cases, but making this change resolved the issue for us.

[oliviertassinari]

Duplicate of #5186