Accessibility: Improve focus handling and audible feedback on the Posts Quick-Bulk Edit.

Avoids a focus loss when saving or closing the form moving focus back to a proper place.
Uses `wp.a11y.speak()` to dispatch successful edits and error messages to screen readers.

Fixes #34756.
Built from https://develop.svn.wordpress.org/trunk@36303


git-svn-id: http://core.svn.wordpress.org/trunk@36270 1a063a9b-81f0-0310-95a4-ce76da25c4cd

wp-admin/js/inline-edit-post.js

@@ -1,7 +1,8 @@
 /* global inlineEditL10n, ajaxurl, typenow */
+window.wp = window.wp || {};
 
 var inlineEditPost;
-(function($) {
+( function( $, wp ) {
 inlineEditPost = {
 
 	init : function(){
@@ -62,7 +63,11 @@ inlineEditPost = {
 		$('select[name="_status"] option[value="future"]', bulkRow).remove();
 
 		$('#doaction, #doaction2').click(function(e){
-			var n = $(this).attr('id').substr(2);
+			var n;
+
+			t.whichBulkButtonId = $( this ).attr( 'id' );
+			n = t.whichBulkButtonId.substr( 2 );
+
 			if ( 'edit' === $( 'select[name="' + n + '"]' ).val() ) {
 				e.preventDefault();
 				t.setBulk();
@@ -244,6 +249,7 @@ inlineEditPost = {
 		return false;
 	},
 
+	// Ajax saving is only for Quick Edit.
 	save : function(id) {
 		var params, fields, page = $('.post_status_page').val() || '';
 
@@ -267,6 +273,8 @@ inlineEditPost = {
 		// make ajax request
 		$.post( ajaxurl, params,
 			function(r) {
+				var $errorSpan = $( '#edit-' + id + ' .inline-edit-save .error' );
+
 				$( 'table.widefat .spinner' ).removeClass( 'is-active' );
 				$( '.ac_results' ).hide();
 
@@ -274,13 +282,19 @@ inlineEditPost = {
 					if ( -1 !== r.indexOf( '<tr' ) ) {
 						$(inlineEditPost.what+id).siblings('tr.hidden').addBack().remove();
 						$('#edit-'+id).before(r).remove();
-						$(inlineEditPost.what+id).hide().fadeIn();
+						$( inlineEditPost.what + id ).hide().fadeIn( 400, function() {
+							// Move focus back to the Quick Edit link. $( this ) is the row being animated.
+							$( this ).find( '.editinline' ).focus();
+							wp.a11y.speak( inlineEditL10n.saved );
+						});
 					} else {
 						r = r.replace( /<.[^<>]*?>/g, '' );
-						$('#edit-'+id+' .inline-edit-save .error').html(r).show();
+						$errorSpan.html( r ).show();
+						wp.a11y.speak( $errorSpan.text() );
 					}
 				} else {
-					$('#edit-'+id+' .inline-edit-save .error').html(inlineEditL10n.error).show();
+					$errorSpan.html( inlineEditL10n.error ).show();
+					wp.a11y.speak( inlineEditL10n.error );
 				}
 			},
 		'html');
@@ -288,6 +302,7 @@ inlineEditPost = {
 		return false;
 	},
 
+	// Revert is for both Quick Edit and Bulk Edit.
 	revert : function(){
 		var $tableWideFat = $( '.widefat' ),
 			id = $( '.inline-editor', $tableWideFat ).attr( 'id' );
@@ -300,10 +315,13 @@ inlineEditPost = {
 				$( '#bulk-edit', $tableWideFat ).removeClass( 'inline-editor' ).hide().siblings( '.hidden' ).remove();
 				$('#bulk-titles').empty();
 				$('#inlineedit').append( $('#bulk-edit') );
+				// Move focus back to the Bulk Action button that was activated.
+				$( '#' + inlineEditPost.whichBulkButtonId ).focus();
 			} else {
 				$('#'+id).siblings('tr.hidden').addBack().remove();
 				id = id.substr( id.lastIndexOf('-') + 1 );
-				$(this.what+id).show();
+				// Show the post row and move focus back to the Quick Edit link.
+				$( this.what + id ).show().find( '.editinline' ).focus();
 			}
 		}
 
@@ -362,4 +380,4 @@ $( document ).on( 'heartbeat-tick.wp-check-locked-posts', function( e, data ) {
 	}
 });
 
-}(jQuery));
+})( jQuery, window.wp );

wp-includes/script-loader.php

@@ -560,12 +560,13 @@ function wp_default_scripts( &$scripts ) {
 
 		$scripts->add( 'theme', "/wp-admin/js/theme$suffix.js", array( 'wp-backbone', 'wp-a11y' ), false, 1 );
 
-		$scripts->add( 'inline-edit-post', "/wp-admin/js/inline-edit-post$suffix.js", array( 'jquery', 'suggest' ), false, 1 );
+		$scripts->add( 'inline-edit-post', "/wp-admin/js/inline-edit-post$suffix.js", array( 'jquery', 'suggest', 'wp-a11y' ), false, 1 );
 		did_action( 'init' ) && $scripts->localize( 'inline-edit-post', 'inlineEditL10n', array(
-			'error' => __('Error while saving the changes.'),
-			'ntdeltitle' => __('Remove From Bulk Edit'),
-			'notitle' => __('(no title)'),
+			'error'      => __( 'Error while saving the changes.' ),
+			'ntdeltitle' => __( 'Remove From Bulk Edit' ),
+			'notitle'    => __( '(no title)' ),
 			'comma'      => trim( _x( ',', 'tag delimiter' ) ),
+			'saved'      => __( 'Changes saved.' ),
 		) );
 
 		$scripts->add( 'inline-edit-tax', "/wp-admin/js/inline-edit-tax$suffix.js", array( 'jquery', 'wp-a11y' ), false, 1 );

wp-includes/version.php

@@ -4,7 +4,7 @@
  *
  * @global string $wp_version
  */
-$wp_version = '4.5-alpha-36302';
+$wp_version = '4.5-alpha-36303';
 
 /**
  * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.