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
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
|
<!DOCTYPE html>
<html>
<head>
<title>Custom Elements: Enqueue a custom element upgrade reaction</title>
<meta name="author" title="Ryosuke Niwa" href="mailto:rniwa@webkit.org">
<meta name="assert" content="Enqueue a custom element upgrade reaction must upgrade a custom element">
<link rel="help" href="https://dom.spec.whatwg.org/#concept-create-element">
<link rel="help" href="https://html.spec.whatwg.org/multipage/scripting.html#concept-try-upgrade">
<link rel="help" href="https://html.spec.whatwg.org/multipage/scripting.html#enqueue-a-custom-element-upgrade-reaction">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="resources/custom-elements-helpers.js"></script>
</head>
<body>
<infinite-cloning-element-1></infinite-cloning-element-1>
<infinite-cloning-element-2 id="a"></infinite-cloning-element-2>
<infinite-cloning-element-2 id="b"></infinite-cloning-element-2>
<div id="log"></div>
<script>
setup({allow_uncaught_exception:true});
class PredefinedCustomElement extends HTMLElement {}
customElements.define('predefined-custom-element', PredefinedCustomElement);
var customElementNumber = 1;
function generateNextCustomElementName() { return 'custom-' + customElementNumber++; }
// Tests for documents without a browsing context.
document_types().filter(function (entry) { return !entry.isOwner && !entry.hasBrowsingContext; }).forEach(function (entry) {
var documentName = entry.name;
var getDocument = entry.create;
promise_test(function () {
return getDocument().then(function (doc) {
assert_false(doc.createElement('predefined-custom-element') instanceof PredefinedCustomElement);
});
}, 'Creating an element in ' + documentName + ' must not enqueue a custom element upgrade reaction'
+ ' because the document does not have a browsing context');
promise_test(function () {
var name = generateNextCustomElementName();
var unresolvedElement = document.createElement(name);
assert_equals(Object.getPrototypeOf(unresolvedElement), HTMLElement.prototype,
'[[Prototype]] internal slot of the unresolved custom element must be the HTMLElement prototype');
return getDocument().then(function (doc) {
var unresolvedElementInDoc = doc.createElement(name);
var prototype = (unresolvedElementInDoc.namespaceURI == 'http://www.w3.org/1999/xhtml' ? HTMLElement : Element).prototype;
assert_equals(Object.getPrototypeOf(unresolvedElementInDoc), prototype,
'[[Prototype]] internal slot of the unresolved custom element must be the ' + prototype.toString() + ' prototype');
var someCustomElement = class extends HTMLElement {};
customElements.define(name, someCustomElement);
assert_equals(Object.getPrototypeOf(unresolvedElementInDoc), prototype, '"define" must not upgrade a disconnected unresolved custom elements');
doc.documentElement.appendChild(unresolvedElementInDoc);
assert_equals(Object.getPrototypeOf(unresolvedElementInDoc), prototype,
'Inserting an element into a document without a browsing context must not enqueue a custom element upgrade reaction');
});
}, 'Creating an element in ' + documentName + ' and inserting into the document must not enqueue a custom element upgrade reaction');
promise_test(function () {
var name = generateNextCustomElementName();
var unresolvedElement = document.createElement(name);
assert_equals(Object.getPrototypeOf(unresolvedElement), HTMLElement.prototype,
'[[Prototype]] internal slot of the unresolved custom element must be the HTMLElement prototype');
return getDocument().then(function (doc) {
var unresolvedElementInDoc = doc.createElement(name);
var prototype = (unresolvedElementInDoc.namespaceURI == 'http://www.w3.org/1999/xhtml' ? HTMLElement : Element).prototype;
assert_equals(Object.getPrototypeOf(unresolvedElementInDoc), prototype,
'[[Prototype]] internal slot of the unresolved custom element must be the ' + prototype.toString() + ' prototype');
var someCustomElement = class extends HTMLElement {};
customElements.define(name, someCustomElement);
assert_equals(Object.getPrototypeOf(unresolvedElementInDoc), prototype, '"define" must not upgrade a disconnected unresolved custom elements');
document.body.appendChild(unresolvedElementInDoc);
if (unresolvedElementInDoc.namespaceURI == 'http://www.w3.org/1999/xhtml') {
assert_equals(Object.getPrototypeOf(unresolvedElementInDoc), someCustomElement.prototype,
'Inserting an element into a document with a browsing context must enqueue a custom element upgrade reaction');
} else {
assert_equals(Object.getPrototypeOf(unresolvedElementInDoc), prototype,
'Looking up a custom element definition must return null if the element is not in the HTML namespace');
}
});
}, 'Creating an element in ' + documentName + ' and adopting back to a document with browsing context must enqueue a custom element upgrade reaction');
});
// Tests for documents with a browsing context.
document_types().filter(function (entry) { return !entry.isOwner && entry.hasBrowsingContext; }).forEach(function (entry) {
var documentName = entry.name;
var getDocument = entry.create;
promise_test(function () {
return getDocument().then(function (doc) {
assert_false(doc.createElement('predefined-custom-element') instanceof PredefinedCustomElement);
});
}, 'Creating an element in ' + documentName + ' must not enqueue a custom element upgrade reaction if there is no matching definition');
promise_test(function () {
return getDocument().then(function (doc) {
var docWindow = doc.defaultView;
class DistinctPredefinedCustomElement extends docWindow.HTMLElement { };
docWindow.customElements.define('predefined-custom-element', DistinctPredefinedCustomElement);
assert_true(doc.createElement('predefined-custom-element') instanceof DistinctPredefinedCustomElement);
});
}, 'Creating an element in ' + documentName + ' must enqueue a custom element upgrade reaction if there is a matching definition');
promise_test(function () {
var unresolvedElement = document.createElement('unresolved-element');
return getDocument().then(function (doc) {
var docWindow = doc.defaultView;
class UnresolvedElement extends docWindow.HTMLElement { };
var unresolvedElementInDoc = doc.createElement('unresolved-element');
assert_equals(Object.getPrototypeOf(unresolvedElement), HTMLElement.prototype);
assert_equals(Object.getPrototypeOf(unresolvedElementInDoc), docWindow.HTMLElement.prototype);
docWindow.customElements.define('unresolved-element', UnresolvedElement);
assert_equals(Object.getPrototypeOf(unresolvedElement), HTMLElement.prototype);
assert_equals(Object.getPrototypeOf(unresolvedElementInDoc), docWindow.HTMLElement.prototype);
});
}, '"define" in ' + documentName + ' must not enqueue a custom element upgrade reaction on a disconnected unresolved custom element');
promise_test(function () {
var unresolvedElement = document.createElement('unresolved-element');
return getDocument().then(function (doc) {
var docWindow = doc.defaultView;
class UnresolvedElement extends docWindow.HTMLElement { };
var unresolvedElementInDoc = doc.createElement('unresolved-element');
assert_equals(Object.getPrototypeOf(unresolvedElement), HTMLElement.prototype);
assert_equals(Object.getPrototypeOf(unresolvedElementInDoc), docWindow.HTMLElement.prototype);
docWindow.customElements.define('unresolved-element', UnresolvedElement);
doc.documentElement.appendChild(unresolvedElementInDoc);
assert_equals(Object.getPrototypeOf(unresolvedElement), HTMLElement.prototype);
assert_equals(Object.getPrototypeOf(unresolvedElementInDoc), UnresolvedElement.prototype);
});
}, 'Inserting an unresolved custom element into ' + documentName + ' must enqueue a custom element upgrade reaction');
promise_test(function () {
var unresolvedElement = document.createElement('unresolved-element');
return getDocument().then(function (doc) {
var docWindow = doc.defaultView;
class UnresolvedElement extends docWindow.HTMLElement { };
var unresolvedElementInDoc = doc.createElement('unresolved-element');
doc.documentElement.appendChild(unresolvedElementInDoc);
assert_equals(Object.getPrototypeOf(unresolvedElement), HTMLElement.prototype);
assert_equals(Object.getPrototypeOf(unresolvedElementInDoc), docWindow.HTMLElement.prototype);
docWindow.customElements.define('unresolved-element', UnresolvedElement);
assert_equals(Object.getPrototypeOf(unresolvedElement), HTMLElement.prototype);
assert_equals(Object.getPrototypeOf(unresolvedElementInDoc), UnresolvedElement.prototype);
});
}, '"define" in ' + documentName + ' must enqueue a custom element upgrade reaction on a connected unresolved custom element');
promise_test(function () {
var unresolvedElement = document.createElement('unresolved-element');
return getDocument().then(function (doc) {
var docWindow = doc.defaultView;
class UnresolvedElement extends docWindow.HTMLElement { };
assert_false(unresolvedElement instanceof UnresolvedElement);
docWindow.customElements.define('unresolved-element', UnresolvedElement);
doc.adoptNode(unresolvedElement);
assert_false(unresolvedElement instanceof UnresolvedElement);
});
}, 'Adopting (and leaving disconnceted) an unresolved custom element into ' + documentName + ' must not enqueue a custom element upgrade reaction');
promise_test(function () {
var unresolvedElement = document.createElement('unresolved-element');
return getDocument().then(function (doc) {
var docWindow = doc.defaultView;
class UnresolvedElement extends docWindow.HTMLElement { };
assert_false(unresolvedElement instanceof UnresolvedElement);
docWindow.customElements.define('unresolved-element', UnresolvedElement);
doc.documentElement.appendChild(unresolvedElement);
assert_true(unresolvedElement instanceof UnresolvedElement);
});
}, 'Adopting and inserting an unresolved custom element into ' + documentName + ' must enqueue a custom element upgrade reaction');
});
test(() => {
class ShadowDisabledElement extends HTMLElement {
static get disabledFeatures() { return ['shadow']; }
}
let error = null;
window.addEventListener('error', e => { error = e.error; }, {once: true});
let element = document.createElement('shadow-disabled');
element.attachShadow({mode: 'open'});
customElements.define('shadow-disabled', ShadowDisabledElement);
customElements.upgrade(element);
assert_false(element instanceof ShadowDisabledElement,
'Upgrading should fail.');
assert_true(error instanceof DOMException);
assert_equals(error.name, 'NotSupportedError');
}, 'If definition\'s disable shadow is true and element\'s shadow root is ' +
'non-null, then throw a "NotSupportedError" DOMException.');
test(() => {
var log = [];
customElements.define('infinite-cloning-element-1',class extends HTMLElement {
constructor() {
super();
log.push([this, 'begin']);
// Potential infinite recursion:
customElements.upgrade(this);
log.push([this, 'end']);
}
});
assert_equals(log.length, 2);
const instance = document.querySelector("infinite-cloning-element-1");
assert_array_equals(log[0], [instance, 'begin']);
assert_array_equals(log[1], [instance, 'end']);
}, 'Infinite constructor recursion with upgrade(this) should not be possible');
test(() => {
var log = [];
customElements.define('infinite-cloning-element-2',class extends HTMLElement {
constructor() {
super();
log.push([this, 'begin']);
const b = document.querySelector("#b");
b.remove();
// While this constructor is running for "a", "b" is still
// undefined, and so inserting it into the document will enqueue a
// second upgrade reaction for "b" in addition to the one enqueued
// by defining x-foo.
document.body.appendChild(b);
log.push([this, 'end']);
}
});
assert_equals(log.length, 4);
const instanceA = document.querySelector("#a");
const instanceB = document.querySelector("#b");
assert_array_equals(log[0], [instanceA, 'begin']);
assert_array_equals(log[1], [instanceB, 'begin']);
assert_array_equals(log[2], [instanceB, 'end']);
assert_array_equals(log[3], [instanceA, 'end']);
}, 'Infinite constructor recursion with appendChild should not be possible');
</script>
</body>
</html>
|
