library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2024-11-21 11:04:24 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Menu: Use ui-state-active consistently

Browse Source 
So far we were using ui-state-active on active parent items,
ui-state-focus on active child items. The theme update highlighted the
visual inconsistency. With this change, only ui-state-active is used.

Fixes #10692
This commit is contained in:
Jörn Zaefferer 2015-01-19 17:00:57 +01:00
parent 7137c90b18
commit 0bbd156918
6 changed files with 16 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
tests/unit/autocomplete/autocomplete_core.js
View File

@ -16,7 +16,7 @@ test( "prevent form submit on enter when menu is active", function() {
event = $.Event( "keydown" );
event.keyCode = $.ui.keyCode.DOWN;
element.trigger( event );
equal( menu.find( ".ui-menu-item-wrapper.ui-state-focus" ).length, 1,
equal( menu.find( ".ui-menu-item-wrapper.ui-state-active" ).length, 1,
"menu item is active" );
event = $.Event( "keydown" );

2
tests/unit/autocomplete/autocomplete_options.js
View File

@ -77,7 +77,7 @@ function autoFocusTest( afValue, focusedLength ) {
open: function() {
equal(
element.autocomplete( "widget" )
.find( ".ui-menu-item-wrapper.ui-state-focus" )
.find( ".ui-menu-item-wrapper.ui-state-active" )
.length,
focusedLength,
"first item is " + (afValue ? "" : "not") + " auto focused" );

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

@ -91,7 +91,7 @@ asyncTest( "handle focus of menu with active item", function() {
expect( 1 );
var element = $( "#menu1" ).menu({
focus: function( event ) {
log( $( event.target ).find( ".ui-state-focus" ).parent().index() );
log( $( event.target ).find( ".ui-menu-item-wrapper.ui-state-active" ).parent().index() );
}
});
@ -177,7 +177,7 @@ asyncTest( "handle keyboard navigation on menu without scroll and without submen
log( $( ui.item[ 0 ] ).text() );
},
focus: function( event ) {
log( $( event.target ).find( ".ui-state-focus" ).parent().index() );
log( $( event.target ).find( ".ui-menu-item-wrapper.ui-state-active" ).parent().index() );
}
});
@ -243,7 +243,7 @@ asyncTest( "handle keyboard navigation on menu without scroll and with submenus"
log( $( ui.item[0] ).text() );
},
focus: function( event ) {
log( $( event.target ).find( ".ui-state-focus" ).parent().index() );
log( $( event.target ).find( ".ui-menu-item-wrapper.ui-state-active:last" ).parent().index() );
}
});
@ -363,7 +363,7 @@ asyncTest( "handle keyboard navigation on menu with scroll and without submenus"
log( $( ui.item[ 0 ] ).text() );
},
focus: function( event ) {
log( $( event.target ).find( ".ui-state-focus" ).parent().index() );
log( $( event.target ).find( ".ui-menu-item-wrapper.ui-state-active:last" ).parent().index() );
}
});
@ -438,7 +438,7 @@ asyncTest( "handle keyboard navigation on menu with scroll and with submenus", f
log( $( ui.item[ 0 ] ).text() );
},
focus: function( event ) {
log( $( event.target ).find( ".ui-state-focus" ).parent().index());
log( $( event.target ).find( ".ui-menu-item-wrapper.ui-state-active:last" ).parent().index());
}
});
@ -533,7 +533,7 @@ asyncTest( "handle keyboard navigation and mouse click on menu with disabled ite
log( $( ui.item[0] ).text() );
},
focus: function( event ) {
log( $( event.target ).find( ".ui-state-focus" ).parent().index());
log( $( event.target ).find( ".ui-menu-item-wrapper.ui-state-active" ).parent().index());
}
});
@ -585,7 +585,7 @@ asyncTest( "handle keyboard navigation and mouse click on menu with dividers and
log( $( ui.item[0] ).text() );
},
focus: function( event ) {
log( $( event.target ).find( ".ui-state-focus" ).parent().index() );
log( $( event.target ).find( ".ui-menu-item-wrapper.ui-state-active" ).parent().index() );
}
});
@ -612,7 +612,7 @@ asyncTest( "handle keyboard navigation with spelling of menu items", function()
expect( 3 );
var element = $( "#menu2" ).menu({
focus: function( event ) {
log( $( event.target ).find( ".ui-state-focus" ).parent().index() );
log( $( event.target ).find( ".ui-menu-item-wrapper.ui-state-active" ).parent().index() );
}
});
@ -635,7 +635,7 @@ asyncTest( "Keep focus on selected item (see #10644)", function() {
expect( 1 );
var element = $( "#menu2" ).menu({
focus: function( event ) {
log( $( event.target ).find( ".ui-state-focus" ).parent().index() );
log( $( event.target ).find( ".ui-menu-item-wrapper.ui-state-active" ).parent().index() );
}
});

2
tests/unit/selectmenu/selectmenu_core.js
View File

@ -273,7 +273,7 @@ $.each([
});
function checkItemClasses() {
focusedItem = menu.find( "li .ui-state-focus" );
focusedItem = menu.find( ".ui-menu-item-wrapper.ui-state-active" );
equal( focusedItem.length, 1, "only one item has ui-state-focus class" );
equal( focusedItem.attr( "id" ), wrappers.eq( element[ 0 ].selectedIndex ).attr( "id" ),
"selected item has ui-state-focus class" );

8
ui/menu.js
View File

@ -372,9 +372,7 @@ return $.widget( "ui.menu", {
this._scrollIntoView( item );
this.active = item.first();
focused = this.active.children( ".ui-menu-item-wrapper" )
.addClass( "ui-state-focus" )
.removeClass( "ui-state-active" );
focused = this.active.children( ".ui-menu-item-wrapper" ).addClass( "ui-state-active" );
// Only update aria-activedescendant if there's a role
// otherwise we assume focus is managed elsewhere
@ -433,7 +431,7 @@ return $.widget( "ui.menu", {
return;
}
this.active.children( ".ui-menu-item-wrapper" ).removeClass( "ui-state-focus" );
this.active.children( ".ui-menu-item-wrapper" ).removeClass( "ui-state-active" );
this.active = null;
this._trigger( "blur", event, { item: this.active } );
@ -503,7 +501,7 @@ return $.widget( "ui.menu", {
.attr( "aria-hidden", "true" )
.attr( "aria-expanded", "false" )
.end()
.find( ".ui-state-active" ).not( ".ui-state-focus" )
.find( ".ui-state-active" ).not( ".ui-menu-item-wrapper" )
.removeClass( "ui-state-active" );
},

2
ui/selectmenu.js
View File

@ -253,7 +253,7 @@ return $.widget( "ui.selectmenu", {
} else {
// Menu clears focus on close, reset focus to selected item
this.menu.find( ".ui-state-focus" ).removeClass( "ui-state-focus" );
this.menu.find( ".ui-state-active" ).removeClass( "ui-state-active" );
this.menuInstance.focus( null, this._getSelectedItem() );
}