BigPipe leaves wrapper <div>s in place, because AJAX system leaves them — this can cause some CSS to break

Moving to the right queue.

Yes, indeed the DIVs are left on the page, when we replace the placeholder.

This could be solved by the custom templates for big pipe placeholders (other issue).

Or maybe you could change the div to be displayed as 'inline'. While we don't have a special class, I think there is a data attribute you could check for non-empty.

Maybe we should add a class?

@Wim: Thoughts?

AFAICT this is a bug in the AJAX system.

Confirmed. And yes, this is the AJAX system biting us.

BigPipe uses \Drupal\Core\Ajax\ReplaceCommand, which uses http://api.jquery.com/replaceWith/. But thanks to this stuff in ajax.js, we're left with that wrapping <div>:

      // We don't know what response.data contains: it might be a string of text
      // without HTML, so don't rely on jQuery correctly interpreting
      // $(response.data) as new HTML rather than a CSS selector. Also, if
      // response.data contains top-level text nodes, they get lost with either
      // $(response.data) or $('<div></div>').replaceWith(response.data).
      var $new_content_wrapped = $('<div></div>').html(response.data);
      var $new_content = $new_content_wrapped.contents();

This is therefore a duplicate of #736066: ajax.js insert command sometimes wraps content in a div, potentially producing invalid HTML and other bugs, which is a >6 year old major bug.

But let's keep this issue open, to make it easier for BigPipe users to find out about this problem. Marking as blocked on that issue, so that we can close both at the same time.

Reported this issue at #736066-107: ajax.js insert command sometimes wraps content in a div, potentially producing invalid HTML and other bugs.

Oh, hah, this exact problem has been reported before to BigPipe: #2654386: [PP-1] BigPipe uses AJAX system to insert new content, AJAX system adds a wrapping <div>, breaks theme. It just was still in the contrib module's issue queue. Moved it to Drupal core.

Found another occurrence of this bug when using https://www.drupal.org/project/blockgroup together with BigPipe. Empty <div> containers around all Block Groups when BigPipe enabled and logged in. Breaks CSS. Disabling BigPipe fixed it :'(

#10: reported at #736066-262: ajax.js insert command sometimes wraps content in a div, potentially producing invalid HTML and other bugs, thanks for letting me know. (Note that you can work around it by tweaking your CSS selectors.)

#2913563: Facets blocks loaded with BigPipe wrapped in unwanted <div> due to bug in AJAX system was also just brought to my attention, that was yet another duplicate of this.

#736066: ajax.js insert command sometimes wraps content in a div, potentially producing invalid HTML and other bugs was finally fixed today!

That means this also was fixed automatically! 🎉