Skip to content

[css-shadow-parts] Expose parts programmatically #3228

Open
@JanMiksovsky

Description

@JanMiksovsky

It would be helpful for components with parts to expose those parts in some way that's programmatically inspectable.

For components with an open shadow root, someone could query inside the shadow for elements that have a part attribute, but this is not possible for components with closed shadow roots. To avoid leaking shadow elements, the proposed mechanism would return an array of string part names, not elements.

This would be akin to property reflection, and good for things like design/debugging/testing tools. E.g., it'd be nice if a tool could ask a DOM element what parts it has so that the tool can show the user a list of the parts available for styling.

Using the spec's example:

<template id="c-e-template">
  <span part="textspan">This text will be red</span>
</template>

The goal would be to allow something like:

const e = document.createElement('custom-element');
e.parts; // Returns the array ['textspan']

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions