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
|
import { actionCreators as ac } from "common/Actions.sys.mjs";
import { ContentSection } from "content-src/components/CustomizeMenu/ContentSection/ContentSection";
import { mount } from "enzyme";
import React from "react";
const DEFAULT_PROPS = {
enabledSections: {
pocketEnabled: true,
topSitesEnabled: true,
},
mayHaveSponsoredTopSites: true,
mayHaveSponsoredStories: true,
pocketRegion: true,
dispatch: sinon.stub(),
setPref: sinon.stub(),
};
describe("ContentSection", () => {
let wrapper;
beforeEach(() => {
wrapper = mount(<ContentSection {...DEFAULT_PROPS} />);
});
it("should render the component", () => {
assert.ok(wrapper.exists());
});
it("should look for an eventSource attribute and dispatch an event for INPUT", () => {
wrapper.instance().onPreferenceSelect({
target: {
nodeName: "INPUT",
checked: true,
getAttribute: eventSource =>
eventSource === "eventSource" ? "foo" : null,
},
});
assert.calledWith(
DEFAULT_PROPS.dispatch,
ac.UserEvent({
event: "PREF_CHANGED",
source: "foo",
value: { status: true, menu_source: "CUSTOMIZE_MENU" },
})
);
wrapper.unmount();
});
it("should have eventSource attributes on relevent pref changing inputs", () => {
wrapper = mount(<ContentSection {...DEFAULT_PROPS} />);
assert.equal(
wrapper.find("#shortcuts-toggle").prop("eventSource"),
"TOP_SITES"
);
assert.equal(
wrapper.find("#sponsored-shortcuts").prop("eventSource"),
"SPONSORED_TOP_SITES"
);
assert.equal(
wrapper.find("#pocket-toggle").prop("eventSource"),
"TOP_STORIES"
);
assert.equal(
wrapper.find("#sponsored-pocket").prop("eventSource"),
"POCKET_SPOCS"
);
assert.equal(
wrapper.find("#highlights-toggle").prop("eventSource"),
"HIGHLIGHTS"
);
});
});
|
