Ticket #43376: 43376.diff

src/wp-admin/includes/class-wp-comments-list-table.php

@@ -635 +635 @@
                 if ( 'spam' !== $the_comment_status && 'trash' !== $the_comment_status ) {
                         $actions['edit'] = "<a href='comment.php?action=editcomment&amp;c={$comment->comment_ID}' aria-label='" . esc_attr__( 'Edit this comment' ) . "'>" . __( 'Edit' ) . '</a>';
 
-                        $format = '<a data-comment-id="%d" data-post-id="%d" data-action="%s" class="%s" aria-label="%s" href="#">%s</a>';
+                        $format = '<button type="button" data-comment-id="%d" data-post-id="%d" data-action="%s" class="%s button-link" aria-expanded="false" aria-label="%s">%s</button>';
 
                         $actions['quickedit'] = sprintf( $format, $comment->comment_ID, $comment->comment_post_ID, 'edit', 'vim-q comment-inline', esc_attr__( 'Quick edit this comment inline' ), __( 'Quick&nbsp;Edit' ) );
 

src/wp-admin/js/edit-comments.js

@@ -632 +632 @@
         },
 
         close : function() {
-                var c, replyrow = $('#replyrow');
+                var commentRow = $(),
+                        replyRow = $( '#replyrow' );
 
                 // replyrow is not showing?
-                if ( replyrow.parent().is('#com-reply') )
+                if ( replyRow.parent().is( '#com-reply' ) ) {
                         return;
+                }
 
-                if ( this.cid && this.act == 'edit-comment' ) {
-                        c = $('#comment-' + this.cid);
-                        c.fadeIn(300, function(){ c.show(); }).css('backgroundColor', '');
+                if ( this.cid ) {
+                        commentRow = $( '#comment-' + this.cid );
                 }
 
+                /*
+                 * When closing the Quick Edit form, show the comment row and move focus
+                 * back to the Quick Edit button.
+                 */
+                if ( 'edit-comment' === this.act ) {
+                        commentRow.fadeIn( 300, function() {
+                                commentRow
+                                        .show()
+                                        .find( '.vim-q' )
+                                                .attr( 'aria-expanded', 'false' )
+                                                .focus();
+                        } ).css( 'backgroundColor', '' );
+                }
+
+                // When closing the Reply form, move focus back to the Reply button.
+                if ( 'replyto-comment' === this.act ) {
+                        commentRow.find( '.vim-r' )
+                                .attr( 'aria-expanded', 'false' )
+                                .focus();
+                }
+
                 // reset the Quicktags buttons
                 if ( typeof QTags != 'undefined' )
                         QTags.closeAllTags('replycontent');
@@ -649 +671 @@
 
                 $('#add-new-comment').css('display', '');
 
-                replyrow.hide();
-                $('#com-reply').append( replyrow );
+                replyRow.hide();
+                $( '#com-reply' ).append( replyRow );
                 $('#replycontent').css('height', '').val('');
                 $('#edithead input').val('');
-                $( '.notice-error', replyrow )
+                $( '.notice-error', replyRow )
                         .addClass( 'hidden' )
                         .find( '.error' ).empty();
-                $( '.spinner', replyrow ).removeClass( 'is-active' );
+                $( '.spinner', replyRow ).removeClass( 'is-active' );
 
                 this.cid = '';
                 this.originalContent = '';
@@ -960 +982 @@
         }
 
         // Quick Edit and Reply have an inline comment editor.
-        $( '#the-comment-list' ).on( 'click', '.comment-inline', function (e) {
-                e.preventDefault();
+        $( '#the-comment-list' ).on( 'click', '.comment-inline', function() {
                 var $el = $( this ),
                         action = 'replyto';
 
@@ -969 +990 @@
                         action = $el.data( 'action' );
                 }
 
+                $( this ).attr( 'aria-expanded', 'true' );
                 commentReply.open( $el.data( 'commentId' ), $el.data( 'postId' ), action );
         } );
 });