[cssom] allow text in CSSStyleSheet constructor

[jonathantneal]

May we consider allowing CSSStyleSheetInit to accept a text property that synchronously assigns rules to the constructed sheet?

dictionary CSSStyleSheetInit {
  DOMString baseURL = null;
  (MediaList or DOMString) media = "";
  boolean disabled = false;
  DOMString text = "";
};

Example usage:

new CSSStyleSheet(":host{ /* styles */ }")

Example in adoptedStyleSheets:

shadowRoot.adoptedStyleSheets = [ new CSSStyleSheet(":host { /* styles */ }") ]

The goal is to improve the authoring experience for constructed stylesheets, especially within custom elements, by enabling inline creation without needing to call replaceSync() separately. This would be a small but meaningful ergonomic improvement and a low-barrier enhancement that could benefit many developers working with adoptedStyleSheets.

Would this be appropriate for inclusion in the spec, or is it better suited for discussion elsewhere?

[Loirooriol]

Presumably the example would be

new CSSStyleSheet({ text: ":host{ /* styles */ }" })

Or do you want the parameter to be either a CSSStyleSheetInit or a string?

[castastrophe]

I quite like this idea for dynamic interpolation for systems with design data stored in JSON for example.

new CSSStyleSheet({ text: `:host{ background: ${token.colors.blue.100} }` })