Menu: Filter out non-items when typing

Fixes #10571
Closes gh-1329

Author: SimenB

tests/unit/menu/menu.html

@@ -306,6 +306,15 @@
 	<li>Amesville</li>
 </ul>
 
+<ul id="menu8">
+	<li class="foo">Aberdeen</li>
+	<li class="foo ui-state-disabled">Ada</li>
+	<li class="foo">Adamsville</li>
+	<li class="foo">Addyston</li>
+	<li class="foo">-</li>
+	<li class="foo">-Saarland</li>
+</ul>
+
 </div>
 </body>
 </html>

tests/unit/menu/menu_events.js

@@ -644,4 +644,21 @@ test( "#9469: Stopping propagation in a select event should not suppress subsequ
 	equal( logOutput(), "1,2", "Both select events were not triggered." );
 });
 
+asyncTest( "#10571: When typing in a menu, only menu-items should be focused", function() {
+	expect( 3 );
+
+	var element = $( "#menu8" ).menu({
+		focus: function( event, ui ) {
+			equal( ui.item.length, 1, "There should only be one match when filtering" );
+			ok( ui.item.hasClass( "ui-menu-item" ), "element is .ui-menu-item" );
+			equal( ui.item.text(), "-Saarland", "element has correct text" );
+		}
+	});
+
+	setTimeout(function() {
+		element.menu( "widget" ).simulate( "keydown", { keyCode: "-".charCodeAt( 0 ) } );
+		start();
+	});
+});
+
 })( jQuery );

ui/menu.js

@@ -186,13 +186,9 @@ return $.widget( "ui.menu", {
 	},
 
 	_keydown: function( event ) {
-		var match, prev, character, skip, regex,
+		var match, prev, character, skip,
 			preventDefault = true;
 
-		function escape( value ) {
-			return value.replace( /[\-\[\]{}()*+?.,\\\^$|#\s]/g, "\\$&" );
-		}
-
 		switch ( event.keyCode ) {
 		case $.ui.keyCode.PAGE_UP:
 			this.previousPage( event );
@@ -241,10 +237,7 @@ return $.widget( "ui.menu", {
 				character = prev + character;
 			}
 
-			regex = new RegExp( "^" + escape( character ), "i" );
-			match = this.activeMenu.find( this.options.items ).filter(function() {
-				return regex.test( $( this ).text() );
-			});
+			match = this._filterMenuItems( character );
 			match = skip && match.index( this.active.next() ) !== -1 ?
 				this.active.nextAll( ".ui-menu-item" ) :
 				match;
@@ -253,10 +246,7 @@ return $.widget( "ui.menu", {
 			// to move down the menu to the first item that starts with that character
 			if ( !match.length ) {
 				character = String.fromCharCode( event.keyCode );
-				regex = new RegExp( "^" + escape( character ), "i" );
-				match = this.activeMenu.find( this.options.items ).filter(function() {
-					return regex.test( $( this ).text() );
-				});
+				match = this._filterMenuItems( character );
 			}
 
 			if ( match.length ) {
@@ -640,6 +630,20 @@ return $.widget( "ui.menu", {
 			this.collapseAll( event, true );
 		}
 		this._trigger( "select", event, ui );
+	},
+
+	_filterMenuItems: function(character) {
+		var escapedCharacter = character.replace( /[\-\[\]{}()*+?.,\\\^$|#\s]/g, "\\$&" ),
+			regex = new RegExp( "^" + escapedCharacter, "i" );
+
+		return this.activeMenu
+			.find( this.options.items )
+
+			// Only match on items, not dividers or other content (#10571)
+			.filter( ".ui-menu-item" )
+			.filter(function() {
+				return regex.test( $( this ).text() );
+			});
 	}
 });