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
|
import {
_Base as Base,
BaseContent,
PrefsButton,
} from "content-src/components/Base/Base";
import { ASRouterAdmin } from "content-src/components/ASRouterAdmin/ASRouterAdmin";
import { ErrorBoundary } from "content-src/components/ErrorBoundary/ErrorBoundary";
import React from "react";
import { Search } from "content-src/components/Search/Search";
import { shallow } from "enzyme";
import { actionCreators as ac } from "common/Actions.sys.mjs";
describe("<Base>", () => {
let DEFAULT_PROPS = {
store: { getState: () => {} },
App: { initialized: true },
Prefs: { values: {} },
Sections: [],
DiscoveryStream: { config: { enabled: false } },
dispatch: () => {},
adminContent: {
message: {},
},
};
it("should render Base component", () => {
const wrapper = shallow(<Base {...DEFAULT_PROPS} />);
assert.ok(wrapper.exists());
});
it("should render the BaseContent component, passing through all props", () => {
const wrapper = shallow(<Base {...DEFAULT_PROPS} />);
const props = wrapper.find(BaseContent).props();
assert.deepEqual(
props,
DEFAULT_PROPS,
JSON.stringify([props, DEFAULT_PROPS], null, 3)
);
});
it("should render an ErrorBoundary with class base-content-fallback", () => {
const wrapper = shallow(<Base {...DEFAULT_PROPS} />);
assert.equal(
wrapper
.find(ErrorBoundary)
.first()
.prop("className"),
"base-content-fallback"
);
});
it("should render an ASRouterAdmin if the devtools pref is true", () => {
const wrapper = shallow(
<Base
{...DEFAULT_PROPS}
Prefs={{ values: { "asrouter.devtoolsEnabled": true } }}
/>
);
assert.lengthOf(wrapper.find(ASRouterAdmin), 1);
});
it("should not render an ASRouterAdmin if the devtools pref is false", () => {
const wrapper = shallow(
<Base
{...DEFAULT_PROPS}
Prefs={{ values: { "asrouter.devtoolsEnabled": false } }}
/>
);
assert.lengthOf(wrapper.find(ASRouterAdmin), 0);
});
});
describe("<BaseContent>", () => {
let DEFAULT_PROPS = {
store: { getState: () => {} },
App: { initialized: true },
Prefs: { values: {} },
Sections: [],
DiscoveryStream: { config: { enabled: false } },
dispatch: () => {},
};
it("should render an ErrorBoundary with a Search child", () => {
const searchEnabledProps = Object.assign({}, DEFAULT_PROPS, {
Prefs: { values: { showSearch: true } },
});
const wrapper = shallow(<BaseContent {...searchEnabledProps} />);
assert.isTrue(
wrapper
.find(Search)
.parent()
.is(ErrorBoundary)
);
});
it("should dispatch a user event when the customize menu is opened or closed", () => {
const dispatch = sinon.stub();
const wrapper = shallow(
<BaseContent {...DEFAULT_PROPS} dispatch={dispatch} />
);
wrapper.instance().openCustomizationMenu();
assert.calledWith(dispatch, ac.UserEvent({ event: "SHOW_PERSONALIZE" }));
wrapper.instance().closeCustomizationMenu();
assert.calledWith(dispatch, ac.UserEvent({ event: "HIDE_PERSONALIZE" }));
});
it("should render only search if no Sections are enabled", () => {
const onlySearchProps = Object.assign({}, DEFAULT_PROPS, {
Sections: [{ id: "highlights", enabled: false }],
Prefs: { values: { showSearch: true } },
});
const wrapper = shallow(<BaseContent {...onlySearchProps} />);
assert.lengthOf(wrapper.find(".only-search"), 1);
});
});
describe("<PrefsButton>", () => {
it("should render icon-settings if props.icon is empty", () => {
const wrapper = shallow(<PrefsButton icon="" />);
assert.isTrue(wrapper.find("button").hasClass("icon-settings"));
});
it("should render props.icon as a className", () => {
const wrapper = shallow(<PrefsButton icon="icon-happy" />);
assert.isTrue(wrapper.find("button").hasClass("icon-happy"));
});
});
|
