Skip to content
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

Add Imperative Slot API #6561

Merged
merged 6 commits into from
Apr 14, 2021
Merged

Add Imperative Slot API #6561

Changes from 2 commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
f6e4f49
Cherry pick https://github.com/whatwg/html/pull/5483
mfreed7 Apr 6, 2021
77fbcc9
Make requested changes
mfreed7 Apr 6, 2021
813369b
Fix syntax errors
mfreed7 Apr 6, 2021
d0561f7
Implement weak pointers and remove strict shadow root check
mfreed7 Apr 9, 2021
793136e
Moved weak ref stuff to a note
mfreed7 Apr 9, 2021
cb38d44
Nits and further Bikeshed metadata additions while in the area
domenic Apr 14, 2021
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
89 changes: 73 additions & 16 deletions source
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2209,7 +2209,7 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
<li>The <dfn data-x-href="https://infra.spec.whatwg.org/#list">list</dfn> data structure and the associated definitions for
<dfn data-x="list append" data-x-href="https://infra.spec.whatwg.org/#list-append">append</dfn>,
<dfn data-x="list extend" data-x-href="https://infra.spec.whatwg.org/#list-extend">extend</dfn>,
<dfn data-x="list replace" data-x-href="https://infra.spec.whatwg.org/#list-remove">replace</dfn>,
<dfn data-x="list replace" data-x-href="https://infra.spec.whatwg.org/#list-replace">replace</dfn>,
<dfn data-x="list remove" data-x-href="https://infra.spec.whatwg.org/#list-remove">remove</dfn>,
<dfn data-x="list empty" data-x-href="https://infra.spec.whatwg.org/#list-empty">empty</dfn>,
<dfn data-x="list contains" data-x-href="https://infra.spec.whatwg.org/#list-contain">contains</dfn>,
Expand Down Expand Up @@ -2947,11 +2947,16 @@ a.setAttribute('href', 'https://example.com/'); // change the content attribute
<li>The <dfn data-x-href="https://dom.spec.whatwg.org/#document-element">document element</dfn> concept</li>
<li>The <dfn data-x-href="https://dom.spec.whatwg.org/#in-a-document-tree">in a document tree</dfn>, <dfn data-x-href="https://dom.spec.whatwg.org/#in-a-document">in a document</dfn> (legacy), and <dfn data-x-href="https://dom.spec.whatwg.org/#connected">connected</dfn> concepts</li>
<li>The <dfn data-x="concept-slot" data-x-href="https://dom.spec.whatwg.org/#concept-slot">slot</dfn> concept, and its <dfn data-x="slot-name" data-x-href="https://dom.spec.whatwg.org/#slot-name">name</dfn> and <dfn data-x-href="https://dom.spec.whatwg.org/#slot-assigned-nodes">assigned nodes</dfn></li>
<li>The <dfn data-x-href="https://dom.spec.whatwg.org/#slotable-assigned-slot">assigned slot</dfn> concept.
<li>The <dfn data-x-href="https://dom.spec.whatwg.org/#slotable-assigned-slot">assigned slot</dfn> concept</li>
<li>The <dfn data-x-href="https://dom.spec.whatwg.org/#dom-shadowroot-slot-assignment">slot assignment</dfn> concept</li>
<li>The <dfn data-x-href="https://dom.spec.whatwg.org/#concept-slotable">slottable</dfn> concept</li>
<li>The <dfn data-x-href="https://dom.spec.whatwg.org/#assign-slotables-for-a-tree">assign slottables for a tree</dfn> algorithm</li>
<li>The <dfn data-x-href="https://dom.spec.whatwg.org/#concept-tree-inclusive-descendant">inclusive descendants</dfn> concept</li>>
<li>The <dfn data-x="finding flattened slottables" data-x-href="https://dom.spec.whatwg.org/#find-flattened-slotables">find flattened slottables</dfn> algorithm</li>
<li>The <dfn data-x-href="https://dom.spec.whatwg.org/#assign-a-slot">assign a slot</dfn> algorithm</li>
<li>The <dfn data-x-href="https://dom.spec.whatwg.org/#concept-node-pre-insert">pre-insert</dfn>, <dfn data-x="concept-node-insert" data-x-href="https://dom.spec.whatwg.org/#concept-node-insert">insert</dfn>, <dfn data-x="concept-node-append" data-x-href="https://dom.spec.whatwg.org/#concept-node-append">append</dfn>, <dfn data-x="concept-node-replace" data-x-href="https://dom.spec.whatwg.org/#concept-node-replace">replace</dfn>, <dfn data-x="concept-node-replace-all" data-x-href="https://dom.spec.whatwg.org/#concept-node-replace-all">replace all</dfn>, <dfn data-x-href="https://dom.spec.whatwg.org/#string-replace-all">string replace all</dfn>, <dfn data-x="concept-node-remove" data-x-href="https://dom.spec.whatwg.org/#concept-node-remove">remove</dfn>, and <dfn data-x="concept-node-adopt" data-x-href="https://dom.spec.whatwg.org/#concept-node-adopt">adopt</dfn> algorithms for nodes</li>
<li>The <dfn data-x="concept-node-insert-ext" data-x-href="https://dom.spec.whatwg.org/#concept-node-insert-ext">insertion steps</dfn>,
<li>The <dfn data-x-href="https://dom.spec.whatwg.org/#concept-tree-descendant" data-x="concept-tree-descendant">descendant</dfn> concept</li>
<dfn data-x="concept-node-remove-ext" data-x-href="https://dom.spec.whatwg.org/#concept-node-remove-ext">removing steps</dfn>,
<dfn data-x="concept-node-adopt-ext" data-x-href="https://dom.spec.whatwg.org/#concept-node-adopt-ext">adopting steps</dfn>, and
<dfn data-x-href="https://dom.spec.whatwg.org/#concept-node-children-changed-ext">children changed steps</dfn> hooks for elements</li>
Expand Down Expand Up @@ -59458,16 +59463,17 @@ interface <dfn>HTMLTemplateElement</dfn> : <span>HTMLElement</span> {
<dt><span data-x="concept-element-dom">DOM interface</span>:</dt>
<dd w-nodev>
<pre><code class="idl">[Exposed=Window]
interface <dfn>HTMLSlotElement</dfn> : <span>HTMLElement</span> {
interface <dfn interface>HTMLSlotElement</dfn> : <span>HTMLElement</span> {
[<span>HTMLConstructor</span>] constructor();

[<span>CEReactions</span>] attribute DOMString <span data-x="dom-slot-name">name</span>;
sequence&lt;Node> <span data-x="dom-slot-assignedNodes">assignedNodes</span>(optional <span>AssignedNodesOptions</span> options = {});
sequence&lt;Element> <span data-x="dom-slot-assignedElements">assignedElements</span>(optional <span>AssignedNodesOptions</span> options = {});
undefined <span data-x="dom-slot-assign">assign</span>((<span>Element</span> or <span>Text</span>)... nodes);
};

dictionary <dfn>AssignedNodesOptions</dfn> {
boolean flatten = false;
dictionary <dfn dictionary>AssignedNodesOptions</dfn> {
boolean <dfn dict-member for="AssignedNodeOptions" data-x="dom-AssignedNodesOptions-flatten">flatten</dfn> = false;
};</code></pre>
</dd>
<dd w-dev>Uses <code>HTMLSlotElement</code>.</dd>
Expand Down Expand Up @@ -59509,33 +59515,83 @@ dictionary <dfn>AssignedNodesOptions</dfn> {
<dt><var>slot</var> . <code data-x="dom-slot-assignedElements">assignedElements</code>({ flatten: true })</dt>
<dd>Returns the same as <code data-x="dom-slot-assignedNodes">assignedNodes({ flatten: true
})</code>, limited to elements.</dd>

<dt><var>slot</var> . <code data-x="dom-slot-assign">assign</code>(...nodes)</dt>
<dd>
<p>Set <var>slot</var>'s <span>assigned nodes</span> to the given <var>nodes</var>.</p>

<p>Throws a <span>"<code>NotAllowedError</code>"</span> <code>DOMException</code> if
<var>slot</var>'s <span>root</span> is not a <span>shadow root</span>, its <span>root</span>'s
<span>slot assignment</span> is not "manual", or <var>nodes</var> are not <span>slottable</span>
children of <var>slot</var>'s <span>root</span>'s <span>shadow host</span>.</p>
</dd>
</dl>

<p>The <dfn data-x="dom-slot-name"><code>name</code></dfn> IDL attribute must <span>reflect</span>
the content attribute of the same name.</p>

<p>The <code>slot</code> element has <dfn export for="HTMLSlotElement">manually assigned
nodes</dfn>, which is an <span data-x="set">ordered set</span> of <span
data-x="slottable">slottables</span> set by <code data-x="dom-slot-assign">assign()</code>. It is
initially empty.</p>

<p>The <dfn data-x="dom-slot-assignedNodes"><code>assignedNodes(<var>options</var>)</code></dfn>
method, when invoked, must run these steps:</p>
method steps are:</p>

<ol>
<li><p>If the value of <var>options</var>'s <code data-x="">flatten</code> member is false, then
return this element's <span>assigned nodes</span>.</p></li>
<li><p>If <var>options</var>["<code data-x="dom-AssignedNodesOptions-flatten">flatten</code>"] is
false, then return <span>this</span>'s <span>assigned nodes</span>.</p></li>

<li><p>Return the result of <span>finding flattened slottables</span> with this element.</p></li>
<li><p>Return the result of <span>finding flattened slottables</span> with
<span>this</span>.</p></li>
</ol>

<p>The <dfn data-x="dom-slot-assignedElements"><code>assignedElements(<var>options</var>)</code></dfn>
method, when invoked, must run these steps:</p>
<p>The <dfn
data-x="dom-slot-assignedElements"><code>assignedElements(<var>options</var>)</code></dfn> method
steps are:</p>

<ol>
<li><p>If the value of <var>options</var>'s <code data-x="">flatten</code> member is false, then
return this element's <span>assigned nodes</span>, filtered to contain only <code>Element</code>
nodes.</p></li>
<li><p>If <var>options</var>["<code data-x="dom-AssignedNodesOptions-flatten">flatten</code>"] is
false, then return <span>this</span>'s <span>assigned nodes</span>, filtered to contain only
<code>Element</code> nodes.</p></li>

<li><p>Return the result of <span>finding flattened slottables</span> with this element, filtered
to contain only <code>Element</code> nodes.</p></li>
<li><p>Return the result of <span>finding flattened slottables</span> with <span>this</span>,
filtered to contain only <code>Element</code> nodes.</p></li>
</ol>

<p>The <dfn method for="HTMLSlotElement"
data-x="dom-slot-assign"><code>assign(...<var>nodes</var>)</code></dfn> method steps are:</p>

<ol>
<li><p>If <span>this</span>'s <span>root</span> is not a <span>shadow root</span>, or its
<span>slot assignment</span> is not "<code data-x="">manual</code>", then throw a
<span>"<code>NotAllowedError</code>"</span> <code>DOMException</code>.</p></li>

<li><p>Let <var>nodesSet</var> be a new <span data-x="set">ordered set</span>.</p></li>

<li>
<p><span data-x="list iterate">For each</span> <var>node</var> of <var>nodes</var>:</p>

<ol>
<li><p><span data-x="list iterate">For each</span> <span
data-x="concept-tree-descendant">descendant</span> <var>descendant</var> of <span>this</span>'s
<span>root</span>, in <span>tree order</span>: if <var>descendant</var> is a <span>slot</span>,
then <span data-x="list remove">remove</span> <var>node</var> from <var>descendant</var>'s
<span>manually assigned nodes</span>.</p></li>

<li><p>If <var>nodesSet</var> contains <var>node</var>, then <span
data-x="list remove">remove</span> <var>node</var> from <var>nodesSet</var>.</p></li>

<li><p><span data-x="set append">Append</span> <var>node</var> to <var>nodesSet</var>.</p></li>
</ol>
</li>

<li><p>Set <span>this</span>'s <span>manually assigned nodes</span> to
<var>nodesSet</var>.</p></li>

<li><p>Run <span>assign slottables for a tree</span> for <span>this</span>'s
<span>root</span>.</p></li>
</ol>


<h4 split-filename="canvas">The <dfn id="canvas"><code>canvas</code></dfn> element</h4>
Expand Down Expand Up @@ -124194,6 +124250,7 @@ INSERT INTERFACES HERE
Simon Fraser,
Simon Montagu,
Simon Sapin,
Yu Han, <!-- yuzhe-han on GitHub -->
Simon Spiegel,
skeww, <!-- on reddit -->
Smylers,
Expand Down