Selectmenu: fixes

Author: tjvantoll

demos/selectmenu/custom_render.html

@@ -16,7 +16,8 @@
 	$(function() {
 		$.widget( "custom.iconselectmenu", $.ui.selectmenu, {
 			_renderItem: function( ul, item ) {
-				var li = $( "<li>", { text: item.label } );
+				var li = $( "<li>" ),
+					wrapper = $( "<div>", { text: item.label } );
 
 				if ( item.disabled ) {
 					li.addClass( "ui-state-disabled" );
@@ -26,9 +27,9 @@
 					style: item.element.attr( "data-style" ),
 					"class": "ui-icon " + item.element.attr( "data-class" )
 				})
-					.appendTo( li );
+					.appendTo( wrapper );
 
-				return li.appendTo( ul );
+				return li.append( wrapper ).appendTo( ul );
 			}
 		});
 
@@ -63,7 +64,7 @@
 		}
 
 		/* select with custom icons */
-		.ui-selectmenu-menu .ui-menu.customicons .ui-menu-item {
+		.ui-selectmenu-menu .ui-menu.customicons .ui-menu-item-wrapper {
 			padding: 0.5em 0 0.5em 3em;
 		}
 		.ui-selectmenu-menu .ui-menu.customicons .ui-menu-item .ui-icon {

tests/unit/selectmenu/selectmenu_core.js

@@ -241,7 +241,7 @@ $.each([
 	asyncTest( "empty option - " + settings.type, function() {
 		expect( 7 );
 
-		var button, menu, links, link,
+		var button, menu, wrappers, wrapper,
 			element = $( settings.selector );
 
 		element.find( "option" ).first().text( "" );
@@ -251,20 +251,21 @@ $.each([
 
 		button.simulate( "focus" );
 		setTimeout(function() {
-			links = menu.find( "li:not(.ui-selectmenu-optgroup)" );
-			link = links.first();
+			wrappers = menu.find( "li:not(.ui-selectmenu-optgroup) .ui-menu-item-wrapper" );
+			wrapper = wrappers.first();
 
 			button.trigger( "click" );
 
-			equal( links.length, element.find( "option" ).length,
+			equal( wrappers.length, element.find( "option" ).length,
 				"correct amount of list elements" );
-			ok( link.outerHeight() > 10, "empty item seems to have reasonable height" );
-			ok( link.attr( "id" ), "empty item has id attribute" );
-			ok( link.hasClass( "ui-menu-item" ), "empty item has ui-menu-item class" );
-			ok( !link.hasClass( "ui-menu-divider" ),
+			ok( wrapper.outerHeight() > 10, "empty item seems to have reasonable height" );
+			ok( wrapper.attr( "id" ), "empty item has id attribute" );
+			ok( wrapper.parent().hasClass( "ui-menu-item" ),
+				"empty item has ui-menu-item class" );
+			ok( !wrapper.hasClass( "ui-menu-divider" ),
 				"empty item does not have ui-menu-divider class" );
-			equal( link.attr( "tabindex" ), -1, "empty item has tabindex" );
-			equal( link.attr( "role" ), "option", "empty item has role option" );
+			equal( wrapper.attr( "tabindex" ), -1, "empty item has tabindex" );
+			equal( wrapper.attr( "role" ), "option", "empty item has role option" );
 
 			start();
 		});