diff --git a/core/modules/big_pipe/js/big_pipe.es6.js b/core/modules/big_pipe/js/big_pipe.es6.js index b78eaa9..9f4ef01 100644 --- a/core/modules/big_pipe/js/big_pipe.es6.js +++ b/core/modules/big_pipe/js/big_pipe.es6.js @@ -11,37 +11,27 @@ * * @param {number} index * Current index. - * @param {HTMLScriptElement} placeholderReplacement + * @param {HTMLScriptElement} placeholderReplacementSignal * Script tag created by BigPipe. */ - function bigPipeProcessPlaceholderReplacement(index, placeholderReplacement) { + function bigPipeProcessPlaceholderReplacement(index, placeholderReplacementSignal) { + const placeholderReplacement = placeholderReplacementSignal.previousElementSibling; const placeholderId = placeholderReplacement.getAttribute('data-big-pipe-replacement-for-placeholder-with-id'); - const content = this.textContent.trim(); // Ignore any placeholders that are not in the known placeholder list. Used // to avoid someone trying to XSS the site via the placeholdering mechanism. if (typeof drupalSettings.bigPipePlaceholderIds[placeholderId] !== 'undefined') { - // If we try to parse the content too early (when the JSON containing Ajax - // commands is still arriving), textContent will be empty which will cause - // JSON.parse() to fail. Remove once so that it can be processed again - // later. - // @see bigPipeProcessDocument() - if (content === '') { - $(this).removeOnce('big-pipe'); - } - else { - const response = JSON.parse(content); - // Create a Drupal.Ajax object without associating an element, a - // progress indicator or a URL. - const ajaxObject = Drupal.ajax({ - url: '', - base: false, - element: false, - progress: false, - }); - // Then, simulate an AJAX response having arrived, and let the Ajax - // system handle it. - ajaxObject.success(response, 'success'); - } + const response = JSON.parse(placeholderReplacement.textContent.trim()); + // Create a Drupal.Ajax object without associating an element, a + // progress indicator or a URL. + const ajaxObject = Drupal.ajax({ + url: '', + base: false, + element: false, + progress: false, + }); + // Then, simulate an AJAX response having arrived, and let the Ajax + // system handle it. + ajaxObject.success(response, 'success'); } } @@ -62,7 +52,7 @@ return false; } - $(context).find('script[data-big-pipe-replacement-for-placeholder-with-id]') + $(context).find('script[data-big-pipe-event="replacement"]') .once('big-pipe') .each(bigPipeProcessPlaceholderReplacement); diff --git a/core/modules/big_pipe/js/big_pipe.js b/core/modules/big_pipe/js/big_pipe.js index 1464fdd..be34035 100644 --- a/core/modules/big_pipe/js/big_pipe.js +++ b/core/modules/big_pipe/js/big_pipe.js @@ -6,25 +6,21 @@ **/ (function ($, Drupal, drupalSettings) { - function bigPipeProcessPlaceholderReplacement(index, placeholderReplacement) { + function bigPipeProcessPlaceholderReplacement(index, placeholderReplacementSignal) { + var placeholderReplacement = placeholderReplacementSignal.previousElementSibling; var placeholderId = placeholderReplacement.getAttribute('data-big-pipe-replacement-for-placeholder-with-id'); - var content = this.textContent.trim(); if (typeof drupalSettings.bigPipePlaceholderIds[placeholderId] !== 'undefined') { - if (content === '') { - $(this).removeOnce('big-pipe'); - } else { - var response = JSON.parse(content); + var response = JSON.parse(placeholderReplacement.textContent.trim()); - var ajaxObject = Drupal.ajax({ - url: '', - base: false, - element: false, - progress: false - }); + var ajaxObject = Drupal.ajax({ + url: '', + base: false, + element: false, + progress: false + }); - ajaxObject.success(response, 'success'); - } + ajaxObject.success(response, 'success'); } } @@ -33,7 +29,7 @@ return false; } - $(context).find('script[data-big-pipe-replacement-for-placeholder-with-id]').once('big-pipe').each(bigPipeProcessPlaceholderReplacement); + $(context).find('script[data-big-pipe-event="replacement"]').once('big-pipe').each(bigPipeProcessPlaceholderReplacement); if (context.querySelector('script[data-big-pipe-event="stop"]')) { if (timeoutID) { diff --git a/core/modules/big_pipe/src/Render/BigPipe.php b/core/modules/big_pipe/src/Render/BigPipe.php index 79aba6f..9ad961b 100644 --- a/core/modules/big_pipe/src/Render/BigPipe.php +++ b/core/modules/big_pipe/src/Render/BigPipe.php @@ -157,6 +157,13 @@ class BigPipe { const START_SIGNAL = ''; /** + * The BigPipe placeholder replacements new replacement signal. + * + * @var string + */ + const REPLACEMENT_SIGNAL = ''; + + /** * The BigPipe placeholder replacements stop signal. * * @var string @@ -599,6 +606,7 @@ protected function sendPlaceholders(array $placeholders, array $placeholder_orde $json EOF; + $output .= static::REPLACEMENT_SIGNAL . "\n"; $this->sendChunk($output); // Another placeholder was rendered and sent, track the set of asset