|
12 | 12 | const s2 = document.createElement("script");
|
13 | 13 |
|
14 | 14 | // This script, which is ultimately a *child* of the
|
15 |
| - // already-connected-but-empty `s1` script, runs first. This is because when |
16 |
| - // the DocumentFragment `df` containing this script (`s2`) is appended to |
17 |
| - // `s1`, we do not immediately execute `s1`, because of this condition: [1]. |
18 |
| - // It specifies that when a "node or document fragment is inserted into the |
19 |
| - // script", we only run the "prepare the script algorithm" for that script |
20 |
| - // "after any script elements inserted at that time". |
| 15 | + // already-connected-but-empty `s1` script, runs second, after `s1` runs. See |
| 16 | + // the example in |
| 17 | + // http://html.spec.whatwg.org/C/#script-processing-model:children-changed-steps |
| 18 | + // for more information. |
21 | 19 | //
|
22 |
| - // So upon insertion of `s2`, its insertion conditions are met and it is |
23 |
| - // prepared and run first. During its execution, it mutates `s1`, adding more |
24 |
| - // text to it. This condition still does not trigger the immediate execution |
25 |
| - // of `s1`, because `s2`'s insertion is not complete yet. |
| 20 | + // HISTORICAL CONTEXT: There used to be a condition in the HTML standard that |
| 21 | + // said an "outer" script must be "prepared" when a node gets inserted into |
| 22 | + // the script. BUT it also stipulated that if the insertion consists of any |
| 23 | + // "inner" (nested, essentially) script elements, then this "outer" script |
| 24 | + // must prepare/execute after any of those "inner" newly-inserted scripts |
| 25 | + // themselves get prepared. |
26 | 26 | //
|
27 |
| - // Once `s2` is finished being inserted, the condition to prepare and execute |
28 |
| - // `s1` is met, and it is processed accordingly, which includes the execution |
29 |
| - // of the text that `s2` added to `s1`. |
30 |
| - // |
31 |
| - // [1]: https://html.spec.whatwg.org/C#script-processing-model:prepare-the-script-element-4 |
| 27 | + // This changed in https://github.com/whatwg/html/pull/10188. |
32 | 28 | s2.textContent = `
|
33 | 29 | happened.push("s2");
|
| 30 | +
|
| 31 | + // This text never executes in the outer script, because by the time this |
| 32 | + // gets appended, the outer script has "already started" [1], so it does not |
| 33 | + // get re-prepared/executed a second time. |
| 34 | + // |
| 35 | + // [1]: https://html.spec.whatwg.org/C#already-started |
34 | 36 | s1.appendChild(new Text("happened.push('s1ran');"));
|
| 37 | +
|
35 | 38 | happened.push("s2ran");
|
36 | 39 | `;
|
37 | 40 |
|
|
41 | 44 |
|
42 | 45 | assert_array_equals(happened, []);
|
43 | 46 | s1.appendChild(df);
|
44 |
| - assert_array_equals(happened, ["s2", "s2ran", "s1", "s1ran"]); |
45 |
| -}, "An outer script does not execute until its inner `<script>` children are " + |
46 |
| - "finished being inserted into it. The outer script's execution considers " + |
47 |
| - "any script text that inner scripts added to the outer one."); |
| 47 | + assert_array_equals(happened, ["s1", "s2", "s2ran"]); |
| 48 | +}, "An outer script whose preparation/execution gets triggered by the " + |
| 49 | + "insertion of a 'nested'/'inner' script, executes *before* the inner " + |
| 50 | + "script executes"); |
48 | 51 | </script>
|
0 commit comments