Problem/Motivation

When rendering Drupal render arrays to CustomElements via `setSlotFromRenderArray()`,
the `#attached` libraries are lost. The render array is processed through
`renderInIsolation()` which renders the HTML markup, but the attached libraries
(JS) are not captured in the CustomElement structure.

This is problematic for decoupled frontends that need to load Drupal JavaScript
libraries for functionality like:
- Form states/conditional fields (`core/drupal.states`)
- Autocomplete fields (`core/drupal.autocomplete`)
- Various widgets and behaviors

Proposed resolution

When rendering render arrays to custom elements, emit ``
elements as part of the slot content:

1. Capture `#attached` before rendering
2. Resolve library dependencies in correct load order
3. Generate `drupal-library-{name}` custom elements with JS file paths
4. Prepend library elements to slot content (before markup)
5. Include `drupalSettings` as props when present

Example output:

{
  "element": "drupal-markup",
  "slots": {
    "default": [
      { "element": "drupal-library-core-jquery", "props": { "js": [...] } },
      { "element": "drupal-library-core-drupal-states", "props": { "js": [...] } },
      "<div class=\"form-wrapper\">...</div>"
    ]
  },
  "props": { "drupalSettings": {...} }
}
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

ciprian.stavovei created an issue. See original summary.

ciprian.stavovei’s picture

Issue summary: View changes

ciprian.stavovei changed the visibility of the branch 3568233-add-support-for to hidden.

ciprian.stavovei’s picture

Assigned: ciprian.stavovei » Unassigned
Status: Active » Needs review
StatusFileSize
new28.64 KB

Implemented support for capturing #attached libraries when rendering render arrays to custom elements. The implementation:

- Captures attachments via BubbleableMetadata after rendering to include bubbled nested attachments
- Generates drupal-library-* custom elements with resolved JS file paths (CSS skipped intentionally)
- Prepends library elements to slot content before the markup
- Includes interface for testability and kernel tests

Pipeline is green and I also attached a patch in order to easily test this before merging.

ciprian.stavovei’s picture

StatusFileSize
new36.1 KB
fago’s picture

Thank you. I'm not so sure about adding attachhments to the ce-data model, that seems wrong and potentially confusing, since it's not possible to add attachments to the CE element. I need to take a closer look at this.

fago’s picture

Assigned: Unassigned » fago