Problem/Motivation
Ajax content update enabled. Still, always a full page reload is triggered on paragraphs edit. While moving up and down and inserting new paragraphs works totally fine with Ajax.
Turns out this happens when the view mode of the parent entity and the view mode of the paragraph don't match. For example node comes in full view mode and paragraph comes in default view mode.
Article comes with hidden trigger link (note the selector data-fe-update-content="node--1--field_content_paragraphs--full"):
<a href="/frontend-editing/update-content/node/1/field_content_paragraphs/full" title="Reload content for this field" class="use-ajax frontend-editing-update-content visually-hidden" data-fe-update-content="node--1--field_content_paragraphs--full" data-once="ajax">Reload content for this field</a>
And paragraph comes with view_mode_id URL query param in the edit link, used to build the selector later that is needed to click the hidden link (note view_mode_id=default
<a href="/frontend-editing/form/paragraph/19222?view_mode_id=default" title="Edit" class="frontend-editing-open-sidebar frontend-editing__action frontend-editing__action--edit">Edit</a>
This view_mode_id URL query param is later used to build the DOM selector to perform a hidden click on data-fe-update-content="node--1--field_content_paragraphs--full" for the Ajax update.
But since view_mode_id on the paragraph edit link is default, it tries to click on data-fe-update-content="node--1--field_content_paragraphs--default" instead, which does not exist.
Instead of doing a nice Ajax content update, it now reloads the whole window:
const element = document.querySelector(selector);
if (element) {
element.click();
} else {
window.location.reload();
}
Steps to reproduce
Proposed resolution
Remaining tasks
User interface changes
API changes
Data model changes