Problem/Motivation
When two BigPipe placeholders attach libraries that depend on each other, the dependent script can run before the library it depends on. jQuery UI Autocomplete then fails with Uncaught TypeError: e.widget is not a function. processReplacement() in big_pipe.js starts a separate command queue per replacement. BigPipe sends a library only with the first replacement that needs it. While that replacement waits for its CSS, a later replacement adds its scripts first. #2927687: Libraries with dependencies may cause race conditions with #lazy_builders reported this symptom and was closed as a duplicate of #1988968: Drupal.ajax does not guarantee that "add new JS file to page" commands have finished before calling said JS, which orders the commands within one response but not across replacements. #3620565: BigPipe unbinds #ajax behaviors and can wipe drupalSettings.ajax changes the command order within one replacement. The meta issue #3537357: [Meta] Big Pipe related issues, causing seemingly random failures tracks BigPipe scripts that load in the wrong order.
Steps to reproduce
- Drupal core
mainat8a2a12ddbe, PHP 8.5.12, MySQL 8.0, Chromium 156 with chromedriver in W3C mode. - Apply only the test commit of the merge request and run
BigPipeRegressionTest::testReplacementOrder(). Its page has a placeholder with a stylesheet that loads after one second, followed by a placeholder whose library depends on the library of the first. - The test fails.
window.bigPipeRegressionTestDependencyLoadedisfalse, sodependent.jsran beforeslow-dependency.js. With the fix it passes. Without the fix the same test also fails on11.xat5910ba0a74(PHP 8.3.36) and on10.6.xatd557f3cfe7.
Proposed resolution
This MR runs the replacements one after the other on one promise chain, so each starts after the previous one has added its CSS and JavaScript. A failed replacement is logged and does not stop the next one. A slow stylesheet now also delays the replacements after it, like a render-blocking stylesheet on a page without BigPipe.
Remaining tasks
Backport to 10.6.x after the fix is in main. BigPipe there still uses Drupal.Ajax, so the change needs its own merge request.
User interface changes
Introduced terminology
API changes
Data model changes
Release notes snippet
Issue fork drupal-3637646
Show commands
Start within a Git clone of the project using the version control instructions.
Or, if you do not have SSH keys set up on git.drupalcode.org:
Comments