1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
|
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<p>
This tests the early return steps of <a href="https://html.spec.whatwg.org/multipage/scripting.html#prepare-a-script" target="_blank" rel="noopener noreferrer">"prepare a script"</a>
that come <u>before</u> step 10 "Set the element's "already started" flag". The relevant steps are steps 6, 7 and 8.
If this algorithm returns on any of these steps, the script can be reinserted matching the requirements and will run.
</p>
<p>Expected result:</p>
<ul>
<li>Step 6 test: I ran the second time around!</li>
<li>Step 7 test: I ran the second time around!</li>
<li>Step 8 test: I ran the second time around!</li>
</ul>
<br/>
<p>Actual result:</p>
<ul id="result-list">
</ul>
<!-- Setup code -->
<script>
// This returns a piece of code that will write a result to the actual result section.
function getTestScript(stepNumber, iteration) {
return `(() => {
const resultList = document.getElementById("result-list");
const resultEntry = document.createElement("li");
resultEntry.innerText = "Step ${stepNumber} test: I ran the ${iteration} time around!";
resultList.appendChild(resultEntry);
})();`;
}
</script>
<!-- Step 6 -->
<script>
const stepSixScript = document.createElement("script");
// 6. If the element has no src attribute, and source text is the empty string, then return. The script is not executed.
document.body.appendChild(stepSixScript);
document.body.removeChild(stepSixScript);
// Step 6 now passes.
// 10. Set the element's "already started" flag.
stepSixScript.innerText = getTestScript(6, "second");
document.body.appendChild(stepSixScript);
document.body.removeChild(stepSixScript);
// 1. If the script element is marked as having "already started", then return. The script is not executed.
stepSixScript.innerText = getTestScript(6, "third");
document.body.appendChild(stepSixScript);
</script>
<template id="step-seven-template">
<script>
// This is duplicated from getTestScript as this script will not run because it's not connected.
// See the NOTE in the script block below about why this is done here.
(() => {
const resultList = document.getElementById("result-list");
const resultEntry = document.createElement("li");
resultEntry.innerText = "Step 7 test: I ran the first time around!";
resultList.appendChild(resultEntry);
})();
</script>
</template>
<!-- Step 7 -->
<script>
const stepSevenTemplate = document.getElementById("step-seven-template");
const stepSevenScript = stepSevenTemplate.content.firstElementChild;
// 7. If the element is not connected, then return. The script is not executed.
// NOTE: This is done above because this can only be achieved via the parser, as the script element insertion steps do not prepare the script if the element is not connected.
// Step 7 now passes.
// 10. Set the element's "already started" flag.
stepSevenScript.remove();
stepSevenScript.innerText = getTestScript(7, "second");
document.body.appendChild(stepSevenScript);
document.body.removeChild(stepSevenScript);
// 1. If the script element is marked as having "already started", then return. The script is not executed.
stepSevenScript.innerText = getTestScript(7, "third");
document.body.appendChild(stepSevenScript);
</script>
<!-- Step 8 -->
<script>
const stepEightScript = document.createElement("script");
// 8. If either:
// ...snip...
// Otherwise, if the script element has a type attribute, let the script block's type string for this script element be the value of that attribute.
// Determine the script's type as follows:
// ...snip...
// - If neither of the above conditions are true, then return. No script is executed.
stepEightScript.innerText = getTestScript(8, "first");
stepEightScript.type = "unknown"; // Unknown type - the script won't run.
document.body.appendChild(stepEightScript);
document.body.removeChild(stepEightScript);
// Determine the script's type as follows:
// - If the script block's type string with leading and trailing ASCII whitespace stripped is a JavaScript MIME type essence match, the script's type is "classic".
// 10. Set the element's "already started" flag.
stepEightScript.innerText = getTestScript(8, "second");
stepEightScript.type = "text/javascript"; // Known type - the script should now run!
document.body.appendChild(stepEightScript);
document.body.removeChild(stepEightScript);
// 1. If the script element is marked as having "already started", then return. The script is not executed.
stepEightScript.innerText = getTestScript(8, "third");
document.body.appendChild(stepEightScript);
</script>
</body>
</html>
|
