diff --git a/src/wp-includes/js/tinymce/plugins/wplink/plugin.js b/src/wp-includes/js/tinymce/plugins/wplink/plugin.js index c7836b3763..715a0c278a 100644 --- a/src/wp-includes/js/tinymce/plugins/wplink/plugin.js +++ b/src/wp-includes/js/tinymce/plugins/wplink/plugin.js @@ -440,10 +440,26 @@ $input.autocomplete( 'search' ); } } ) + // Returns a jQuery object containing the menu element. .autocomplete( 'widget' ) .addClass( 'wplink-autocomplete' ) .attr( 'role', 'listbox' ) - .removeAttr( 'tabindex' ); // Remove the `tabindex=0` attribute added by jQuery UI. + .removeAttr( 'tabindex' ) // Remove the `tabindex=0` attribute added by jQuery UI. + /* + * Looks like Safari and VoiceOver need an `aria-selected` attribute. See ticket #33301. + * The `menufocus` and `menublur` events are the same events used to add and remove + * the `ui-state-focus` CSS class on the menu items. See jQuery UI Menu Widget. + */ + .on( 'menufocus', function( event, ui ) { + ui.item.attr( 'aria-selected', 'true' ); + }) + .on( 'menublur', function() { + /* + * The `menublur` event returns an object where the item is `null` + * so we need to find the active item with other means. + */ + $( this ).find( '[aria-selected="true"]' ).removeAttr( 'aria-selected' ); + }); } tinymce.$( input ).on( 'keydown', function( event ) {