Don't rebuild the entire comment field/thread when posting a comment

+1 for this issue, would like to test it for you @idebr, I guess you already did the conceptual heavy lifting, but the branch-patch does not apply anymore.

If you would update the branch to be applicable, I would be more than happy to test the feature for you and give feedback :)

I'm in the same boat as @fisherman90, +1 for this, that behavior is not expected and confusing, and I'm happy to test the patch. @idebr

Any update on something usable?

Here is a forked version of what I have been using for a while that has it mostly working for my use case. See my comment above to what this does.

Unfortunately I do not have the time at the moment to provide patches or a merge request. This was forked a few releases ago so there are most likely some things that are in the official module that have not been merged in here.

It's rough around the edges, but does work in my case.

I hope this can help someone move the issue forward.

loze → changed the visibility of the branch 3113225-lozeone to hidden.

loze → changed the visibility of the branch 3113225-loze to hidden.

loze → changed the visibility of the branch 3113225-dont-rebuild-the to hidden.

loze → changed the visibility of the branch 8.x-1.x to hidden.

loze → changed the visibility of the branch 3113225-dont-rebuild-the to active.

Hey @loze,

Using https://www.drupal.org/project/comment_ajax_pager → , when click on load more it loads next set of records but reply button for each thread is not coming. Not sure which module causing this issue. I am using D10.1.6. Appreciate if someone help here.

Thanks

@vivek.kekare Ive stopped using comment_ajax_pager, and my changes in the .zip file introduce it's own ajax pager. That's the code I've been using and it works for me in my limited use case.

I would be surprised if this module and comment_ajax_pager worked together, neither have a stable release and I was unable to get it to work to my liking when I tried a long time ago.

MR13 is my latest version of this. Although the tests are failing, it does work.

The comment in #6 explains what it adds and changes.

You can see a video of it working, on a clean D10 install here:
https://www.dropbox.com/scl/fi/rx256fku2hokk92efim4x/MR13-demo-ajax_comm...

you can apply the patch from https://git.drupalcode.org/project/ajax_comments/-/merge_requests/13.patch to 8.x-1.x-dev and test it for yourself.

idebr → closed merge request !1

Conceptually this approach is better than the current indeed. However, it does not solve 🐛 Ajax not working when using non-default view mode. Needs work where multiple comments threads are active on the same page.

I'll start working on some test coverage for 🐛 Ajax not working when using non-default view mode. Needs work first.

Similar to 🐛 Ajax not working when using non-default view mode. Needs work the TempStore implementation of "view mode" is problematic: it is saved per entity type, but fields may be configured differently per bundle / field.

Actionable points:

1. Using sufficiently unique html ids removes the need for using the TempStore, see 🐛 Having the same type of entity on one page with comments enabled breaks the HTML ID uniqueness of the wrapper RTBC . This essentially reverts #2743739: Allow multiple comment fields on the same page →
2. All code in ajax_comments_form_comment_form_alter should be moved to the \Drupal\ajax_comments\Form\AjaxCommentsForm, since Ajax Comments takes direct control of the form.
3. Attaching the ajax_comments library should be implemented through hook_preprocess_field instead of ajax_comments_entity_view_alter(), see https://www.drupal.org/node/2130757 →
4. Replacing the pager should preferable be done in a follow-up to reduce the cognitive load of this issue

Thank you for taking a look at this @idebr.

I agree with all your points and will work more on this.

MR 13 patch does not apply.

https://git.drupalcode.org/project/ajax_comments/-/merge_requests/13.patch

13.patch:2000: trailing whitespace.
      
13.patch:2184: trailing whitespace.

13.patch:2645: trailing whitespace.
        
13.patch:3006: trailing whitespace.
    
13.patch:3007: trailing whitespace.
    
Checking patch LICENSE.txt...
Checking patch ajax_comments.js...
error: while searching for:
(function ($, window, Drupal, drupalSettings) {

  "use strict";

 // Scroll to given element
  Drupal.AjaxCommands.prototype.ajaxCommentsScrollToElement = function (ajax, response, status) {
    try {
      var pos = $(response.selector).offset();
      $('html, body').animate({ scrollTop: pos.top}, 'slow');
    }
    catch (e) {
      console.log('ajaxComments-ScrollToElementError: ' + e.name);
    }
  };

  /**
   * Add the dummy div if they are not exist.
   * On the server side we have a current state of node and comments, but on client side we may have a outdated state
   * and some div's may be not present
   */
  Drupal.AjaxCommands.prototype.ajaxCommentsAddDummyDivAfter = function (ajax, response, status) {
    try {
      if (!$(response.selector).next().hasClass(response.class)) {
        $('<div class="' + response.class + '"></div>').insertAfter(response.selector);
      }
    }
    catch (e) {
      console.log('ajaxComments-AddDummyDivAfter: ' + e.name);
    }
  };

  /**
   * Override and extend the functionality of Drupal.Ajax.prototype.beforeSerialize.
   */
  (function (beforeSerialize) {
    Drupal.Ajax.prototype.beforeSerialize = function (element, options) {
      beforeSerialize.call(this, element, options);
      var wrapperHtmlId = $(element).data('wrapper-html-id') || null;
      if (wrapperHtmlId) {
        options.data['wrapper_html_id'] = wrapperHtmlId;
      }
    };
  })(Drupal.Ajax.prototype.beforeSerialize);

})(jQuery, this, Drupal, drupalSettings);

error: patch failed: ajax_comments.js:1
error: ajax_comments.js: patch does not apply
Checking patch ajax_comments.libraries.yml...
error: while searching for:
commands:
  version: VERSION
  js:
    ajax_comments.js: {}
  dependencies:
    - core/jquery
    - core/jquery.form
    - core/drupal
    - core/drupal.ajax
    - core/drupal.form

error: patch failed: ajax_comments.libraries.yml:1
error: ajax_comments.libraries.yml: patch does not apply
Checking patch ajax_comments.module...
error: while searching for:
 * AJAX comments module file.
 */

use Drupal\ajax_comments\Controller\AjaxCommentsController;
use Drupal\ajax_comments\Utility;
use Drupal\comment\CommentInterface;
use Drupal\node\NodeInterface;
use Drupal\Component\Serialization\Json;
use Drupal\Component\Utility\Html;
use Drupal\Core\Ajax\AjaxResponse;
use Drupal\Core\Ajax\AlertCommand;
use Drupal\Core\Entity\ContentEntityInterface;

error: patch failed: ajax_comments.module:5
error: ajax_comments.module: patch does not apply
Checking patch ajax_comments.routing.yml...
Checking patch config/schema/ajax_comments.schema.yml...
Checking patch css/ajax_comments.css...
Checking patch js/ajax_comments.js...
Checking patch src/Ajax/AjaxCommentsAddDummyDivAfterCommand.php...
Checking patch src/Ajax/AjaxCommentsAddIndentedDivCommand.php...
Checking patch src/Ajax/AjaxCommentsAppendToLastIndentCommand.php...
Checking patch src/Ajax/AjaxCommentsFadeAndRemoveCommand.php...
Checking patch src/Ajax/AjaxCommentsHighlightCommand.php...
Checking patch src/Ajax/AjaxCommentsInsertPageCommand.php...
Checking patch src/Ajax/AjaxCommentsRemoveCommentsCommand.php...
Checking patch src/Ajax/AjaxCommentsRemoveDescendantsCommand.php...
Checking patch src/Ajax/AjaxCommentsScrollToElementCommand.php...
Checking patch src/Controller/AjaxCommentsController.php...
error: while searching for:
use Drupal\Core\Entity\EntityTypeManagerInterface;
use Drupal\Core\Messenger\MessengerInterface;
use Drupal\Core\Render\RendererInterface;
use Drupal\Core\Session\AccountInterface;
use Drupal\Core\Url;
use Symfony\Component\DependencyInjection\ContainerInterface;
use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\HttpFoundation\RedirectResponse;
use Symfony\Component\Routing\RouterInterface;

/**
 * Controller routines for AJAX comments routes.
 */
class AjaxCommentsController extends ControllerBase {

  /**
   * Class prefix to apply to each comment.

error: patch failed: src/Controller/AjaxCommentsController.php:21
error: src/Controller/AjaxCommentsController.php: patch does not apply
Checking patch src/FieldSettingsHelper.php...
Checking patch src/Form/AjaxCommentsDeleteForm.php...
error: while searching for:
use Drupal\ajax_comments\Utility;
use Drupal\comment\CommentInterface;
use Drupal\comment\Form\DeleteForm;
use Drupal\Core\Entity\EntityRepositoryInterface;
use Drupal\Core\Entity\EntityTypeBundleInfoInterface;
use Drupal\Component\Datetime\TimeInterface;
use Drupal\Core\Form\FormStateInterface;
use Drupal\Core\Url;
use Symfony\Component\DependencyInjection\ContainerInterface;

error: patch failed: src/Form/AjaxCommentsDeleteForm.php:6
error: src/Form/AjaxCommentsDeleteForm.php: patch does not apply
Checking patch src/Form/AjaxCommentsForm.php...
error: while searching for:
use Drupal\ajax_comments\TempStore;
use Drupal\ajax_comments\Utility;
use Drupal\comment\CommentForm;
use Drupal\Component\Utility\Html;
use Drupal\Core\Entity\EntityRepositoryInterface;
use Drupal\Core\Form\FormStateInterface;
use Drupal\Core\Routing\CurrentRouteMatch;
use Drupal\Core\Routing\RouteMatch;
use Drupal\Core\Render\RendererInterface;
use Drupal\Core\Session\AccountInterface;
use Drupal\Core\Entity\EntityTypeBundleInfoInterface;
use Drupal\Component\Datetime\TimeInterface;
use Drupal\Core\Entity\EntityFieldManagerInterface;
use Drupal\Core\Url;
use Symfony\Component\DependencyInjection\ContainerInterface;
use Symfony\Component\HttpFoundation\RequestStack;

error: patch failed: src/Form/AjaxCommentsForm.php:6
error: src/Form/AjaxCommentsForm.php: patch does not apply
Checking patch src/Form/SettingsForm.php...
error: while searching for:

use Drupal\field_ui\FieldUI;
use Drupal\Core\Config\ConfigFactoryInterface;
use Drupal\Core\Entity\EntityTypeManagerInterface;
use Drupal\Core\Form\ConfigFormBase;
use Drupal\Core\Form\FormStateInterface;
use Drupal\Core\Url;
use Drupal\Core\Entity\EntityTypeBundleInfoInterface;

error: patch failed: src/Form/SettingsForm.php:4
error: src/Form/SettingsForm.php: patch does not apply
Checking patch src/TempStore.php...
error: while searching for:
   * @param string $selector
   *   The selector to retrieve.
   *
   * @return string
   *   The value of the selector.
   */
  public function getSelectorValue(Request $request, $selector) {
    $selectors = $this->getSelectors($request);
    $value = $selectors[$selector];
    return substr($value, strpos($value, '#') + 1);
  }

  /**

error: patch failed: src/TempStore.php:58
error: src/TempStore.php: patch does not apply
Checking patch src/Utility.php...
Checking patch js/ajax_comments.js...
Checking patch src/Controller/AjaxCommentsController.php...
error: while searching for:
use Drupal\ajax_comments\Ajax\AjaxCommentsHighlightCommand;
use Drupal\ajax_comments\Ajax\AjaxCommentsInsertPageCommand;
use Drupal\ajax_comments\Ajax\AjaxCommentsRemoveCommentsCommand;
use Drupal\ajax_comments\TempStore;
use Drupal\ajax_comments\Utility;
use Drupal\comment\CommentInterface;

error: patch failed: src/Controller/AjaxCommentsController.php:5
error: src/Controller/AjaxCommentsController.php: patch does not apply
Checking patch src/Controller/AjaxCommentsController.php...
error: while searching for:
    }

    // Scroll to comment, if the setting is enabled.
    if (\Drupal::config('ajax_comments.settings')->get('enable_scroll')) {
      $response->addCommand(new AjaxCommentsScrollToElementCommand('.' . AjaxCommentsController::$commentClassPrefix . $comment->id()));
    }


error: patch failed: src/Controller/AjaxCommentsController.php:304
error: src/Controller/AjaxCommentsController.php: patch does not apply
Checking patch ajax_comments.module...
error: while searching for:
  /** @var \Drupal\ajax_comments\TempStore $tempStore */

  $tempStore = \Drupal::service('ajax_comments.temp_store');
  $view_mode =  $tempStore->getViewMode($entity->getCommentedEntity()->getEntityType()->getLabel()->getUntranslatedString());


  /** @var \Drupal\ajax_comments\FieldSettingsHelper $field_settings_helper */

error: patch failed: ajax_comments.module:81
error: ajax_comments.module: patch does not apply
Checking patch js/ajax_comments.js...
Checking patch src/Ajax/AjaxCommentsAddDummyDivAfterCommand.php...
Checking patch src/Ajax/AjaxCommentsAddIndentedDivCommand.php...
Checking patch src/Ajax/AjaxCommentsAppendToLastIndentCommand.php...
Checking patch src/Ajax/AjaxCommentsFadeAndRemoveCommand.php...
Checking patch src/Ajax/AjaxCommentsRemoveDescendantsCommand.php...
Checking patch src/Controller/AjaxCommentsController.php...
error: while searching for:
    }

    // Add a highlighted class to the newly added comment.
    $response->addCommand(new AjaxCommentsHighlightCommand(static::getCommentSelectorPrefix() . $comment->id()));

    if ($pid) {
      // Show the hidden reply link on the parent comment.

error: patch failed: src/Controller/AjaxCommentsController.php:296
error: src/Controller/AjaxCommentsController.php: patch does not apply
Checking patch composer.json...
Checking patch src/Controller/AjaxCommentsController.php...
error: while searching for:
   */
  public function pageAccess(EntityInterface $entity, $field_name) {
    // check that the comment field exists and we can access it.
    $comment_field = $entity->get($field_name);
    if (!$comment_field || !$comment_field->access('view')) {
      return AccessResult::forbidden();
    }
    return AccessResult::allowedIf($entity->access('view'));

error: patch failed: src/Controller/AjaxCommentsController.php:1040
error: src/Controller/AjaxCommentsController.php: patch does not apply
Checking patch ajax_comments.module...
error: while searching for:
use Drupal\Core\Entity\ContentEntityInterface;
use Drupal\Core\Entity\Display\EntityViewDisplayInterface;
use Drupal\Core\Entity\EntityInterface;
use Drupal\Core\Field\FieldDefinitionInterface;
use Drupal\Core\Field\FormatterInterface;
use Drupal\Core\Form\FormStateInterface;

error: patch failed: ajax_comments.module:17
error: ajax_comments.module: patch does not apply
Checking patch ajax_comments.module...
error: while searching for:
 */

use Drupal\ajax_comments\Controller\AjaxCommentsController;
use Drupal\ajax_comments\FieldSettingsHelper;
use Drupal\ajax_comments\Utility;
use Drupal\comment\CommentInterface;
use Drupal\Component\Serialization\Json;
use Drupal\Component\Utility\Html;
use Drupal\Core\Ajax;
use Drupal\Core\Ajax\AjaxResponse;
use Drupal\Core\Ajax\AlertCommand;
use Drupal\Core\Entity\ContentEntityInterface;

error: patch failed: ajax_comments.module:6
error: ajax_comments.module: patch does not apply
Checking patch src/Form/SettingsForm.php...
error: while searching for:

namespace Drupal\ajax_comments\Form;

use Drupal\Core\Cache\Cache;
use Drupal\Core\Config\ConfigFactoryInterface;
use Drupal\Core\Config\TypedConfigManagerInterface;
use Drupal\Core\Entity\EntityListBuilderInterface;
use Drupal\Core\Entity\EntityTypeBundleInfoInterface;
use Drupal\Core\Entity\EntityTypeManagerInterface;
use Drupal\Core\Extension\ModuleHandlerInterface;

error: patch failed: src/Form/SettingsForm.php:2
error: src/Form/SettingsForm.php: patch does not apply
Checking patch LICENSE.txt...
Checking patch composer.json...
Checking patch ajax_comments.module...
error: while searching for:
        // Rebuild the render array with our own structure outlined above.
        $build[$field_name][0]['comments']['pager_prev'] = []; // @todo - leave prev empty for now.
        $build[$field_name][0]['comments']['comment_list'] = $comments;
        $build[$field_name][0]['comments']['pager_next'] = $pager;


        if ($pager && $field_settings_helper->isPaginationEnabled($field_formatter)) {

error: patch failed: ajax_comments.module:312
error: ajax_comments.module: patch does not apply
Checking patch src/Controller/AjaxCommentsController.php...
error: while searching for:
    unset($comment_display['#theme_wrappers']);

    // Remove unneeded route parameters.
    unset($comment_display[0]['comments']['pager_next']['#route_parameters']['entity_type']);
    unset($comment_display[0]['comments']['pager_next']['#route_parameters']['entity']);
    unset($comment_display[0]['comments']['pager_next']['#route_parameters']['field_name']);
    unset($comment_display[0]['comments']['pager_next']['#route_parameters']['pid']);

    $entity_type = $entity->getEntityType();


error: patch failed: src/Controller/AjaxCommentsController.php:188
error: src/Controller/AjaxCommentsController.php: patch does not apply
Checking patch ajax_comments.module...
error: while searching for:
        // Rebuild the render array with our own structure outlined above.
        $build[$field_name][0]['comments']['pager_prev'] = []; // @todo - leave prev empty for now.
        $build[$field_name][0]['comments']['comment_list'] = $comments;
        $build[$field_name][0]['comments']['pager'] = $pager;


        if ($pager && $field_settings_helper->isPaginationEnabled($field_formatter)) {

error: patch failed: ajax_comments.module:312
error: ajax_comments.module: patch does not apply
Checking patch src/Controller/AjaxCommentsController.php...
Hunk #1 succeeded at 167 (offset -21 lines).
error: while searching for:
      // Override the ajax route object with the actual entity route.
      $entity_url = $entity->toURL();
      if ($route) {
        $comment_display[0]['comments']['pager']['#route_name'] = $route;
        $comment_display[0]['comments']['pager']['#route_parameters'] = $entity_url->getRouteParameters();
      }
    }


error: patch failed: src/Controller/AjaxCommentsController.php:211
error: src/Controller/AjaxCommentsController.php: patch does not apply
Checking patch ajax_comments.module...
error: while searching for:
        //
        // Maybe a css class of:
        // ENTITY_TYPE-BUNDLE-FIELD or even ENTITY_TYPE--ID--FIELD--MODE
        // and just target that in the js so we dont need to worry about
        // html ids being unique. This way we dont need to pass it along
        // in data attributes or use the tempStore for it.
        $wrapper_html_id = $tempStore->getSelectorValue($request, 'wrapper_html_id');


error: patch failed: ajax_comments.module:234
error: ajax_comments.module: patch does not apply
Checking patch js/ajax_comments.js...
Checking patch src/Ajax/AjaxCommentsScrollToElementCommand.php...
Checking patch src/Controller/AjaxCommentsController.php...
error: while searching for:

    // Show the reply link
    // @todo - figure out how can I target just the parents reply link instead of showing all?
    // I dont have the pid. or the id attribute of the anchor.
    // use-ajax js-use-ajax-comments js-ajax-comments-reply js-ajax-comments-reply-13337-comment-836
    $response->addCommand(new InvokeCommand('a.js-ajax-comments-reply', 'show'));


error: patch failed: src/Controller/AjaxCommentsController.php:567
error: src/Controller/AjaxCommentsController.php: patch does not apply
Checking patch src/Form/AjaxCommentsForm.php...
error: while searching for:

    // $this->tempStore->processForm($request, $form, $form_state);

    // I've commented out the above processForm() call because we dont need
    // to update the wrapper when the form is processed any more since
    // the wrapper never changes now, we are only updating the comments inside
    // the wrapper.

error: patch failed: src/Form/AjaxCommentsForm.php:165
error: src/Form/AjaxCommentsForm.php: patch does not apply
Checking patch src/TempStore.php...
error: while searching for:
    return $this->privateTempStore->get('cid');
  }

  public function setViewMode($entity_type, $viewmode) {
    $this->privateTempStore->set('view_mode_entity_type_' . $entity_type, $viewmode);
  }

  public function getViewMode($entity_type) {
    return $this->privateTempStore->get('view_mode_entity_type_' . $entity_type);
  }


error: patch failed: src/TempStore.php:50
error: src/TempStore.php: patch does not apply
Checking patch src/TempStore.php...
error: while searching for:
   * @param string $view_mode
   *   The view mode.
   */
  public function setViewMode(string $entity_type, string $viewmode): void {
    $this->privateTempStore->set('view_mode_entity_type_' . $entity_type, $viewmode);
  }

  /**

error: patch failed: src/TempStore.php:58
error: src/TempStore.php: patch does not apply
Checking patch src/Controller/AjaxCommentsController.php...
Hunk #1 succeeded at 126 (offset -14 lines).
error: while searching for:
      //'#type' => 'container',
    ];

    $notify = \Drupal::config('ajax_comments.settings')->get('notify');
    $status_messages = ['#type' => 'status_messages'];
    if ($notify) {
      // Render the status messages above the new comment.
      $comments_display['status_messages'] = $status_messages;
      //$comments_display[]['#markup'] = $this->renderer->renderRoot($status_messages);
    }
    else {
      // Render messages but don't print them to avoid displaying them when

error: patch failed: src/Controller/AjaxCommentsController.php:248
error: src/Controller/AjaxCommentsController.php: patch does not apply
Checking patch src/Form/AjaxCommentsForm.php...
error: while searching for:
    /** @var \Drupal\comment\CommentInterface $comment */
    $comment = $form_state->getFormObject()->getEntity();

    /** @var \Drupal\ajax_comments\TempStore $tempStore */
    $tempStore = \Drupal::service('ajax_comments.temp_store');
    $view_mode = $tempStore->getViewMode($comment->getCommentedEntity()->getEntityType()->getLabel()->getUntranslatedString());

    // Check to see if this comment field uses ajax comments.
    $comment_formatter = $this->fieldSettingsHelper->getFieldFormatterFromComment($comment, $view_mode);

error: patch failed: src/Form/AjaxCommentsForm.php:132
error: src/Form/AjaxCommentsForm.php: patch does not apply
Checking patch src/Form/SettingsForm.php...
error: while searching for:
          $entity_type_label = $entity_type->getLabel()->render();
          $label = $entity_type_label . ': ' . $bundle_label;

          /** @var \Drupal\ajax_comments\TempStore $temp_store */
          $temp_store = \Drupal::service('ajax_comments.temp_store');
          $view_mode = !empty($temp_store->getViewMode($entity_type->getLabel()))
            ? $temp_store->getViewMode($entity_type->getLabel())
            : 'default';

          // Create the render array for the link to edit the display mode.

error: patch failed: src/Form/SettingsForm.php:125
error: src/Form/SettingsForm.php: patch does not apply
Checking patch css/ajax_comments.css...
Checking patch ajax_comments.module...
error: while searching for:
 */
function ajax_comments_entity_view_mode_alter(&$view_mode, EntityInterface $entity, $context) {

  if($entity->getEntityType()->entityClassImplements(FieldableEntityInterface::class)) {
    /** @var \Drupal\ajax_comments\FieldSettingsHelper $field_settings_helper */
    $field_settings_helper = \Drupal::service('ajax_comments.field_settings_helper');


error: patch failed: ajax_comments.module:28
error: ajax_comments.module: patch does not apply
Checking patch src/Ajax/AjaxCommentsHighlightCommand.php...
Checking patch src/Ajax/AjaxCommentsInsertPageCommand.php...
Checking patch src/Ajax/AjaxCommentsRemoveCommentsCommand.php...
Checking patch src/Ajax/AjaxCommentsScrollToElementCommand.php...
Checking patch src/Controller/AjaxCommentsController.php...
error: while searching for:
class AjaxCommentsController extends ControllerBase implements TrustedCallbackInterface {

  /**
   * @inheritDoc
   */
  public static function trustedCallbacks() {
    return ['fixPagerIndenting'];

error: patch failed: src/Controller/AjaxCommentsController.php:41
error: src/Controller/AjaxCommentsController.php: patch does not apply
Checking patch src/FieldSettingsHelper.php...
Checking patch src/Form/AjaxCommentsDeleteForm.php...
Checking patch src/Form/AjaxCommentsForm.php...
error: while searching for:
      '#value' => $form['#attributes']['id'],
    ];

    // If this is an instance of the form that was submitted (not a child
    // form on a comment field attached to this comment), then
    // update the temp store values while rebuilding the form, if necessary.

    // $this->tempStore->processForm($request, $form, $form_state);

    // I've commented out the above processForm() call because we do not need
    // to update the wrapper when the form is processed any more since
    // the wrapper never changes now, we are only updating the comments inside
    // the wrapper.

    // @todo - Im still not sure we need wrapper_html_id in the form anymore
    // since its original purpose was to keep track of the fields html id when
    // it was reloaded in ajax calls. Since we are only updating content inside
    // the wrapper and the wrapper Id is never meant to change now, this may
    // not be necessary anymore. But I can't seem to figure out how to get
    // the default wrapper value of the field without making this available
    // here.

    $wrapper_html_id = $this->tempStore->getSelectorValue($request, 'wrapper_html_id');
    if(empty($wrapper_html_id)){
      $wrapper_html_id = Utility::getWrapperIdFromEntity($commented_entity, $field_name);
    }


    // Add the wrapping fields's HTML id as a hidden input
    // so we can access it in the controller.
    // NOTE: This field needs to be declared here, and the only the #value

error: patch failed: src/Form/AjaxCommentsForm.php:158
error: src/Form/AjaxCommentsForm.php: patch does not apply
Checking patch src/Form/SettingsForm.php...
error: while searching for:
  protected $moduleHandler;

  /**
   * The TempStore service.
   *
   * This service stores temporary data to be used across HTTP requests.
   *

error: patch failed: src/Form/SettingsForm.php:41
error: src/Form/SettingsForm.php: patch does not apply
Checking patch src/Utility.php...
Checking patch src/Controller/AjaxCommentsController.php...
error: while searching for:
    // comments which may already be present in the DOM.
    $response->addCommand(new AjaxCommentsInsertPageCommand($wrapper_html_id . ' .ajax-comments-wrap', $build['comments']['comment_list']));


    return $response;
  }


error: patch failed: src/Controller/AjaxCommentsController.php:1084
error: src/Controller/AjaxCommentsController.php: patch does not apply
Checking patch src/FieldSettingsHelper.php...
Checking patch src/Form/AjaxCommentsForm.php...
error: while searching for:
    /** @var \Drupal\comment\CommentInterface $comment */
    $comment = $form_state->getFormObject()->getEntity();


    $view_mode = $this->tempStore->getViewMode($comment->getCommentedEntity()->getEntityType()->getLabel()->getUntranslatedString());

    // Check to see if this comment field uses ajax comments.

error: patch failed: src/Form/AjaxCommentsForm.php:132
error: src/Form/AjaxCommentsForm.php: patch does not apply
Checking patch css/ajax_comments.css...
Checking patch src/Form/AjaxCommentsForm.php...
error: while searching for:
        );
      }
    }
  }

}

error: patch failed: src/Form/AjaxCommentsForm.php:451
error: src/Form/AjaxCommentsForm.php: patch does not apply
Checking patch js/ajax_comments.js...
Checking patch css/ajax_comments.css...
Checking patch js/ajax_comments.js...
Checking patch js/ajax_comments.js...
Checking patch src/TempStore.php...
Checking patch tests/src/FunctionalJavascript/AjaxCommentsFunctionalTest.php...
Checking patch tests/modules/ajax_comments_test_views/ajax_comments_test_views.info.yml...
Checking patch tests/modules/ajax_comments_test_views/config/install/views.view.comments_on_teasers.yml...
Checking patch tests/src/FunctionalJavascript/AjaxCommentsFunctionalTest.php...
Checking patch tests/src/FunctionalJavascript/AjaxCommentsFunctionalTest.php...
Checking patch js/ajax_comments.js...
Checking patch css/ajax_comments.css...

@pearls Try this patch with composer.

Many thanks @loze.
Patch in #36 applied with composer but the page refresh problem persists. I also tried the last patch approach in issue 2896916-Ajax not working 🐛 Ajax not working when using non-default view mode. Needs work ...
FYI: #36 can only be applied by removing other issue patches in composer.json.
It cannot be applied without removing other patches patches like 3208008-HTML ID uniqueness and 2896916-Ajax not working.