slots-text-nodes.html | Explore in Territory

<!DOCTYPE html>
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
<script src="resources/shadow-dom.js"></script>
<div id="host">
  <template data-mode="open">
    <div id="shadow_child1"></div>
    <slot id="default_slot"></slot>
    <slot id="slot1" name="slot1"></slot>
    <div id="shadow_child2"></div>
  </template>
  <div id="child1" slot="slot1"></div>
  Hello
  <div id="child2"></div>
  World
  <div id="child3" slot="nonexistent"></div>
  <!-- comment node  -->
</div>
<script>
'use strict';

let n = createTestTree(host);
removeWhiteSpaceOnlyTextNodes(n.host);

let textHello = n.host.childNodes[1];
let textWorld = n.host.childNodes[3];
let commentNode = n.child3.nextSibling;

test(() => {
  assert_equals(textHello.nodeValue.trim(), 'Hello');
  assert_equals(textWorld.nodeValue.trim(), 'World');
  assert_equals(commentNode.nodeType, Node.COMMENT_NODE);

  assert_equals(textHello.assignedSlot, n.default_slot);
  assert_equals(textWorld.assignedSlot, n.default_slot);
  assert_equals(commentNode.assignedSlot, undefined, "Comment Node does not define assignedSlot");
  assert_equals(n.child1.assignedSlot, n.slot1);
  assert_equals(n.child2.assignedSlot, n.default_slot);
  assert_equals(n.child3.assignedSlot, null);
}, "assignedSlot");

test(() => {
  assert_array_equals(n.default_slot.assignedNodes({flatten: true}), [textHello, n.child2, textWorld]);
  assert_array_equals(n.slot1.assignedNodes({flatten: true}), [n.child1]);
}, "assignedNodes");
</script>
chromium/third_party/blink/web_tests/shadow-dom/slots-text-nodes.html
