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
|
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at <http://mozilla.org/MPL/2.0/>. */
// @flow
import React from "react";
import { mount, shallow } from "enzyme";
import ManagedTree from "../ManagedTree";
function getTestContent() {
const testTree = {
a: {
value: "FOO",
children: [
{ value: 1 },
{ value: 2 },
{ value: 3 },
{ value: 4 },
{ value: 5 },
],
},
b: {
value: "BAR",
children: [
{ value: "A" },
{ value: "B" },
{ value: "C" },
{ value: "D" },
{ value: "E" },
],
},
c: { value: "BAZ" },
};
const renderItem = item => <div>{item.value ? item.value : item}</div>;
const onFocus = jest.fn();
const onExpand = jest.fn();
const onCollapse = jest.fn();
const getPath = (item, i) => {
if (item.value) {
return item.value;
}
if (i) {
return `${i}`;
}
return `${item}-$`;
};
return {
testTree,
props: {
getRoots: () => Object.keys(testTree),
getParent: item => null,
getChildren: branch => branch.children || [],
itemHeight: 24,
autoExpandAll: true,
autoExpandDepth: 1,
getPath,
renderItem,
onFocus,
onExpand,
onCollapse,
},
};
}
describe("ManagedTree", () => {
it("render", () =>
expect(
shallow(<ManagedTree {...getTestContent().props} />)
).toMatchSnapshot());
it("expands list items", () => {
const { props, testTree } = getTestContent();
const wrapper = shallow(<ManagedTree {...props} />);
wrapper.setProps({
listItems: testTree.b.children,
});
expect(wrapper).toMatchSnapshot();
});
it("highlights list items", () => {
const { props, testTree } = getTestContent();
const wrapper = shallow(<ManagedTree {...props} />);
wrapper.setProps({
highlightItems: testTree.a.children,
});
expect(wrapper).toMatchSnapshot();
});
it("sets expanded items", () => {
const { props, testTree } = getTestContent();
const wrapper = mount(<ManagedTree {...props} />);
expect(wrapper).toMatchSnapshot();
// We auto-expanded the first layer, so unexpand first node.
wrapper
.find("TreeNode")
.first()
.simulate("click");
expect(wrapper).toMatchSnapshot();
expect(props.onExpand).toHaveBeenCalledWith(
"c",
new Set(
Object.keys(testTree)
.filter(i => i !== "a")
.map(k => `${k}-$`)
)
);
wrapper
.find("TreeNode")
.first()
.simulate("click");
expect(props.onExpand).toHaveBeenCalledWith(
"c",
new Set(Object.keys(testTree).map(k => `${k}-$`))
);
});
});
|
