summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/custom-elements/reactions/Document.html
blob: 4c5d2eb6e2ee0c580f2490c8a5d7d14f27ca79e0 (plain)
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
<!DOCTYPE html>
<html>
<head>
<title>Custom Elements: CEReactions on Document interface</title>
<meta name="author" title="Ryosuke Niwa" href="mailto:rniwa@webkit.org">
<meta name="assert" content="importNode and adoptNode of Document interface must have CEReactions">
<meta name="help" content="https://dom.spec.whatwg.org/#document">
<meta name="help" content="https://html.spec.whatwg.org/#document">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="../resources/custom-elements-helpers.js"></script>
<script src="./resources/reactions.js"></script>
</head>
<body>
<div id="log"></div>
<script>

test_with_window(function (contentWindow, contentDocument) {
    const element = define_custom_element_in_window(contentWindow, 'custom-element', []);
    const instance = contentDocument.createElement('custom-element');
    assert_array_equals(element.takeLog().types(), ['constructed']);

    const newDoc = contentDocument.implementation.createHTMLDocument();
    newDoc.importNode(instance);

    assert_array_equals(element.takeLog().types(), []);
}, 'importNode on Document must not construct a new custom element when importing a custom element into a window-less document');

test_with_window(function (contentWindow, contentDocument) {
    const element = define_custom_element_in_window(contentWindow, 'custom-element', []);
    const template = contentDocument.createElement('template');
    template.innerHTML = '<custom-element></custom-element>';
    assert_array_equals(element.takeLog().types(), []);
    contentDocument.importNode(template.content, true);
    assert_array_equals(element.takeLog().types(), ['constructed']);
}, 'importNode on Document must construct a new custom element when importing a custom element from a template');

test_with_window(function (contentWindow, contentDocument) {
    const element = define_custom_element_in_window(contentWindow, 'custom-element', []);
    const instance = contentDocument.createElement('custom-element');
    assert_array_equals(element.takeLog().types(), ['constructed']);

    const newDoc = contentDocument.implementation.createHTMLDocument();
    newDoc.adoptNode(instance);

    const logEntries = element.takeLog();
    assert_array_equals(logEntries.types(), ['adopted']);
    assert_equals(logEntries.last().oldDocument, contentDocument);
    assert_equals(logEntries.last().newDocument, newDoc);
}, 'adoptNode on Document must enqueue an adopted reaction when importing a custom element');

test_with_window(function (contentWindow, contentDocument) {
    const element = define_custom_element_in_window(contentWindow, 'custom-element', []);
    const instance = contentDocument.createElement('custom-element');

    const container = contentDocument.createElement('div');
    container.contentEditable = true;
    container.appendChild(instance);
    contentDocument.body.appendChild(container);

    assert_array_equals(element.takeLog().types(), ['constructed', 'connected']);

    container.focus();
    contentDocument.getSelection().collapse(container, 1);
    contentDocument.execCommand('delete', false, null);

    assert_array_equals(element.takeLog().types(), ['disconnected']);
}, 'execCommand on Document must enqueue a disconnected reaction when deleting a custom element from a contenteditable element');

test_with_window(function (contentWindow, contentDocument) {
    const element = define_custom_element_in_window(contentWindow, 'custom-element', []);

    contentDocument.title = '';
    const title = contentDocument.querySelector('title');
    const instance = contentDocument.createElement('custom-element');
    title.appendChild(instance);
    instance.textContent = 'hello';

    assert_array_equals(element.takeLog().types(), ['constructed', 'connected']);
    assert_equals(title.innerHTML, '<custom-element>hello</custom-element>');

    title.text = 'world';
    assert_equals(title.innerHTML, 'world');
    assert_array_equals(element.takeLog().types(), ['disconnected']);
}, 'title on Document must enqueue disconnectedCallback when removing a custom element');

test_with_window(function (contentWindow, contentDocument) {
    const element = define_custom_element_in_window(contentWindow, 'custom-element', []);

    const body = contentDocument.body;
    body.innerHTML = '<custom-element>hello</custom-element>';

    assert_array_equals(element.takeLog().types(), ['constructed', 'connected']);
    assert_equals(body.innerHTML, '<custom-element>hello</custom-element>');

    contentDocument.body = contentDocument.createElement('body');
    assert_array_equals(element.takeLog().types(), ['disconnected']);
}, 'body on Document must enqueue disconnectedCallback when removing a custom element');

test_with_window(function (contentWindow, contentDocument) {
    const element = define_custom_element_in_window(contentWindow, 'custom-element', []);

    const instance = contentDocument.createElement('custom-element');
    const body = contentDocument.createElement('body');
    body.appendChild(instance);

    assert_array_equals(element.takeLog().types(), ['constructed']);
    assert_equals(body.innerHTML, '<custom-element></custom-element>');

    contentDocument.body = body;
    assert_array_equals(element.takeLog().types(), ['connected']);
}, 'body on Document must enqueue connectedCallback when inserting a custom element');

test_with_window(function (contentWindow, contentDocument) {
    const element = define_custom_element_in_window(contentWindow, 'custom-element', []);
    contentDocument.body.innerHTML = '<custom-element></custom-element>';
    assert_array_equals(element.takeLog().types(), ['constructed', 'connected']);

    contentDocument.open();
    assert_array_equals(element.takeLog().types(), ['disconnected']);
}, 'open on Document must enqueue disconnectedCallback when removing a custom element');

test_with_window(function (contentWindow, contentDocument) {
    const element = define_custom_element_in_window(contentWindow, 'custom-element', []);
    contentDocument.body.innerHTML = '<custom-element></custom-element>';
    assert_array_equals(element.takeLog().types(), ['constructed', 'connected']);

    contentDocument.write('');
    assert_array_equals(element.takeLog().types(), ['disconnected']);
}, 'write on Document must enqueue disconnectedCallback when removing a custom element');

test_with_window(function (contentWindow, contentDocument) {
    contentWindow.document.open();
    const element = define_custom_element_in_window(contentWindow, 'custom-element', []);
    contentWindow.document.write('<custom-element></custom-element>');
    assert_array_equals(element.takeLog().types(), ['constructed', 'connected']);
}, 'write on Document must enqueue connectedCallback after constructing a custom element');

test_with_window(function (contentWindow, contentDocument) {
    const element = define_custom_element_in_window(contentWindow, 'custom-element', []);
    contentDocument.body.innerHTML = '<custom-element></custom-element>';
    assert_array_equals(element.takeLog().types(), ['constructed', 'connected']);

    contentDocument.writeln('');
    assert_array_equals(element.takeLog().types(), ['disconnected']);
}, 'writeln on Document must enqueue disconnectedCallback when removing a custom element');

test_with_window(function (contentWindow) {
    contentWindow.document.open();
    const element = define_custom_element_in_window(contentWindow, 'custom-element', []);
    contentWindow.document.writeln('<custom-element></custom-element>');
    assert_array_equals(element.takeLog().types(), ['constructed', 'connected']);
}, 'writeln on Document must enqueue connectedCallback after constructing a custom element');

</script>
</body>
</html>