Problem/Motivation

Since #3110517: Improve Drupal\Core\Ajax\AddCssCommand to accept an array of CSS assets , JS/CSS assets are sent in AJAX responses as arrays of attributes instead of rendered HTML strings. Because of this, inline CSS can no longer be added to AJAX responses through AddCssCommand's (see nod_'s comment here).

Drupal.AjaxCommands.prototype.add_css(), the JS behaviour that adds the assets to the page, expects an href attribute for every asset, something inline assets don't have.

Steps to reproduce

  1. Enable and configure the Critical CSS module.
  2. Try to trigger any AJAX request: can be a Webform submit, a media library modal, anything.

Proposed resolution

AjaxResponseAttachmentsProcessor will need to check which CSS assets have an href attribute: those that do should be added with AddCssCommand, those that don't should be added with AppendCommand (see gapple's comment here).

CommentFileSizeAuthor
#5 ajax_webform.png108.23 KBluiscarvalho

Issue fork drupal-3389148

Command icon 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

DieterHolvoet created an issue. See original summary.

dieterholvoet’s picture

Status: Active » Needs review
smustgrave’s picture

Status: Needs review » Needs work
Issue tags: +Needs tests

Think we will need a test case to show the issue also

luiscarvalho’s picture

StatusFileSize
new108.23 KB

When trying this patch in conjunction with #3389161 - Not all attributes are used when considering an asset as unique, the JS error disappears but it looks like it's interfering with other append commands.

In my case, in a site running Drupal 10.1.0, I have a Webform with: saving submissions disabled, Ajax enabled and confirmation Inline (reloads the current page and replaces the webform with the confirmation message). When I submit that form while critical_css is enabled (after patches attached), it doesn't replace the webform anymore. The exact response with commands for the POST is in the image.

I could not determine if the problem is on the code of one of the modules or the changes in Ajax from D9.5 to D10.

Version: 11.x-dev » main

Drupal core is now using the main branch as the primary development branch. New developments and disruptive changes should now be targeted to the main branch.

Read more in the announcement.