Skip to content

Add shadowrootslotassignment attribute #12267

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
annevk merged 7 commits into from
Apr 15, 2026
Merged

Add shadowrootslotassignment attribute #12267

Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
8779a3e
Add shadowrootslotassignment attribute
keithamus Mar 16, 2026
c78ef20
Add template IDL reflection
keithamus Mar 17, 2026
f71532c
Reword spec to use attribute state not value
keithamus Mar 17, 2026
e04d299
re-order attribute to before clonable
keithamus Apr 13, 2026
794d13a
re-order some more
keithamus Apr 13, 2026
cff9f59
fix td
keithamus Apr 13, 2026
f8c27b7
Be gone spaces!
keithamus Apr 14, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
56 changes: 55 additions & 1 deletion source
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -68241,6 +68241,7 @@ not-slash = %x0000-002E / %x0030-10FFFF
<dd><span>Global attributes</span></dd>
<dd><code data-x="attr-template-shadowrootmode">shadowrootmode</code></dd>
<dd><code data-x="attr-template-shadowrootdelegatesfocus">shadowrootdelegatesfocus</code></dd>
<dd><code data-x="attr-template-shadowrootslotassignment">shadowrootslotassignment</code></dd>
<dd><code data-x="attr-template-shadowrootclonable">shadowrootclonable</code></dd>
<dd><code data-x="attr-template-shadowrootserializable">shadowrootserializable</code></dd>
<dd><code data-x="attr-template-shadowrootcustomelementregistry">shadowrootcustomelementregistry</code></dd>
Expand All @@ -68257,6 +68258,7 @@ interface <dfn interface>HTMLTemplateElement</dfn> : <span>HTMLElement</span> {
readonly attribute <span>DocumentFragment</span> <span data-x="dom-template-content">content</span>;
[<span>CEReactions</span>] attribute DOMString <span data-x="dom-template-shadowrootmode">shadowRootMode</span>;
[<span>CEReactions</span>, <span data-x="xattr-Reflect">Reflect</span>] attribute boolean <dfn attribute for="HTMLTemplateElement" data-x="dom-template-shadowrootdelegatesfocus">shadowRootDelegatesFocus</dfn>;
[<span>CEReactions</span>] attribute DOMString <span data-x="dom-template-shadowrootslotassignment">shadowRootSlotAssignment</span>;
[<span>CEReactions</span>, <span data-x="xattr-Reflect">Reflect</span>] attribute boolean <dfn attribute for="HTMLTemplateElement" data-x="dom-template-shadowrootclonable">shadowRootClonable</dfn>;
[<span>CEReactions</span>, <span data-x="xattr-Reflect">Reflect</span>] attribute boolean <dfn attribute for="HTMLTemplateElement" data-x="dom-template-shadowRootSerializable">shadowRootSerializable</dfn>;
[<span>CEReactions</span>, <span data-x="xattr-Reflect">Reflect</span>] attribute DOMString <dfn attribute for="HTMLTemplateElement" data-x="dom-template-shadowRootCustomElementRegistry">shadowRootCustomElementRegistry</dfn>;
Expand Down Expand Up @@ -68300,6 +68302,32 @@ interface <dfn interface>HTMLTemplateElement</dfn> : <span>HTMLElement</span> {
data-x="attr-template-shadowrootdelegatesfocus">shadowrootdelegatesfocus</code></dfn> content
attribute is a <span>boolean attribute</span>.</p>

<p>The <dfn element-attr for="template"><code
data-x="attr-template-shadowrootslotassignment">shadowrootslotassignment</code></dfn> content
attribute is an <span>enumerated attribute</span> with the following keywords and states:</p>

<table>
<thead>
<tr>
<th>Keyword
<th>State
<th>Brief description
<tbody>
<tr>
<td><dfn attr-value for="template/shadowrootslotassignment"><code data-x="attr-shadowrootslotassignment-named">named</code></dfn>
<td><dfn data-x="attr-shadowrootslotassignment-named-state">Named</dfn>
<td>The declarative shadow root uses named slot assignment.
<tr>
<td><dfn attr-value for="template/shadowrootslotassignment"><code data-x="attr-shadowrootslotassignment-manual">manual</code></dfn>
<td><dfn data-x="attr-shadowrootslotassignment-manual-state">Manual</dfn>
<td>The declarative shadow root uses manual slot assignment.
</table>

<p>The <code data-x="attr-template-shadowrootslotassignment">shadowrootslotassignment</code>
attribute's <i data-x="invalid value default">invalid value default</i> and <i data-x="missing
value default">missing value default</i> are both the <span
data-x="attr-shadowrootslotassignment-named-state">Named</span> state.</p>

<p>The <dfn element-attr for="template"><code
data-x="attr-template-shadowrootclonable">shadowrootclonable</code></dfn> content attribute is a
<span>boolean attribute</span>.</p>
Expand Down Expand Up @@ -68465,6 +68493,14 @@ interface <dfn interface>HTMLTemplateElement</dfn> : <span>HTMLElement</span> {
attribute, <span>limited to only known values</span>.</p>
</div>

<div algorithm>
<p>The <dfn attribute for="HTMLTemplateElement"><code
data-x="dom-template-shadowrootslotassignment">shadowRootSlotAssignment</code></dfn> IDL attribute
must <span>reflect</span> the <code
data-x="attr-template-shadowrootslotassignment">shadowrootslotassignment</code> content attribute,
<span>limited to only known values</span>.</p>
</div>

<p class="note">The <span
data-x="dom-template-shadowRootCustomElementRegistry">shadowRootCustomElementRegistry</span> IDL
attribute intentionally does not have a boolean type so it can be extended.</p>
Comment thread
keithamus marked this conversation as resolved.
Expand Down Expand Up @@ -141126,6 +141162,13 @@ document.body.appendChild(text);
<li><p>Let <var>mode</var> be <var>templateStartTag</var>'s <code
data-x="attr-template-shadowrootmode">shadowrootmode</code> attribute's value.</p></li>

<li><p>Let <var>slotAssignment</var> be "<code data-x="">named</code>".</p></li>

<li><p>If <var>templateStartTag</var>'s <code
data-x="attr-template-shadowrootslotassignment">shadowrootslotassignment</code> attribute is
in the <span data-x="attr-shadowrootslotassignment-manual-state">Manual</span> state, then
set <var>slotAssignment</var> to "<code data-x="">manual</code>".</p></li>

<li><p>Let <var>clonable</var> be true if <var>templateStartTag</var> has a <code
data-x="attr-template-shadowrootclonable">shadowrootclonable</code> attribute; otherwise
false.</p></li>
Expand Down Expand Up @@ -141154,7 +141197,7 @@ document.body.appendChild(text);
<li>
<p><span data-x="concept-attach-a-shadow-root">Attach a shadow root</span> with
<var>declarativeShadowHostElement</var>, <var>mode</var>, <var>clonable</var>,
<var>serializable</var>, <var>delegatesFocus</var>, "<code data-x="">named</code>", and
<var>serializable</var>, <var>delegatesFocus</var>, <var>slotAssignment</var>, and
<var>registry</var>.</p>

<p>If an exception is thrown, then catch it and:</p>
Expand Down Expand Up @@ -144946,6 +144989,10 @@ document.body.appendChild(text);
<li><p>If <var>shadow</var>'s <span data-x="shadow-serializable">serializable</span> is set, then append
"<code data-x=""> shadowrootserializable=&quot;&quot;</code>".</p></li>

<li><p>If <var>shadow</var>'s <span>slot assignment</span> is "<code
data-x="">manual</code>", then append "<code
data-x=""> shadowrootslotassignment=&quot;manual&quot;</code>".</p></li>

<li><p>If <var>shadow</var>'s <span>clonable</span> is set, then append
"<code data-x=""> shadowrootclonable=&quot;&quot;</code>".</p></li>

Expand Down Expand Up @@ -152880,6 +152927,7 @@ interface <dfn interface>External</dfn> {
<td><span data-x="global attributes">globals</span>;
<code data-x="attr-template-shadowrootmode">shadowrootmode</code>;
<code data-x="attr-template-shadowrootdelegatesfocus">shadowrootdelegatesfocus</code>;
<code data-x="attr-template-shadowrootslotassignment">shadowrootslotassignment</code>;
<code data-x="attr-template-shadowrootclonable">shadowrootclonable</code>;
<code data-x="attr-template-shadowrootserializable">shadowrootserializable</code>;
<code data-x="attr-template-shadowrootcustomelementregistry">shadowrootcustomelementregistry</code></td>
Expand Down Expand Up @@ -154438,6 +154486,12 @@ interface <dfn interface>External</dfn> {
<td> <code data-x="attr-template-shadowrootserializable">template</code>
<td> Sets <span data-x="shadow-serializable">serializable</span> on a declarative shadow root
<td> <span>Boolean attribute</span>
<tr>
<th> <code data-x="">shadowrootslotassignment</code>
<td> <code data-x="attr-template-shadowrootslotassignment">template</code>
<td> Sets <span>slot assignment</span> on a declarative shadow root
<td> "<code data-x="">named</code>";
"<code data-x="">manual</code>"
<tr>
<th> <code data-x="">shape</code>
<td> <code data-x="attr-area-shape">area</code>
Expand Down
Loading