Make WordPress Core

Changeset 47506


Ignore:
Timestamp:
03/25/2020 04:53:06 AM (4 years ago)
Author:
noisysocks
Message:

Comments: Fix title not updating when replying to a comment

When replying to an existing comment, the comment form is moved to below the
existing comment with JS, but the form heading was not being updated. This
fixes the issue by introducing a new data-attribute to the reply link with the
correct heading string, and applying that string to the heading when the form
is moved.

Props isabel_brison, azaozz, peterwilsoncc.
Fixes #38009.

Location:
trunk/src
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/js/_enqueues/lib/comment-reply.js

    r47122 r47506  
    1515    // Settings.
    1616    var config = {
    17         commentReplyClass : 'comment-reply-link',
    18         cancelReplyId     : 'cancel-comment-reply-link',
    19         commentFormId     : 'commentform',
    20         temporaryFormId   : 'wp-temp-form-div',
    21         parentIdFieldId   : 'comment_parent',
    22         postIdFieldId     : 'comment_post_ID'
     17        commentReplyClass   : 'comment-reply-link',
     18        commentReplyTitleId : 'reply-title',
     19        cancelReplyId       : 'cancel-comment-reply-link',
     20        commentFormId       : 'commentform',
     21        temporaryFormId     : 'wp-temp-form-div',
     22        parentIdFieldId     : 'comment_parent',
     23        postIdFieldId       : 'comment_post_ID'
    2324    };
    2425
     
    172173
    173174        // Move the respond form back in place of the temporary element.
    174         temporaryElement.parentNode.replaceChild( respondElement ,temporaryElement );
     175        var headingText = temporaryElement.textContent;
     176        temporaryElement.parentNode.replaceChild( respondElement, temporaryElement );
    175177        cancelLink.style.display = 'none';
     178        var replyHeadingElement = getElementById( config.commentReplyTitleId );
     179        var replyHeadingTextNode = replyHeadingElement && replyHeadingElement.firstChild;
     180        if ( replyHeadingTextNode && replyHeadingTextNode.nodeType === Node.TEXT_NODE && headingText ) {
     181            replyHeadingTextNode.textContent = headingText;
     182        }
    176183        event.preventDefault();
    177184    }
     
    185192     */
    186193    function clickEvent( event ) {
     194        var replyNode = getElementById( config.commentReplyTitleId );
     195        var defaultReplyHeading = replyNode && replyNode.firstChild.textContent;
    187196        var replyLink = this,
    188197            commId    = getDataAttribute( replyLink, 'belowelement'),
    189198            parentId  = getDataAttribute( replyLink, 'commentid' ),
    190             respondId = getDataAttribute( replyLink, 'respondelement'),
    191             postId    = getDataAttribute( replyLink, 'postid'),
     199            respondId = getDataAttribute( replyLink, 'respondelement' ),
     200            postId    = getDataAttribute( replyLink, 'postid' ),
     201            replyTo   = getDataAttribute( replyLink, 'replyto' ) || defaultReplyHeading,
    192202            follow;
    193203
     
    204214         * therefore the click event needs to reference the global scope.
    205215         */
    206         follow = window.addComment.moveForm(commId, parentId, respondId, postId);
     216        follow = window.addComment.moveForm( commId, parentId, respondId, postId, replyTo );
    207217        if ( false === follow ) {
    208218            event.preventDefault();
     
    293303     * @param {String} respondId  HTML ID of 'respond' element.
    294304     * @param {String} postId     Database ID of the post.
    295      */
    296     function moveForm( addBelowId, commentId, respondId, postId ) {
     305     * @param {String} replyTo    Form heading content.
     306     */
     307    function moveForm( addBelowId, commentId, respondId, postId, replyTo ) {
    297308        // Get elements based on their IDs.
    298309        var addBelowElement = getElementById( addBelowId );
     
    304315        var element, cssHidden, style;
    305316
     317        var replyHeading = getElementById( config.commentReplyTitleId );
     318        var replyHeadingTextNode = replyHeading && replyHeading.firstChild;
     319
    306320        if ( ! addBelowElement || ! respondElement || ! parentIdField ) {
    307321            // Missing key elements, fail.
    308322            return;
     323        }
     324
     325        if ( 'undefined' === typeof replyTo ) {
     326            replyTo = replyHeadingTextNode && replyHeadingTextNode.textContent;
    309327        }
    310328
     
    320338        cancelElement.style.display = '';
    321339        addBelowElement.parentNode.insertBefore( respondElement, addBelowElement.nextSibling );
    322 
     340        if ( replyHeadingTextNode.nodeType === Node.TEXT_NODE ) {
     341            replyHeadingTextNode.textContent = replyTo;
     342        }
    323343        /*
    324344         * This is for backward compatibility with third party commenting systems
     
    388408        var temporaryFormId  = config.temporaryFormId;
    389409        var temporaryElement = getElementById( temporaryFormId );
     410        var replyElement = getElementById( config.commentReplyTitleId );
     411        var initialHeadingText = ( 'undefined' !== typeof replyElement ) ? replyElement.firstChild.textContent : '';
    390412
    391413        if ( temporaryElement ) {
     
    397419        temporaryElement.id = temporaryFormId;
    398420        temporaryElement.style.display = 'none';
     421        temporaryElement.textContent = initialHeadingText;
    399422        respondElement.parentNode.insertBefore( temporaryElement, respondElement );
    400423    }
  • trunk/src/wp-includes/comment-template.php

    r47366 r47506  
    17041704            'belowelement'   => $args['add_below'] . '-' . $comment->comment_ID,
    17051705            'respondelement' => $args['respond_id'],
     1706            'replyto'        => sprintf( $args['reply_to_text'], $comment->comment_author ),
    17061707        );
    17071708
Note: See TracChangeset for help on using the changeset viewer.