-OO.ui.SelectWidget.prototype.onFocus = function () {
- // The styles for focus state depend on one of the items being selected.
- if ( !this.getSelectedItem() ) {
- this.selectItem( this.getFirstSelectableItem() );
+OO.ui.SelectWidget.prototype.onFocus = function ( event ) {
+ if ( event.target === this.$element[ 0 ] ) {
+ // This widget was focussed, e.g. by the user tabbing to it.
+ // The styles for focus state depend on one of the items being selected.
+ if ( !this.getSelectedItem() ) {
+ this.selectItem( this.getFirstSelectableItem() );
+ }
+ } else {
+ // One of the options got focussed (and the event bubbled up here).
+ // They can't be tabbed to, but they can be activated using accesskeys.
+ this.selectItem( this.getTargetItem( event ) );
+ this.$element.focus();