/
AggregateSearchModal-test.js
111 lines (95 loc) · 3.75 KB
/
AggregateSearchModal-test.js
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
jest.disableAutomock()
import React from 'react'
import TestUtils from 'react-addons-test-utils'
import AggregateSearchModal from '../'
var findByClass = TestUtils.findRenderedDOMComponentWithClass
var scryByClass = TestUtils.scryRenderedDOMComponentsWithClass
var searchModal
var element
describe('AggregateSearchModal', function () {
beforeEach(function () {
searchModal = <AggregateSearchModal autoFocus={false} />
element = TestUtils.renderIntoDocument(searchModal)
})
it('renders a modal overlay', function () {
var overlayElement = findByClass(element, 'Overlay')
expect(overlayElement).toBeDefined()
})
it('renders a loading state while fetching results', function () {
element.setState({ isSearching: true, results: true })
findByClass(element, 'AggregateSearchModal__footer--loading')
})
it('renders an empty state if no results can be found', function () {
element.setState({ isSearching: false, results: {} })
findByClass(element, 'AggregateSearchModal__footer--empty')
})
it('renders all filters by default', function () {
element.setState({ results: { foo: 'bar' }, isSearching: false })
expect(scryByClass(element, 'AggregateSearchModal__filters__type').length).toBe(3)
})
it('selects a filter when a filter selection button is clicked', function () {
element.setState({ results: { foo: 'bar' }, isSearching: false })
var filterElements = scryByClass(element, 'AggregateSearchModal__filters__type')
expect(element.state.filter).toEqual('all')
TestUtils.Simulate.click(filterElements[1])
expect(element.state.filter).toEqual('charities')
TestUtils.Simulate.click(filterElements[0])
expect(element.state.filter).toEqual('pages')
})
})
describe('Selecting results', function () {
it('renders selectable results', function () {
var onSelect = jest.fn(() => {})
var element = TestUtils.renderIntoDocument(
<AggregateSearchModal
autoFocus={false}
onSelect={onSelect}
onClose={function () {}}
/>
)
element.setState({
results: [
{
_type: 'page',
name: 'Foo',
supporter: {},
image: {},
campaign: { uid: 'au-123' },
charity: {}
}
]
})
var result = findByClass(element, 'AggregateSearchResult')
TestUtils.Simulate.click(result)
expect(onSelect.mock.calls.length).toBe(1)
})
})
describe('AggregateSearchModal with searchType prop set', function () {
var filterElements
beforeEach(function () {
searchModal = <AggregateSearchModal autoFocus={false} searchType='campaigns' />
element = TestUtils.renderIntoDocument(searchModal)
element.setState({ results: { foo: 'bar' }, isSearching: false })
filterElements = scryByClass(element, 'AggregateSearchModal__filters__type')
})
it('renders a single filter based on the `searchType` prop', function () {
expect(filterElements.length).toBe(1)
expect(filterElements[0].textContent).toContain('Events')
})
it('the filter selection button is disabled (has no onclick behaviour)', function () {
expect(element.state.filter).toEqual('campaigns')
TestUtils.Simulate.click(filterElements[0])
expect(element.state.filter).toEqual('campaigns')
})
})
describe('AggregateSearchModal with custom onSelect function prop', function () {
it('will call the provided custom function and close the modal', function () {
var mockSelect = jest.fn(() => {})
var mockClose = jest.fn(() => {})
searchModal = <AggregateSearchModal autoFocus={false} onSelect={mockSelect} onClose={mockClose} />
var component = TestUtils.renderIntoDocument(searchModal)
component.handleSelect()
expect(mockSelect.mock.calls.length).toBe(1)
expect(mockClose.mock.calls.length).toBe(1)
})
})