library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2024-10-05 01:44:18 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Menu: Better handling of divider elements and menu items without anchors.

Browse Source
This commit is contained in:
kborchers 2012-05-24 23:44:51 -05:00
parent f63bb4fbc4
commit fe7ca1f1c3
5 changed files with 83 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
tests/unit/menu/menu.html
View File

@ -88,8 +88,11 @@
<a href="#">Delphi</a>
<ul>
<li class="foo"><a class="foo" href="#">Ada</a></li>
<li> - </li>
<li class="foo"><a class="foo" href="#">Saarland</a></li>
<li></li>
<li class="foo"><a class="foo" href="#">Salzburg</a></li>
<li>&ndash;</li>
</ul>
</li>
<li class="foo"><a class="foo" href="#">Perch</a></li>

27
tests/unit/menu/menu_events.js
View File

@ -315,16 +315,27 @@ asyncTest("handle keyboard navigation on menu without scroll and with submenus",
equal( $("#log").html(), "4,keydown,", "Keydown ESCAPE (close submenu)");
log("keydown",true);
element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
setTimeout( menukeyboard5, 50 );
element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
element.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } );
setTimeout( function() {
element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
element.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } );
setTimeout( function() {
element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
element.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
equal( $("#log").html(), "0,4,2,0,1,0,6,5,keydown,", "Keydown skip dividers and items without anchors");
log("keydown",true);
element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
setTimeout( menukeyboard6, 50 );
}, 50 );
}, 50 );
}
function menukeyboard5() {
equal( $("#log").html(), "0,keydown,", "Keydown ENTER (open submenu)");
log("keydown",true);
element.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
equal( $("#log").html(), "Ada,keydown,", "Keydown ENTER (select item)");
function menukeyboard6() {
equal( $("#log").html(), "Ada,keydown,", "Keydown ENTER (open submenu)");
start();
}

6
tests/unit/menu/menu_methods.js
View File

@ -29,13 +29,17 @@ test( "enable/disable", function() {
});
test( "refresh", function() {
expect( 3 );
expect( 5 );
var menu = $( "#menu1" ).menu();
equal(menu.find(".ui-menu-item").length,5,"Incorrect number of menu items");
menu.append("<li><a href='#'>test item</a></li>").menu("refresh");
equal(menu.find(".ui-menu-item").length,6,"Incorrect number of menu items");
menu.find(".ui-menu-item:last").remove().end().menu("refresh");
equal(menu.find(".ui-menu-item").length,5,"Incorrect number of menu items");
menu.append("<li>---</li>").menu("refresh");
equal(menu.find(".ui-menu-item").length,5,"Incorrect number of menu items");
menu.children(":last").remove().end().menu("refresh");
equal(menu.find(".ui-menu-item").length,5,"Incorrect number of menu items");
});
test("destroy", function() {

51
tests/visual/menu/menu.html
View File

@ -15,7 +15,7 @@
$( "<p>" ).text( "Selected: " + ui.item.text() ).appendTo( "#log" );
}
$( "#menu1, #menu2, #menu3, .menu4" ).menu({
$( "#menu1, #menu2, #menu3, .menu4, #menu7" ).menu({
select: logger
});
@ -58,7 +58,6 @@
<li><a href="#">Ada</a></li>
<li><a href="#">Adamsville</a></li>
<li><a href="#">Addyston</a></li>
<li></li>
<li>
<a href="#">Delphi</a>
<ul>
@ -257,6 +256,54 @@
</div>
</div>
<h2>Inline with dividers and elements without anchors</h2>
<ul id="menu7">
<li>Group 1</li>
<li class="ui-state-disabled"><a href="#">Aberdeen</a></li>
<li><a href="#">Ada</a></li>
<li><a href="#">Adamsville</a></li>
<li><a href="#">Addyston</a></li>
<li></li>
<li>Group 2</li>
<li>
<a href="#">Delphi</a>
<ul>
<li class="ui-state-disabled"><a href="#">Ada</a></li>
<li><a href="#">Saarland</a></li>
<li><a href="#">Salzburg</a></li>
</ul>
</li>
<li><a href="#">Saarland</a></li>
<li>---</li>
<li>Group 3</li>
<li>
<a href="#">Salzburg</a>
<ul>
<li>
<a href="#">Delphi</a>
<ul>
<li><a href="#">Ada</a></li>
<li> - </li>
<li><a href="#">Saarland</a></li>
<li>&mdash;</li>
<li><a href="#">Salzburg</a></li>
<li>&ndash;</li>
</ul>
</li>
<li>
<a href="#">Delphi</a>
<ul>
<li><a href="#">Ada</a></li>
<li><a href="#">Saarland</a></li>
<li><a href="#">Salzburg</a></li>
</ul>
</li>
<li><a href="#">Perch</a></li>
</ul>
</li>
<li class="ui-state-disabled"><a href="#">Amesville</a></li>
</ul>
<div style="position: absolute; top: 1em; right: 1em;">
Log:
<div id="log" style="height: 400px; width: 300px; overflow: auto; border: 1px solid #000;"></div>

9
ui/jquery.ui.menu.js vendored
View File

@ -299,8 +299,13 @@ $.widget( "ui.menu", {
}
});
// initialize unlinked menu-items as dividers
menus.children( ":not(.ui-menu-item)" ).addClass( "ui-widget-content ui-menu-divider" );
// initialize unlinked menu-items containing spaces and/or dashes only as dividers
menus.children( ":not(.ui-menu-item)" ).each( function() {
var item = $( this );
if ( !/[^\-—–\s]/.test( item.text() ) ) {
item.addClass( "ui-widget-content ui-menu-divider" );
}
});
// add aria-disabled attribute to any disabled menu item
menus.children( ".ui-state-disabled" ).attr( "aria-disabled", "true" );