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
|
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if the abstract tree base class for the profiler's tree view
* works as advertised.
*/
let { AbstractTreeItem } = Cu.import("resource:///modules/devtools/AbstractTreeItem.jsm", {});
let { Heritage } = Cu.import("resource:///modules/devtools/ViewHelpers.jsm", {});
function spawnTest () {
let container = document.createElement("vbox");
gBrowser.selectedBrowser.parentNode.appendChild(container);
// Populate the tree and test the root item...
let treeRoot = new MyCustomTreeItem(gDataSrc, { parent: null });
treeRoot.attachTo(container);
is(container.childNodes.length, 1,
"The container node should have one child available.");
is(container.childNodes[0], treeRoot.target,
"The root node's target is a child of the container node.");
is(treeRoot.root, treeRoot,
"The root node has the correct root.");
is(treeRoot.parent, null,
"The root node has the correct parent.");
is(treeRoot.level, 0,
"The root node has the correct level.");
is(treeRoot.target.MozMarginStart, "0px",
"The root node's indentation is correct.");
is(treeRoot.target.textContent, "root",
"The root node's text contents are correct.");
is(treeRoot.container, container,
"The root node's container is correct.");
// Expand the root and test the child items...
let receivedExpandEvent = treeRoot.once("expand");
EventUtils.sendMouseEvent({ type: "mousedown" }, treeRoot.target.querySelector(".arrow"));
let eventItem = yield receivedExpandEvent;
is(eventItem, treeRoot,
"The 'expand' event target is correct.");
is(document.commandDispatcher.focusedElement, treeRoot.target,
"The root node is now focused.");
let fooItem = treeRoot.getChild(0);
let barItem = treeRoot.getChild(1);
is(container.childNodes.length, 3,
"The container node should now have three children available.");
is(container.childNodes[0], treeRoot.target,
"The root node's target is a child of the container node.");
is(container.childNodes[1], fooItem.target,
"The 'foo' node's target is a child of the container node.");
is(container.childNodes[2], barItem.target,
"The 'bar' node's target is a child of the container node.");
is(fooItem.root, treeRoot,
"The 'foo' node has the correct root.");
is(fooItem.parent, treeRoot,
"The 'foo' node has the correct parent.");
is(fooItem.level, 1,
"The 'foo' node has the correct level.");
is(fooItem.target.MozMarginStart, "10px",
"The 'foo' node's indentation is correct.");
is(fooItem.target.textContent, "foo",
"The 'foo' node's text contents are correct.");
is(fooItem.container, container,
"The 'foo' node's container is correct.");
is(barItem.root, treeRoot,
"The 'bar' node has the correct root.");
is(barItem.parent, treeRoot,
"The 'bar' node has the correct parent.");
is(barItem.level, 1,
"The 'bar' node has the correct level.");
is(barItem.target.MozMarginStart, "10px",
"The 'bar' node's indentation is correct.");
is(barItem.target.textContent, "bar",
"The 'bar' node's text contents are correct.");
is(barItem.container, container,
"The 'bar' node's container is correct.");
// Test other events on the child nodes...
let receivedFocusEvent = treeRoot.once("focus");
EventUtils.sendMouseEvent({ type: "mousedown" }, fooItem.target);
eventItem = yield receivedFocusEvent;
is(eventItem, fooItem,
"The 'focus' event target is correct.");
is(document.commandDispatcher.focusedElement, fooItem.target,
"The 'foo' node is now focused.");
let receivedDblClickEvent = treeRoot.once("focus");
EventUtils.sendMouseEvent({ type: "dblclick" }, barItem.target);
eventItem = yield receivedDblClickEvent;
is(eventItem, barItem,
"The 'dblclick' event target is correct.");
is(document.commandDispatcher.focusedElement, barItem.target,
"The 'bar' node is now focused.");
// A child item got expanded, test the descendants...
let bazItem = barItem.getChild(0);
is(container.childNodes.length, 4,
"The container node should now have four children available.");
is(container.childNodes[0], treeRoot.target,
"The root node's target is a child of the container node.");
is(container.childNodes[1], fooItem.target,
"The 'foo' node's target is a child of the container node.");
is(container.childNodes[2], barItem.target,
"The 'bar' node's target is a child of the container node.");
is(container.childNodes[3], bazItem.target,
"The 'baz' node's target is a child of the container node.");
is(bazItem.root, treeRoot,
"The 'baz' node has the correct root.");
is(bazItem.parent, barItem,
"The 'baz' node has the correct parent.");
is(bazItem.level, 2,
"The 'baz' node has the correct level.");
is(bazItem.target.MozMarginStart, "20px",
"The 'baz' node's indentation is correct.");
is(bazItem.target.textContent, "baz",
"The 'baz' node's text contents are correct.");
is(bazItem.container, container,
"The 'baz' node's container is correct.");
container.remove();
finish();
}
function MyCustomTreeItem(dataSrc, properties) {
AbstractTreeItem.call(this, properties);
this.itemDataSrc = dataSrc;
}
MyCustomTreeItem.prototype = Heritage.extend(AbstractTreeItem.prototype, {
_displaySelf: function(document, arrowNode) {
let node = document.createElement("hbox");
node.MozMarginStart = (this.level * 10) + "px";
node.appendChild(arrowNode);
node.appendChild(document.createTextNode(this.itemDataSrc.label));
return node;
},
_populateSelf: function(children) {
for (let childDataSrc of this.itemDataSrc.children) {
children.push(new MyCustomTreeItem(childDataSrc, {
parent: this,
level: this.level + 1
}));
}
}
});
let gDataSrc = {
label: "root",
children: [{
label: "foo",
children: []
}, {
label: "bar",
children: [{
label: "baz",
children: []
}]
}]
};
|
