summaryrefslogtreecommitdiffstats
path: root/layout/inspector/tests/test_bug609549-shadow.xhtml
blob: 230886e39dee315b8fe434be902116d70a316693 (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
<html xmlns="http://www.w3.org/1999/xhtml">
<!--
https://bugzilla.mozilla.org/show_bug.cgi?id=609549
-->
<head>
  <title>Test for Bug 609549</title>
  <script src="/tests/SimpleTest/SimpleTest.js"></script>
  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
</head>

<body>
<!-- No linebreaks since this is html and whitespace is preserved. -->
<template id="template"><div anonid="box-A">x</div><div anonid="box-B"><slot name="name-span"/></div><div anonid="box-C">x</div><slot/></template>
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=609549">Mozilla Bug 609549</a>

<custom-element id="bound"><p id="p">lorem ipsum dolor sit amet</p><span id="sandwiched" slot="name-span">sandwiched</span></custom-element>

<div id="content" style="display: none">
  
</div>
<pre id="test">
<script>
<![CDATA[

/** Test for Bug 609549 **/
SimpleTest.waitForExplicitFinish();

customElements.define("custom-element", class extends HTMLElement {
  constructor() {
    super();
    const template = document.getElementById("template");
    const shadowRoot = this.attachShadow({mode: "open"})
      .appendChild(template.content.cloneNode(true));
  }
});

const InspectorUtils = SpecialPowers.InspectorUtils;

addLoadEvent(function() {
  ok("getChildrenForNode" in InspectorUtils, "InspectorUtils has no getChildrenForNode");
  var withoutAnons =
    InspectorUtils.getChildrenForNode($("bound"), false, false);

  is(withoutAnons.length, $("bound").childNodes.length,
     "withoutAnons should be the same length as childNodes");
  is(SpecialPowers.unwrap(withoutAnons[0]), $("p"), "didn't get paragraph - without anons");
  is(SpecialPowers.unwrap(withoutAnons[1]), $("sandwiched"),
     "didn't get sandwiched span - without anons");

  var withAnons = InspectorUtils.getChildrenForNode($("bound"), true, false);
  is(withAnons.length, 3, "bad withAnons.length");
  ok(SpecialPowers.unwrap(withAnons[0]) instanceof ShadowRoot, "First one is shadow");
  is(SpecialPowers.unwrap(withAnons[1]), $("p"), "didn't get paragraph - without anons");
  is(SpecialPowers.unwrap(withAnons[2]), $("sandwiched"),
     "didn't get sandwiched span - without anons");

  withAnons = InspectorUtils.getChildrenForNode(withAnons[0], true, false);
  is(withAnons.length, 4, "bad withAnons.length");
  is(withAnons[0].getAttribute("anonid"), "box-A",
     "didn't get anonymous box-A");
  is(withAnons[1].getAttribute("anonid"), "box-B",
     "didn't get anonymous box-B");
  is(withAnons[2].getAttribute("anonid"), "box-C",
     "didn't get anonymous box-C");
  is(withAnons[3].assignedNodes()[0].id, "p", "didn't get paragraph - with anons");

  var bKids = InspectorUtils.getChildrenForNode(withAnons[1], true, false)[0].assignedNodes();
  is(bKids.length, 1, "bKids.length is bad");
  is(SpecialPowers.unwrap(bKids[0]), $("sandwiched"),
     "didn't get sandwiched span inserted into box-B");

  SimpleTest.finish();
});

]]>
</script>
</pre>
</body>
</html>