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
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
|
<!DOCTYPE html>
<meta charset="utf-8">
<title>Lexical scopes when compiling an inline event handler</title>
<link rel="help" href="https://html.spec.whatwg.org/C/#getting-the-current-value-of-the-event-handler">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script>
setup({allow_uncaught_exception: true});
</script>
<!-- test case 1: element, document, and window -->
<table>
<tr id="test1_outer">
<td id="test1_target" onclick="
window.testResults.complete = typeof(complete);
window.testResults.cellIndex = typeof(cellIndex);
window.testResults.cells = typeof(cells);
window.testResults.domain = typeof(domain);
window.testResults.print = typeof(print);
window.testResults.testResults = typeof(testResults);
window.testResults.target_own_property = typeof(target_own_property);
window.testResults.inner_own_property = typeof(inner_own_property);
window.testResults.outer_own_property = typeof(outer_own_property);
window.testResults.event = typeof(event);
">
<img id="test1_inner">
</td>
</tr>
</table>
<script>
"use strict";
test(() => {
const target_element = document.getElementById("test1_target");
const inner_element = document.getElementById("test1_inner");
const outer_element = document.getElementById("test1_outer");
target_element.target_own_property = {};
inner_element.inner_own_property = {};
outer_element.outer_own_property = {};
const results = window.testResults = {};
// Clicking an inner element makes the event target where the event handler is
// registered doesn't match the event target that the event is fired. From a
// point of view |target_element|, event.target != event.currentTarget.
inner_element.click();
// Expected scopes are: |target_element|, document, and window.
assert_equals(results.complete, "undefined", "HTMLImageElement.prototype.complete");
assert_equals(results.cellIndex, "number", "HTMLTableCellElement.prototype.cellIndex");
assert_equals(results.cells, "undefined", "HTMLTableRowElement.prototype.cellIndex");
assert_equals(results.domain, "string", "Document.prototype.domain");
assert_equals(results.print, "function", "window.print");
assert_equals(results.testResults, "object");
assert_equals(results.target_own_property, "object");
assert_equals(results.inner_own_property, "undefined");
assert_equals(results.outer_own_property, "undefined");
assert_equals(results.event, "object", "The argument of event handler");
}, "The EventHandler is an element's event handler and has no form owner.");
</script>
<!-- test case 2: element, form owner, document, and window -->
<form id="test2_form_owner" onsubmit="return false;">
<!-- 'button' is a form-associated element and has a form owner.
https://html.spec.whatwg.org/C/#form-associated-element
-->
<button id="test2_target" onclick="
window.testResults.cite = typeof(cite);
window.testResults.autofocus = typeof(autofocus);
window.testResults.form = typeof(form);
window.testResults.encoding = typeof(encoding);
window.testResults.domain = typeof(domain);
window.testResults.print = typeof(print);
window.testResults.testResults = typeof(testResults);
window.testResults.target_own_property = typeof(target_own_property);
window.testResults.inner_own_property = typeof(inner_own_property);
window.testResults.form_owner_own_property = typeof(form_owner_own_property);
window.testResults.event = typeof(event);
">
<q id="test2_inner"></q>
</button>
</form>
<script>
"use strict";
test(() => {
const target_element = document.getElementById("test2_target");
const inner_element = document.getElementById("test2_inner");
const form_owner_element = document.getElementById("test2_form_owner");
target_element.target_own_property = {};
inner_element.inner_own_property = {};
form_owner_element.form_owner_own_property = {};
const results = window.testResults = {};
// Clicking an inner element makes the event target where the event handler is
// registered doesn't match the event target that the event is fired. From a
// point of view |target_element|, event.target != event.currentTarget.
inner_element.click();
// Expected scopes are: |target_element|, form owner, document, and window.
assert_equals(results.cite, "undefined", "HTMLQuoteElement.prototype.cite");
assert_equals(results.autofocus, "boolean", "HTMLButtonElement.prototype.autofocus");
assert_equals(results.form, "object", "HTMLButtonElement.prototype.form");
assert_equals(results.encoding, "string", "HTMLFormElement.prototype.encoding");
assert_equals(results.domain, "string", "Document.prototype.domain");
assert_equals(results.print, "function", "window.print");
assert_equals(results.testResults, "object");
assert_equals(results.target_own_property, "object");
assert_equals(results.inner_own_property, "undefined");
assert_equals(results.form_owner_own_property, "object");
assert_equals(results.event, "object", "The argument of event handler");
}, "The EventHandler is an element's event handler and has a form owner.");
</script>
<!-- test case 3: element and window -->
<a id="test3_inner"></a>
<script>
"use strict";
// This test is placed at last so that it can safely use a global variable
// without conflicting other tests. Only this test is asynchronous.
async_test(t => {
const target_element = window;
const inner_element = document.getElementById("test3_inner");
target_element.target_own_property = {};
inner_element.inner_own_property = {};
document.body.body_own_property = {};
// "onerror" is one of the Window-reflecting body element event handler set.
// https://html.spec.whatwg.org/C/#window-reflecting-body-element-event-handler-set
// So, the EventHandler is treated as a Window's event handler.
document.body.setAttribute("onerror", "\
window.testResults.ping = typeof(ping); \
window.testResults.domain = typeof(domain); \
window.testResults.print = typeof(print); \
window.testResults.testResults = typeof(testResults); \
window.testResults.target_own_property = typeof(target_own_property); \
window.testResults.inner_own_property = typeof(inner_own_property); \
window.testResults.body_own_property = typeof(body_own_property); \
window.testResults.event = typeof(event); \
");
const results = window.testResults = {};
window.addEventListener("error", t.step_func_done(() => {
// Expected scopes are: |target_element| and window only.
assert_equals(results.domain, "undefined", "Document.prototype.domain");
assert_equals(results.print, "function", "window.print");
assert_equals(results.testResults, "object");
assert_equals(results.target_own_property, "object");
assert_equals(results.inner_own_property, "undefined");
assert_in_array(results.event, ["object", "string"], "The first argument of onerror event handler");
}));
// Make a compilation error happen in order to invoke onerror event handler.
inner_element.setAttribute("onclick", "cause a compilation error");
inner_element.click();
}, "The EventHandler is not an element's event handler (i.e. Window's event handler) and has no form owner.");
</script>
|