@webcomponents/custom-elements
Version:
HTML Custom Elements Polyfill
52 lines (47 loc) • 2.2 kB
HTML
<title>Custom Elements: Insert a node should try to upgrade</title>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="resources/custom-elements-helpers.js"></script>
<body>
<script>;
function assert_invocations(invocations, element, length, i) {
assert_equals(invocations.length, length, length == 2 ? 'inserting into different node should enqueue connectedCallback again' : 'inserting an element should enqueue connectedCallback reaction');
assert_array_equals(invocations[i].slice(0, 2), ['connected', element], 'inserting "custom" element should enqueue a connectedCallback reaction');
assert_array_equals(invocations[i][2], [], 'connectedCallback should be invoked with empty argument list');
}
// Insert a node
// https://dom.spec.whatwg.org/#concept-node-insert
// 6.5.2.1 If inclusiveDescendant is custom, then enqueue a custom element callback reaction
// with inclusiveDescendant, callback name "connectedCallback", and an empty argument list.
test_with_window(w => {
let element = w.document.createElement('a-a');
let invocations = [];
w.customElements.define('a-a', class extends w.HTMLElement {
connectedCallback() { invocations.push(['connected', this, arguments]); }
});
w.document.body.appendChild(element);
assert_invocations(invocations, element, 1, 0);
w.document.head.appendChild(element);
assert_invocations(invocations, element, 2, 1);
}, 'Insert a node that is "custom" should enqueue connectedCallback');
// 6.5.2.2. try to upgrade inclusiveDescendant.
// Try to upgrade an element
// https://html.spec.whatwg.org/multipage/scripting.html#concept-try-upgrade
test_with_window(w => {
let element = w.document.createElement('a-a');
w.customElements.define('a-a', class extends w.HTMLElement {
constructor() {
super();
this.is_upgraded = true;
}
});
assert_false('is_upgraded' in element);
assert_false(element.matches(':defined'));
w.document.body.appendChild(element);
assert_true(element.is_upgraded);
assert_true(element.matches(':defined'));
}, 'Insert a node should try to upgrade');
</script>
</body>