summaryrefslogtreecommitdiffstats
path: root/layout/inspector/tests/test_bug522601-shadow.xhtml
blob: d790527791c787b77a8c9c629171ffd2046911f4 (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
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
<html xmlns="http://www.w3.org/1999/xhtml">
<!--
https://bugzilla.mozilla.org/show_bug.cgi?id=522601
-->
<head>
  <title>Test for Bug 522601</title>
  <script src="/tests/SimpleTest/SimpleTest.js"></script>
  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
</head>
<body>
<template id="template"><div><slot/></div><slot name="foo"/></template>
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=522601">Mozilla Bug 522601</a>
<custom-element id="display">
  <span slot="foo" id="s">This is some text</span>
  More text
  <b id="b">Even more <i id="i1">Italic</i>text<i id="i2">And more italic</i></b></custom-element>
<div id="content" style="display: none">
</div>
<div id="subdoc">
  <iframe id="frame1" src="file_bug522601.html">frame text</iframe>
</div>
<pre id="test">
<script>
<![CDATA[

/** Test for Bug 522601 **/
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));
  }
});

function testFunc(walker, func, expectedNode, str) {
  var oldCurrent = SpecialPowers.unwrap(walker.currentNode);
  var newNode = SpecialPowers.unwrap(walker[func]());
  is(newNode, expectedNode, "Unexpected node after " + str);
  is(SpecialPowers.unwrap(walker.currentNode), newNode ? newNode : oldCurrent,
     "Unexpected current node after " + str);
}

addLoadEvent(function() {
 var walkerSubDocument =
    SpecialPowers.Cc["@mozilla.org/inspector/deep-tree-walker;1"]
              .createInstance(SpecialPowers.Ci.inIDeepTreeWalker);
  walkerSubDocument.showAnonymousContent = false;
  walkerSubDocument.showSubDocuments = true;
  walkerSubDocument.init($("frame1"));

  is(SpecialPowers.unwrap(walkerSubDocument.currentNode), $("frame1"), "Unexpected sub-doc root");
  testFunc(walkerSubDocument, "firstChild", $("frame1").contentDocument.doctype,
           "step to sub documents doctype");
  testFunc(walkerSubDocument, "nextSibling", $("frame1").contentDocument.documentElement,
           "step to sub documents documentElement");

  walkerSubDocument =
    SpecialPowers.Cc["@mozilla.org/inspector/deep-tree-walker;1"]
              .createInstance(SpecialPowers.Ci.inIDeepTreeWalker);
  walkerSubDocument.showAnonymousContent = false;
  walkerSubDocument.showSubDocuments = true;
  walkerSubDocument.showDocumentsAsNodes = true;
  walkerSubDocument.init($("frame1"));

  is(SpecialPowers.unwrap(walkerSubDocument.currentNode), $("frame1"), "Unexpected sub-doc root");
  testFunc(walkerSubDocument, "firstChild", $("frame1").contentDocument,
           "step to sub document");
  testFunc(walkerSubDocument, "firstChild", $("frame1").contentDocument.doctype,
           "step to sub documents doctype");
  testFunc(walkerSubDocument, "nextSibling", $("frame1").contentDocument.documentElement,
           "step to sub documents documentElement");

  walkerSubDocument.currentNode = $("frame1").contentDocument;
  is(SpecialPowers.unwrap(walkerSubDocument.currentNode), $("frame1").contentDocument,
     "setting currentNode to sub document");
  testFunc(walkerSubDocument, "nextSibling", null,
           "nextSibling for sub document is null");

  var walkerFrameChild =
    SpecialPowers.Cc["@mozilla.org/inspector/deep-tree-walker;1"]
              .createInstance(SpecialPowers.Ci.inIDeepTreeWalker);
  walkerFrameChild.showAnonymousContent = false;
  walkerFrameChild.showSubDocuments = false;
  walkerFrameChild.init($("frame1"));

  is(SpecialPowers.unwrap(walkerFrameChild.currentNode), $("frame1"), "Unexpected sub-doc root");
  testFunc(walkerFrameChild, "firstChild", $("frame1").firstChild,
           "step to frames child");

  var walkerNonAnon =
    SpecialPowers.Cc["@mozilla.org/inspector/deep-tree-walker;1"]
              .createInstance(SpecialPowers.Ci.inIDeepTreeWalker);
  walkerNonAnon.init($("display"));
  walkerNonAnon.showAnonymousContent = false;

  is(SpecialPowers.unwrap(walkerNonAnon.currentNode), $("display"), "Unexpected non-anon root");
  testFunc(walkerNonAnon, "nextNode", $("s").previousSibling,
           "step to some text");
  testFunc(walkerNonAnon, "nextNode", $("s"), "step to span");
  testFunc(walkerNonAnon, "nextNode", $("s").firstChild, "step to span text");
  testFunc(walkerNonAnon, "nextNode", $("s").nextSibling, "step to more text");
  testFunc(walkerNonAnon, "nextNode", $("b"), "step to bold");
  testFunc(walkerNonAnon, "nextNode", $("b").firstChild, "step to bold text");
  testFunc(walkerNonAnon, "nextNode", $("i1"), "step to first italic");
  testFunc(walkerNonAnon, "nextNode", $("i1").firstChild,
           "step to first italic text");
  testFunc(walkerNonAnon, "nextNode", $("i1").nextSibling,
           "step to more bold text");
  testFunc(walkerNonAnon, "nextNode", $("i2"), "step to second italic");
  testFunc(walkerNonAnon, "nextNode", $("i2").firstChild,
           "step to second italic text");
  testFunc(walkerNonAnon, "nextNode", null, "step past end");
  testFunc(walkerNonAnon, "parentNode", $("i2"), "step up to second italic");
  testFunc(walkerNonAnon, "parentNode", $("b"), "step up to bold");
  testFunc(walkerNonAnon, "nextNode", $("b").firstChild, "step to bold text again");
  testFunc(walkerNonAnon, "parentNode", $("b"), "step up to bold again");
  testFunc(walkerNonAnon, "parentNode", $("display"), "step up to display");
  testFunc(walkerNonAnon, "parentNode", null, "step up past root");
  testFunc(walkerNonAnon, "firstChild", $("s").previousSibling,
           "step firstChild to display first child");
  testFunc(walkerNonAnon, "nextSibling", $("s"),
           "step nextSibling to span");
  testFunc(walkerNonAnon, "nextSibling", $("s").nextSibling,
           "step nextSibling to more text");
  testFunc(walkerNonAnon, "nextSibling", $("b"), "step nextSibling to bold");
  testFunc(walkerNonAnon, "nextSibling", null, "step nextSibling past end");
  testFunc(walkerNonAnon, "previousSibling", $("s").nextSibling,
           "step previousSibling to more text");
  testFunc(walkerNonAnon, "previousSibling", $("s"),
           "step previousSibling to span");
  testFunc(walkerNonAnon, "previousSibling", $("s").previousSibling,
           "step previousSibling to display first child");
  testFunc(walkerNonAnon, "previousSibling", null,
           "step previousSibling past end");

  // Move the walker over to the end
  while (walkerNonAnon.nextNode()) { /* do nothing */ }

  is(SpecialPowers.unwrap(walkerNonAnon.currentNode), $("i2").firstChild, "unexpected last node");
  testFunc(walkerNonAnon, "previousNode", $("i2"), "step back to second italic");
  testFunc(walkerNonAnon, "previousNode", $("i1").nextSibling,
           "step back to more bold text");
  testFunc(walkerNonAnon, "previousNode", $("i1").firstChild,
           "step back to first italic text");
  testFunc(walkerNonAnon, "previousNode", $("i1"), "step back to first italic");
  testFunc(walkerNonAnon, "previousNode", $("b").firstChild,
           "step back to bold text");
  testFunc(walkerNonAnon, "previousNode", $("b"), "step back to bold");
  testFunc(walkerNonAnon, "previousNode", $("s").nextSibling, "step back to more text");
  testFunc(walkerNonAnon, "previousNode", $("s").firstChild, "step back to span text");
  testFunc(walkerNonAnon, "previousNode", $("s"), "step back to span");
  testFunc(walkerNonAnon, "previousNode", $("s").previousSibling,
           "step back to some text");
  testFunc(walkerNonAnon, "previousNode", $("display"),
           "step back to root");
  testFunc(walkerNonAnon, "previousNode", null,
           "step back past root");

  walkerNonAnon.currentNode =  $("s");
  is(SpecialPowers.unwrap(walkerNonAnon.currentNode), SpecialPowers.unwrap($("s")), 
     "Setting currentNode to span");

  var anonDiv = $("display").shadowRoot.children[0];

  try {
    walkerNonAnon.currentNode = anonDiv;
    // See bug 1586916.
    todo(false, "Setting current node to a node that is otherwise unreachable," +
              " with the current visibility settings should throw");
  } catch(e) {
    ok(e.toString().indexOf("NS_ERROR_ILLEGAL_VALUE") > -1, "Setting current node to an anon node should throw" +
       " NS_ERROR_ILLEGAL_VALUE if showAnonymousContent is set to false");
    is(SpecialPowers.unwrap(walkerNonAnon.currentNode), SpecialPowers.unwrap($("s")), 
       "An unsuccessfull set currentNode should leave behind the old state");
    testFunc(walkerNonAnon, "nextSibling", $("s").nextSibling, "nextSibling after set currentNode");
  }

  var slot = $("display").shadowRoot.querySelectorAll("slot")[0];
  var namedSlot = $("display").shadowRoot.querySelectorAll("slot")[1];

  var walkerAnon =
    SpecialPowers.Cc["@mozilla.org/inspector/deep-tree-walker;1"]
              .createInstance(SpecialPowers.Ci.inIDeepTreeWalker);
  walkerAnon.showAnonymousContent = true;
  walkerAnon.init($("display"));

  is(SpecialPowers.unwrap(walkerAnon.currentNode), $("display"), "Unexpected anon root");
  testFunc(walkerAnon, "nextNode", $("display").shadowRoot,
           "step to shadow root");
  testFunc(walkerAnon, "nextNode", anonDiv,
           "step to anonymous div");
  testFunc(walkerAnon, "nextNode", slot, "step into slot");
  testFunc(walkerAnon, "nextNode", namedSlot, "step into named slot");
  testFunc(walkerAnon, "nextNode", $("s").previousSibling, "step to light dom text (out of shadow tree)");
  testFunc(walkerAnon, "nextNode", $("s"), "step to span (anon)");
  testFunc(walkerAnon, "nextNode", $("s").firstChild, "step to span text (anon)");
  testFunc(walkerAnon, "nextNode", $("s").nextSibling, "step to more text (anon)");
  testFunc(walkerAnon, "nextNode", $("b"), "step to bold (anon)");
  testFunc(walkerAnon, "nextNode", $("b").firstChild, "step to bold text (anon)");
  testFunc(walkerAnon, "nextNode", $("i1"), "step to first italic (anon)");
  testFunc(walkerAnon, "nextNode", $("i1").firstChild,
           "step to first italic text (anon)");
  testFunc(walkerAnon, "nextNode", $("i1").nextSibling,
           "step to more bold text (anon)");
  testFunc(walkerAnon, "nextNode", $("i2"), "step to second italic (anon)");
  testFunc(walkerAnon, "nextNode", $("i2").firstChild,
           "step to second italic text (anon)");
  testFunc(walkerAnon, "nextNode", null, "step past end (anon)");
  testFunc(walkerAnon, "parentNode", $("i2"), "step up to italic (anon)");
  testFunc(walkerAnon, "parentNode", $("b"), "step up to bold (anon)");
  testFunc(walkerAnon, "parentNode", $("display"), "step up to display (anon)");
  testFunc(walkerAnon, "nextNode", $("display").shadowRoot, "step to shadow root again");
  testFunc(walkerAnon, "parentNode", $("display"),
           "step up to display again (anon)")
  testFunc(walkerAnon, "parentNode", null, "step up past root (anon)");
  testFunc(walkerAnon, "firstChild", $("display").shadowRoot,
           "step firstChild to display first child (anon)");
  testFunc(walkerAnon, "nextSibling", $("s").previousSibling,
           "step nextSibling text (anon)");
  testFunc(walkerAnon, "nextSibling", $("s"),
           "step nextSibling span (anon)");
  testFunc(walkerAnon, "nextSibling", $("s").nextSibling,
           "step nextSibling more text (anon)");
  testFunc(walkerAnon, "nextSibling", $("b"),
           "step nextSibling bold (anon)");
  testFunc(walkerAnon, "nextSibling", null, "step nextSibling past end (anon)");
  testFunc(walkerAnon, "previousSibling", $("s").nextSibling,
           "step previousSibling to more text");
  testFunc(walkerAnon, "previousSibling", $("s"),
           "step previousSibling to span");
  testFunc(walkerAnon, "previousSibling", $("s").previousSibling,
           "step previousSibling to prev text");
  testFunc(walkerAnon, "previousSibling", $("display").shadowRoot,
           "step shadowRoot");
  testFunc(walkerAnon, "previousSibling", null, "step previousSibling past end (anon)");

  // Move the walker over to the end
  while (walkerAnon.nextNode()) { /* do nothing */ }

  testFunc(walkerAnon, "previousNode", $("i2"), "step back to second italic (anon)");
  testFunc(walkerAnon, "previousNode", $("i1").nextSibling,
           "step back to more bold text (anon)");
  testFunc(walkerAnon, "previousNode", $("i1").firstChild,
           "step back to first italic text (anon)");
  testFunc(walkerAnon, "previousNode", $("i1"), "step back to first italic (anon)");
  testFunc(walkerAnon, "previousNode", $("b").firstChild, "step back to bold text (anon)");
  testFunc(walkerAnon, "previousNode", $("b"), "step back to bold (anon)");
  testFunc(walkerAnon, "previousNode", $("s").nextSibling, "step back to more text (anon)");
  testFunc(walkerAnon, "previousNode", $("s").firstChild,
           "step back to span text (anon)");
  testFunc(walkerAnon, "previousNode", $("s"),
           "step back to span (anon)");
  testFunc(walkerAnon, "previousNode", $("s").previousSibling,
           "step back to some text (anon)");
  testFunc(walkerAnon, "previousNode", namedSlot, "step back to named slot");
  testFunc(walkerAnon, "previousNode", slot, "step back to slot");
  testFunc(walkerAnon, "previousNode", anonDiv,
           "step back to anonymous div");
  testFunc(walkerAnon, "previousNode", $("display").shadowRoot, "step back to shadow root (anon)");
  testFunc(walkerAnon, "previousNode", $("display"), "step back to root (anon)");
  testFunc(walkerAnon, "previousNode", null, "step back past root (anon)");

  SimpleTest.finish();
});

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