/
input.test.jsx
56 lines (46 loc) · 1.79 KB
/
input.test.jsx
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
import React from 'react';
import {mount, shallow} from 'enzyme';
import Input from './index';
import InputError from '../InputError';
jest.mock('uuid', () => ({ v4: () => 1 }));
describe('Input component', () => {
test('Matches the snapshot', () => {
const wrapper = shallow(<Input>Input</Input>);
expect(wrapper).toMatchSnapshot();
});
test('Renders label if added', () => {
const wrapper = shallow(<Input label="Label" />);
expect(wrapper.find('label').exists()).toEqual(true);
});
test('Adds optional classes to wrapper', () => {
const wrapper = shallow(<Input negative error />);
expect(wrapper.find('.ssb-input').hasClass('negative')).toEqual(true);
expect(wrapper.find('.ssb-input').hasClass('error')).toEqual(true);
});
test('Type is customizable', () => {
const wrapper = mount(<Input type="email" />);
expect(wrapper.find('input').props().type).toEqual('email');
});
test('Searchable input renders search icon', () => {
const wrapper = shallow(<Input ariaLabel="Input field Search" searchField placeholder="Search text" />);
expect(wrapper.find('button').hasClass('search-icon')).toEqual(true);
});
test('handleInputChange', () => {
const handleChange = jest.fn();
const wrapper = shallow(<Input handleChange={handleChange} />);
wrapper.find('input').simulate('change', {
target: { value: 'hello' }
});
expect(handleChange).toBeCalledWith('hello');
});
test('handle submit', () => {
const handleSubmit = jest.fn();
const wrapper = shallow(<Input searchField submitCallback={handleSubmit} />);
wrapper.find('.icon-wrapper').simulate('click');
expect(handleSubmit).toBeCalled();
});
test('Renders an error message on error', () => {
const wrapper = shallow(<Input error errorMessage="An error" />);
expect(wrapper.find(InputError)).toHaveLength(1);
})
});