Google Git
Sign in
chromium / external / w3c / web-platform-tests / 1c875e75f9e55de84802e56d15def868fbfb799b / . / shadow-dom / Slottable-mixin.html
blob: 84c7fce44501daf269e6a20c6dac8619d3b197f1 [file] [log] [blame]
Ryosuke Niwa68905c22016-09-21 13:47:32[diff] [blame]1<!DOCTYPE html>
2<html>
3<head>
Philip Jägenstedta35a7402020-05-05 11:31:08[diff] [blame]4<title>Shadow DOM: Slottable mixin</title>
Ryosuke Niwa68905c22016-09-21 13:47:32[diff] [blame]5<meta name="author" title="Ryosuke Niwa" href="mailto:rniwa@webkit.org">
Philip Jägenstedta35a7402020-05-05 11:31:08[diff] [blame]6<meta name="assert" content="Element and Text interfaces must implement Slottable mixin">
Ryosuke Niwa68905c22016-09-21 13:47:32[diff] [blame]7<link rel="help" href="https://dom.spec.whatwg.org/#slotable">
8<script src="/resources/testharness.js"></script>
9<script src="/resources/testharnessreport.js"></script>
10</head>
11<body>
12<div id="log"></div>
13<script>
14
15test(function () {
16 assert_true('assignedSlot' in Element.prototype, 'assignedSlot must be defined on Element.prototype');
17 assert_true('assignedSlot' in document.createElement('div'), 'assignedSlot must be defined on a div element');
18
19 assert_true('assignedSlot' in Text.prototype, 'assignedSlot must be defined on Text.prototype');
20 assert_true('assignedSlot' in document.createTextNode(''), 'assignedSlot must be defined on a text node');
21 assert_false('assignedSlot' in document.createComment(''), 'assignedSlot must not be defined on a comment node');
22 assert_false('assignedSlot' in document.createProcessingInstruction('target', 'data'), 'assignedSlot must not be defined on a processing instruction node');
23
24}, 'assignedSlot attribute must be defined on Element and Text interfaces');
25
26test(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 slot = document.createElement('slot');
41 slot.name = 'foo';
42 shadowRoot.appendChild(slot);
43 assert_equals(childElement.assignedSlot, null, 'assignedSlot on an element must be null when a node does not match any slot');
44 assert_equals(childTextNode.assignedSlot, null, 'assignedSlot on a text node must be null when a node does not match any slot');
45
46}, 'assignedSlot must return null when the node does not have an assigned node');
47
48test(function () {
49 var shadowHost = document.createElement('div');
50 var childElement = document.createElement('b');
51 shadowHost.appendChild(childElement);
52
53 var childTextNode = document.createTextNode('');
54 shadowHost.appendChild(childTextNode);
55
56 var shadowRoot = shadowHost.attachShadow({mode: 'open'});
57 var slot = document.createElement('slot');
58 shadowRoot.appendChild(slot);
59
60 assert_equals(childElement.assignedSlot, slot, 'assignedSlot on an element must return the assigned default slot element');
61 assert_equals(childTextNode.assignedSlot, slot, 'assignedSlot on a text node must return the assigned default slot element');
62
63 slot.name = 'foo';
64 assert_equals(childElement.assignedSlot, null, 'assignedSlot on an element must null when the element is unassigned from a slot element');
65 assert_equals(childTextNode.assignedSlot, null, 'assignedSlot on a text node must null when the node is unassigned from a slot element');
66
67 childElement.slot = 'foo';
68 assert_equals(childElement.assignedSlot, slot, 'assignedSlot on an element must return the re-assigned slot element');
69
70 slot.removeAttribute('name');
71 assert_equals(childTextNode.assignedSlot, slot, 'assignedSlot on a text node must return the re-assigned slot element');
72
73}, 'assignedSlot must return the assigned slot');
74
75test(function () {
76 var shadowHost = document.createElement('div');
77 var childElement = document.createElement('b');
78 shadowHost.appendChild(childElement);
79
80 var childTextNode = document.createTextNode('');
81 shadowHost.appendChild(childTextNode);
82
83 var shadowRoot = shadowHost.attachShadow({mode: 'closed'});
84 var slot = document.createElement('slot');
85 shadowRoot.appendChild(slot);
86
87 assert_equals(childElement.assignedSlot, null, 'assignedSlot on an element must return null if the slot is inside a closed shadow tree.');
88 assert_equals(childTextNode.assignedSlot, null, 'assignedSlot on a text node must return null if the slot is inside a closed shadow tree.');
89
90}, 'assignedSlot must return null when the assigned slot element is inside a closed shadow tree');
91
92</script>
93</body>
94</html>