From 129c030df3e0fc992a4340b449acb82c9da86719 Mon Sep 17 00:00:00 2001 From: Dominic Farolino Date: Wed, 28 Feb 2024 11:19:44 -0500 Subject: [PATCH 01/14] First stab at post-insertion steps --- dom.bs | 71 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 69 insertions(+), 2 deletions(-) diff --git a/dom.bs b/dom.bs index 3e4c85cb..86572f32 100644 --- a/dom.bs +++ b/dom.bs @@ -2645,12 +2645,69 @@ of a node into a parent before a child, run the

Specifications may define insertion steps for all or some nodes. The -algorithm is passed insertedNode, as indicated in the insert -algorithm below. +algorithm is passed insertedNode, as indicated in the insert algorithm +below. These steps must not modify the node tree that insertedNode +participates in, create browsing contexts, fire +events, or otherwise execute JavaScript. + +

+

While the insertion steps cannot execute JavaScript (among other things), it is expected + that they will indeed have script-observable consequences. Consider the below example: + +


+ const h1 = document.querySelector('h1');
+
+ const fragment = new DocumentFragment();
+ const script = fragment.appendChild(document.createElement('script'));
+ const style = fragment.appendChild(document.createElement('style'));
+
+ script.innerText= 'console.log(getComputedStyle(h1).color)'; // Prints 'rgb(255, 0, 0)'
+ style.innerText = 'h1 {color: rgb(255, 0, 0);}';
+
+ document.body.append(fragment);
+ 
+ +

The script in the above example prints 'rgb(255, 0, 0)' + because the following happen in order: + +

    +
  1. +

    The insert algorithm runs, which will insert the <{script}> and style elements in order. + +

      +
    1. The HTML Standard's insertion steps run for the <{script}> element; they do nothing. + [[!HTML]] + +
    2. The HTML Standard's insertion steps run for the style element; they immediately apply its style rules to the document. + [[!HTML]] + +
    3. The HTML Standard's post-insertion steps run for the <{script}> element; they run + the script, which immediately observes the style rules that were applied in the above step. + [[!HTML]] +
    +
  2. +
+
+ +

Specifications may also define post-insertion steps for all or some nodes. The +algorithm is passed insertedNode, as indicated in the insert algorithm below. + +

The purpose of the post-insertion steps is to provide an opportunity for nodes to perform any insertion-related operations that modify the node tree that +insertedNode participates in, create browsing contexts, or +otherwise execute JavaScript. These steps allow all nodes that will be inserted by a given insert operation to by inserted atomically, with all major side effects occurring +after node tree insertion is complete. + +

Specifications may define children changed steps for all or some nodes. The algorithm is passed no argument and is called from insert, @@ -2752,6 +2809,16 @@ before a child, with an optional suppress observers flag, run parent with nodes, « », previousSibling, and child.

  • Run the children changed steps for parent. + +

  • +

    For each node in nodes, in tree order: + +

      +
    1. For each shadow-including inclusive descendant inclusiveDescendant of + node, in shadow-including tree order, run the post-insertion steps with + inclusiveDescendant. +

    +
  • From 0ceca2654b94ec8e78df1b9cc1f472861fe8e563 Mon Sep 17 00:00:00 2001 From: Dominic Farolino Date: Thu, 29 Feb 2024 16:45:40 -0500 Subject: [PATCH 02/14] Fixes/review comments --- dom.bs | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/dom.bs b/dom.bs index 86572f32..eebe4a99 100644 --- a/dom.bs +++ b/dom.bs @@ -2648,7 +2648,8 @@ of a node into a parent before a child, run the algorithm is passed insertedNode, as indicated in the insert algorithm below. These steps must not modify the node tree that insertedNode participates in, create browsing contexts, fire -events, or otherwise execute JavaScript. +events, or otherwise execute JavaScript. These steps may [=queue a global task|queue tasks=] to +do these things asynchronously, however.

    While the insertion steps cannot execute JavaScript (among other things), it is expected @@ -2703,9 +2704,10 @@ for=/>insert algorithm below.

    The purpose of the post-insertion steps is to provide an opportunity for nodes to perform any insertion-related operations that modify the node tree that insertedNode participates in, create browsing contexts, or -otherwise execute JavaScript. These steps allow all nodes that will be inserted by a given insert operation to by inserted atomically, with all major side effects occurring -after node tree insertion is complete. +otherwise execute JavaScript. These steps allow a batch of nodes to be inserted +atomically with respect to script, with all major side effects occurring after the +batch insertions into the node tree is complete, but before MutationObservers are notified.

    Specifications may define From 164eae9b4bc2ea64a8a7426d6ac82e55c9904639 Mon Sep 17 00:00:00 2001 From: Dominic Farolino Date: Mon, 4 Mar 2024 14:34:04 -0500 Subject: [PATCH 03/14] Elaborate on atomicity --- dom.bs | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/dom.bs b/dom.bs index eebe4a99..3221e02e 100644 --- a/dom.bs +++ b/dom.bs @@ -2707,7 +2707,8 @@ for=/>nodes to perform any insertion-related operations that modify the n otherwise execute JavaScript. These steps allow a batch of nodes to be inserted atomically with respect to script, with all major side effects occurring after the batch insertions into the node tree is complete, but before MutationObservers are notified. +observers">MutationObservers are notified. This ensures that all pending node +tree insertions completely finish before more insertions can occurr.

    Specifications may define From 2c9f769dc168ba1e815b02bf41249d52d34b891f Mon Sep 17 00:00:00 2001 From: Dominic Farolino Date: Wed, 3 Apr 2024 23:05:05 -0400 Subject: [PATCH 04/14] Address annevk review --- dom.bs | 40 ++++++++++++++++++++-------------------- 1 file changed, 20 insertions(+), 20 deletions(-) diff --git a/dom.bs b/dom.bs index 3221e02e..5f293155 100644 --- a/dom.bs +++ b/dom.bs @@ -2652,8 +2652,8 @@ events, or otherwise execute JavaScript. These steps may [=queue a global ta do these things asynchronously, however.

    -

    While the insertion steps cannot execute JavaScript (among other things), it is expected - that they will indeed have script-observable consequences. Consider the below example: +

    While the insertion steps cannot execute JavaScript (among other things), they will + indeed have script-observable consequences. Consider the below example:

    
      const h1 = document.querySelector('h1');
    @@ -2706,9 +2706,8 @@ for=/>nodes to perform any insertion-related operations that modify the n
     insertedNode participates in, create browsing contexts, or
     otherwise execute JavaScript. These steps allow a batch of nodes to be inserted
     atomically with respect to script, with all major side effects occurring after the
    -batch insertions into the node tree is complete, but before MutationObservers are notified. This ensures that all pending node
    -tree insertions completely finish before more insertions can occurr.
    +batch insertions into the node tree is complete. This ensures that all pending node
    +tree insertions completely finish before more insertions can occur.
     
     
     

    Specifications may define @@ -2784,25 +2783,26 @@ before a child, with an optional suppress observers flag, run

    For each shadow-including inclusive descendant inclusiveDescendant of node, in shadow-including tree order: -

      -
    1. Run the insertion steps with inclusiveDescendant. +

        +
      1. Run the insertion steps with inclusiveDescendant. -

      2. -

        If inclusiveDescendant is connected, then: +

      3. +

        If inclusiveDescendant is connected, then: -

          -
        1. If inclusiveDescendant is custom, then - enqueue a custom element callback reaction with inclusiveDescendant, - callback name "connectedCallback", and an empty argument list. +

            +
          1. If inclusiveDescendant is custom, then + enqueue a custom element callback reaction with inclusiveDescendant, + callback name "connectedCallback", and an empty argument list. -

          2. -

            Otherwise, try to upgrade - inclusiveDescendant. +

          3. +

            Otherwise, try to upgrade + inclusiveDescendant. -

            If this successfully upgrades inclusiveDescendant, its - connectedCallback will be enqueued automatically during the - upgrade an element algorithm. -

          +

          If this successfully upgrades inclusiveDescendant, its + connectedCallback will be enqueued automatically during the + upgrade an element algorithm. +

        +

    2. From 6d3838d56d67119a9321efa86853520530b3129d Mon Sep 17 00:00:00 2001 From: Dominic Farolino Date: Thu, 4 Apr 2024 09:31:22 -0400 Subject: [PATCH 05/14] Fix indenting --- dom.bs | 31 +++++++++++++++---------------- 1 file changed, 15 insertions(+), 16 deletions(-) diff --git a/dom.bs b/dom.bs index 5f293155..2d331456 100644 --- a/dom.bs +++ b/dom.bs @@ -2783,26 +2783,25 @@ before a child, with an optional suppress observers flag, run

      For each shadow-including inclusive descendant inclusiveDescendant of node, in shadow-including tree order: -

        -
      1. Run the insertion steps with inclusiveDescendant. +

          +
        1. Run the insertion steps with inclusiveDescendant. -

        2. -

          If inclusiveDescendant is connected, then: +

        3. +

          If inclusiveDescendant is connected, then: -

            -
          1. If inclusiveDescendant is custom, then - enqueue a custom element callback reaction with inclusiveDescendant, - callback name "connectedCallback", and an empty argument list. +

              +
            1. If inclusiveDescendant is custom, then + enqueue a custom element callback reaction with inclusiveDescendant, + callback name "connectedCallback", and an empty argument list. -

            2. -

              Otherwise, try to upgrade - inclusiveDescendant. +

            3. +

              Otherwise, try to upgrade + inclusiveDescendant. -

              If this successfully upgrades inclusiveDescendant, its - connectedCallback will be enqueued automatically during the - upgrade an element algorithm. -

            -

            +

            If this successfully upgrades inclusiveDescendant, its + connectedCallback will be enqueued automatically during the + upgrade an element algorithm. +

      2. From 2ffb2de1d109ce54837df37d938ca58c5358abff Mon Sep 17 00:00:00 2001 From: Dominic Farolino Date: Thu, 4 Apr 2024 09:33:02 -0400 Subject: [PATCH 06/14] Fix newline --- dom.bs | 1 - 1 file changed, 1 deletion(-) diff --git a/dom.bs b/dom.bs index 2d331456..3460893d 100644 --- a/dom.bs +++ b/dom.bs @@ -2709,7 +2709,6 @@ otherwise execute JavaScript. These steps allow a batch of nodes to be node tree is complete. This ensures that all pending node tree insertions completely finish before more insertions can occur. -

        Specifications may define children changed steps for all or some nodes. The algorithm is passed no argument and is called from insert, From 48d1ee55814514120b5bbc543109647895de5b0c Mon Sep 17 00:00:00 2001 From: Dominic Farolino Date: Thu, 4 Apr 2024 10:21:49 -0400 Subject: [PATCH 07/14] Fix indentation for real --- dom.bs | 32 ++++++++++++++++---------------- 1 file changed, 16 insertions(+), 16 deletions(-) diff --git a/dom.bs b/dom.bs index 3460893d..d3432b35 100644 --- a/dom.bs +++ b/dom.bs @@ -2671,25 +2671,25 @@ do these things asynchronously, however.

        The script in the above example prints 'rgb(255, 0, 0)' because the following happen in order: -

          -
        1. -

          The insert algorithm runs, which will insert the <{script}> and style elements in order. +

            +
          1. +

            The insert algorithm runs, which will insert the <{script}> and style elements in order. -

              -
            1. The HTML Standard's insertion steps run for the <{script}> element; they do nothing. - [[!HTML]] +
                +
              1. The HTML Standard's insertion steps run for the <{script}> element; they do nothing. + [[!HTML]] -
              2. The HTML Standard's insertion steps run for the style element; they immediately apply its style rules to the document. - [[!HTML]] +
              3. The HTML Standard's insertion steps run for the style element; they immediately apply its style rules to the document. + [[!HTML]] -
              4. The HTML Standard's post-insertion steps run for the <{script}> element; they run - the script, which immediately observes the style rules that were applied in the above step. - [[!HTML]] -
              -
            2. -
            +
          2. The HTML Standard's post-insertion steps run for the <{script}> element; they run + the script, which immediately observes the style rules that were applied in the above step. + [[!HTML]] +
          +
        2. +

    Specifications may also define post-insertion steps for all or some nodes. The -algorithm is passed insertedNode, as indicated in the insert algorithm below. +id=concept-node-post-connection-ext>post-connection steps for all or some nodes. +The algorithm is passed connectedNode, as indicated in the insert +algorithm below. -

    The purpose of the post-insertion steps is to provide an opportunity for nodes to perform any insertion-related operations that modify the node tree that -insertedNode participates in, create browsing contexts, or +

    The purpose of the post-connection steps is to provide an opportunity for nodes to perform any connection-related operations that modify the node tree that +connectedNode participates in, create browsing contexts, or otherwise execute JavaScript. These steps allow a batch of nodes to be inserted -atomically with respect to script, with all major side effects occurring after the +atomically with respect to script, with all major side effects occurring after the batch insertions into the node tree is complete. This ensures that all pending node tree insertions completely finish before more insertions can occur. @@ -2815,11 +2815,11 @@ before a child, with an optional suppress observers flag, run

    Let staticNodeList be a list of nodes, initially empty.

    -

    We collect all nodes before calling the post-insertion - steps on any one of them, instead of calling the post-insertion steps while - we're traversing the node tree. This is because the post-insertion steps can - modify the tree's structure, making live traversal unsafe, possibly leading to the - post-insertion steps being called multiple times on the same node.

    +

    We collect all nodes before calling the post-connection + steps on any one of them, instead of calling the post-connection steps while + we're traversing the node tree. This is because the post-connection steps can modify + the tree's structure, making live traversal unsafe, possibly leading to the post-connection + steps being called multiple times on the same node.

  • @@ -2833,7 +2833,7 @@ before a child, with an optional suppress observers flag, run
  • For each node in staticNodeList, if node is - connected, then run the post-insertion steps with node. + connected, then run the post-connection steps with node. From ffa0b2ee207257431be3c417418464d01639e449 Mon Sep 17 00:00:00 2001 From: Dominic Farolino Date: Fri, 31 May 2024 12:32:12 +0200 Subject: [PATCH 11/14] Address comments --- dom.bs | 30 ++++++++++++++---------------- 1 file changed, 14 insertions(+), 16 deletions(-) diff --git a/dom.bs b/dom.bs index 11da98d9..89327bb0 100644 --- a/dom.bs +++ b/dom.bs @@ -2662,30 +2662,29 @@ do these things asynchronously, however. const script = fragment.appendChild(document.createElement('script')); const style = fragment.appendChild(document.createElement('style')); - script.innerText= 'console.log(getComputedStyle(h1).color)'; // Prints 'rgb(255, 0, 0)' + script.innerText= 'console.log(getComputedStyle(h1).color)'; // Logs 'rgb(255, 0, 0)' style.innerText = 'h1 {color: rgb(255, 0, 0);}'; document.body.append(fragment); -

    The script in the above example prints 'rgb(255, 0, 0)' - because the following happen in order: +

    The script in the above example logs 'rgb(255, 0, 0)' because + the following happen in order:

      -
    1. -

      The insert algorithm runs, which will insert the <{script}> and style elements in order. +

    2. The insert algorithm runs, which will insert the <{script}> and + style elements in order.

        -
      1. The HTML Standard's insertion steps run for the <{script}> element; they do nothing. - [[!HTML]] +
      2. The HTML Standard's insertion steps run for the <{script}> element; they do + nothing. [[!HTML]] -

      3. The HTML Standard's insertion steps run for the style element; they immediately apply its style rules to the document. - [[!HTML]] +
      4. The HTML Standard's insertion steps run for the + style element; they immediately apply its style rules to the + document. [[!HTML]] -

      5. The HTML Standard's post-connection steps run for the <{script}> element; they run the - script, which immediately observes the style rules that were applied in the above step. +
      6. The HTML Standard's post-connection steps run for the <{script}> element; they run + the script, which immediately observes the style rules that were applied in the above step. [[!HTML]]

    3. @@ -2812,8 +2811,7 @@ before a child, with an optional suppress observers flag, run
    4. Run the children changed steps for parent.

    5. -

      Let staticNodeList be a list of nodes, initially - empty.

      +

      Let staticNodeList be a list of nodes, initially « ».

      We collect all nodes before calling the post-connection steps on any one of them, instead of calling the post-connection steps while @@ -2832,7 +2830,7 @@ before a child, with an optional suppress observers flag, run

  • -
  • For each node in staticNodeList, if node is +

  • For each node of staticNodeList, if node is connected, then run the post-connection steps with node. From 7e18bc488c1eec71bb84eeabdf7f2fae320cca8a Mon Sep 17 00:00:00 2001 From: Dominic Farolino Date: Fri, 31 May 2024 13:46:01 +0200 Subject: [PATCH 12/14] Fix phrase-level wrapping --- dom.bs | 39 ++++++++++++++++++++------------------- 1 file changed, 20 insertions(+), 19 deletions(-) diff --git a/dom.bs b/dom.bs index 89327bb0..c0dede54 100644 --- a/dom.bs +++ b/dom.bs @@ -2647,9 +2647,9 @@ of a node into a parent before a child, run the insertion steps for all or some nodes. The algorithm is passed insertedNode, as indicated in the insert algorithm below. These steps must not modify the node tree that insertedNode -participates in, create browsing contexts, fire -events, or otherwise execute JavaScript. These steps may [=queue a global task|queue tasks=] to -do these things asynchronously, however. +participates in, create browsing contexts, +fire events, or otherwise execute JavaScript. These steps may +[=queue a global task|queue tasks=] to do these things asynchronously, however.

    While the insertion steps cannot execute JavaScript (among other things), they will @@ -2695,18 +2695,18 @@ do these things asynchronously, however. adjust this further based on the requirements of the script element. There might be other ways to define that though as Olli suggests, so leaving that out for now. --> -

    Specifications may also define post-connection steps for all or some nodes. -The algorithm is passed connectedNode, as indicated in the insert -algorithm below. +

    Specifications may also define +post-connection steps for all or some +nodes. The algorithm is passed connectedNode, as indicated in the +insert algorithm below. -

    The purpose of the post-connection steps is to provide an opportunity for nodes to perform any connection-related operations that modify the node tree that -connectedNode participates in, create browsing contexts, or -otherwise execute JavaScript. These steps allow a batch of nodes to be inserted -atomically with respect to script, with all major side effects occurring after the -batch insertions into the node tree is complete. This ensures that all pending node -tree insertions completely finish before more insertions can occur. +

    The purpose of the post-connection steps is to provide an opportunity for +nodes to perform any connection-related operations that modify the node tree +that connectedNode participates in, create browsing contexts, +or otherwise execute JavaScript. These steps allow a batch of nodes to be +inserted atomically with respect to script, with all major side effects +occurring after the batch insertions into the node tree is complete. This ensures +that all pending node tree insertions completely finish before more insertions can occur.

    Specifications may define children changed steps for all or some @@ -2813,11 +2813,12 @@ before a child, with an optional suppress observers flag, run

  • Let staticNodeList be a list of nodes, initially « ».

    -

    We collect all nodes before calling the post-connection - steps on any one of them, instead of calling the post-connection steps while - we're traversing the node tree. This is because the post-connection steps can modify - the tree's structure, making live traversal unsafe, possibly leading to the post-connection - steps being called multiple times on the same node.

    +

    We collect all nodes before calling the + post-connection steps on any one of them, instead of calling the + post-connection steps while we're traversing the node tree. This is because + the post-connection steps can modify the tree's structure, making live traversal unsafe, + possibly leading to the post-connection steps being called multiple times on the same + node.

  • From 705aa2f054cd5452132ea287072f886d2b1389e6 Mon Sep 17 00:00:00 2001 From: Dominic Farolino Date: Fri, 31 May 2024 13:49:36 +0200 Subject: [PATCH 13/14] Remove whitespace --- dom.bs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/dom.bs b/dom.bs index c0dede54..e002855b 100644 --- a/dom.bs +++ b/dom.bs @@ -2706,7 +2706,7 @@ that connectedNode participates in, create bro or otherwise execute JavaScript. These steps allow a batch of nodes to be inserted atomically with respect to script, with all major side effects occurring after the batch insertions into the node tree is complete. This ensures -that all pending node tree insertions completely finish before more insertions can occur. +that all pending node tree insertions completely finish before more insertions can occur.

    Specifications may define children changed steps for all or some From fb21a6d9153b698e6644b739902627b9870f47d9 Mon Sep 17 00:00:00 2001 From: Dominic Farolino Date: Mon, 3 Jun 2024 12:26:05 +0200 Subject: [PATCH 14/14] in => of --- dom.bs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/dom.bs b/dom.bs index e002855b..2b99f885 100644 --- a/dom.bs +++ b/dom.bs @@ -2822,7 +2822,7 @@ before a child, with an optional suppress observers flag, run

  • -

    For each node in nodes, in tree order: +

    For each node of nodes, in tree order:

    1. For each shadow-including inclusive descendant inclusiveDescendant of