4b8a6d8a541d96dc2530e3aa2fd02d925b22f003
[WebKit.git] / LayoutTests / fast / shadow-dom / NonDocumentTypeChildNode-interface-assignedSlot.html
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <title>Shadow DOM: Extensions to NonDocumentTypeChildNode interface</title>
5 <meta name="author" title="Ryosuke Niwa" href="mailto:rniwa@webkit.org">
6 <meta name="assert" content="NonDocumentTypeChildNode interface must have assignedSlot attribute">
7 <link rel="help" href="https://w3c.github.io/webcomponents/spec/shadow/#the-slot-element">
8 <script src="../../resources/testharness.js"></script>
9 <script src="../../resources/testharnessreport.js"></script>
10 <link rel='stylesheet' href='../../resources/testharness.css'>
11 </head>
12 <body>
13 <div id="log"></div>
14 <script>
15
16 test(function () {
17     assert_true('assignedSlot' in Element.prototype, 'assignedSlot must be defined on Element.prototype');
18     assert_true('assignedSlot' in document.createElement('div'), 'assignedSlot must be defined on a div element');
19
20     assert_true('assignedSlot' in CharacterData.prototype, 'assignedSlot must be defined on CharacterData.prototype');
21     assert_true('assignedSlot' in document.createTextNode(''), 'assignedSlot must be defined on a text node');
22     assert_true('assignedSlot' in document.createComment(''), 'assignedSlot must be defined on a comment node');
23
24 }, 'assignedSlot attribute must be defined on NonDocumentTypeChildNode interface');
25
26 test(function () {
27     assert_equals(document.createElement('div').assignedSlot, null, 'assignedSlot must be null when the element is not in any tree');
28
29     var shadowHost = document.createElement('div');
30     var shadowRoot = shadowHost.attachShadow({mode: 'open'});
31
32     var childElement = document.createElement('b');
33     shadowHost.appendChild(childElement);
34     assert_equals(childElement.assignedSlot, null, 'assignedSlot on an element must be null when a node is not assigned of any slot');
35
36     var childTextNode = document.createTextNode('');
37     shadowHost.appendChild(childTextNode);
38     assert_equals(childTextNode.assignedSlot, null, 'assignedSlot on a text node must be null when a node is not assigned of any slot');
39
40     var commentNode = document.createComment('');
41     shadowHost.appendChild(commentNode);
42     assert_equals(commentNode.assignedSlot, null, 'assignedSlot on a comment node must be null when a node is not assigned of any slot');
43
44     var slot = document.createElement('slot');
45     slot.name = 'foo';
46     shadowRoot.appendChild(slot);
47     assert_equals(childElement.assignedSlot, null, 'assignedSlot on an element must be null when a node does not match any slot');
48     assert_equals(childTextNode.assignedSlot, null, 'assignedSlot on a text node must be null when a node does not match any slot');
49     assert_equals(commentNode.assignedSlot, null, 'assignedSlot on a comment must be null when a node does not match any slot');
50
51 }, 'assignedSlot must return null when the node does not have an assigned node');
52
53 test(function () {
54     var shadowHost = document.createElement('div');
55     var childElement = document.createElement('b');
56     shadowHost.appendChild(childElement);
57
58     var childTextNode = document.createTextNode('');
59     shadowHost.appendChild(childTextNode);
60
61     var commentNode = document.createTextNode('');
62     shadowHost.appendChild(commentNode);
63
64     var shadowRoot = shadowHost.attachShadow({mode: 'open'});
65     var slot = document.createElement('slot');
66     shadowRoot.appendChild(slot);
67
68     assert_equals(childElement.assignedSlot, slot, 'assignedSlot on an element must return the assigned default slot element');
69     assert_equals(childTextNode.assignedSlot, slot, 'assignedSlot on a text node must return the assigned default slot element');
70     assert_equals(commentNode.assignedSlot, slot, 'assignedSlot on a comment node must return the assigned default slot element');
71
72     slot.name = 'foo';
73     assert_equals(childElement.assignedSlot, null, 'assignedSlot on an element must null when the element is unassigned from a slot element');
74     assert_equals(childTextNode.assignedSlot, null, 'assignedSlot on a text node must null when the node is unassigned from a slot element');
75     assert_equals(commentNode.assignedSlot, null, 'assignedSlot on a text node must null when the node is unassigned from a slot element');
76
77     childElement.slot = 'foo';
78     assert_equals(childElement.assignedSlot, slot, 'assignedSlot on an element must return the re-assigned slot element');
79
80     slot.name = null;
81     assert_equals(childTextNode.assignedSlot, slot, 'assignedSlot on a text node must return the re-assigned slot element');
82     assert_equals(commentNode.assignedSlot, slot, 'assignedSlot on a comment node must return the re-assigned slot element');
83
84 }, 'assignedSlot must return the assigned slot');
85
86 test(function () {
87     var shadowHost = document.createElement('div');
88     var childElement = document.createElement('b');
89     shadowHost.appendChild(childElement);
90
91     var childTextNode = document.createTextNode('');
92     shadowHost.appendChild(childTextNode);
93
94     var commentNode = document.createTextNode('');
95     shadowHost.appendChild(commentNode);
96
97     var shadowRoot = shadowHost.attachShadow({mode: 'closed'});
98     var slot = document.createElement('slot');
99     shadowRoot.appendChild(slot);
100
101     assert_equals(childElement.assignedSlot, null, 'assignedSlot on an element must return the assigned slot element.');
102     assert_equals(childTextNode.assignedSlot, null, 'assignedSlot on a text node must return the assigned slot element.');
103     assert_equals(commentNode.assignedSlot, null, 'assignedSlot on a comment node must return the assigned slot element.');
104
105 }, 'assignedSlot must return null when the assigned slot element is inside a closed shadow tree');
106
107 </script>
108 </body>
109 </html>