99 lines
2.6 KiB
JavaScript
99 lines
2.6 KiB
JavaScript
import React from 'react'
|
|
import { RadioInputField } from '../../../src/components/Common/RadioInputField'
|
|
import renderer from 'react-test-renderer'
|
|
import Adapter from 'enzyme-adapter-react-15'
|
|
import { configure, mount } from 'enzyme'
|
|
|
|
configure({ adapter: new Adapter() })
|
|
|
|
test('Should render the component', () => {
|
|
const component = renderer.create(
|
|
<RadioInputField
|
|
title="Some Title"
|
|
items={[{ label: 'Item 1', value: 'item-1' }, { label: 'Item 2', value: 'item-2' }]}
|
|
selectedItem="item-1"
|
|
onChange={() => {}}
|
|
description="Some Description"
|
|
/>
|
|
)
|
|
|
|
let tree = component.toJSON()
|
|
expect(tree).toMatchSnapshot()
|
|
})
|
|
|
|
test('Should render two inputs and check the first one', () => {
|
|
const wrapper = mount(
|
|
<RadioInputField
|
|
title="Some Title"
|
|
items={[{ label: 'Item 1', value: 'item-1' }, { label: 'Item 2', value: 'item-2' }]}
|
|
selectedItem="item-1"
|
|
onChange={() => {}}
|
|
description="Some Description"
|
|
/>
|
|
)
|
|
|
|
const inputs = wrapper.find('input[type="radio"]')
|
|
expect(inputs.length).toBe(2)
|
|
|
|
const firstInput = inputs.at(0)
|
|
const secondInput = inputs.at(1)
|
|
|
|
expect(firstInput.prop('checked')).toBe(true)
|
|
expect(secondInput.prop('checked')).toBe(false)
|
|
})
|
|
|
|
test('The onChange callback is called when an item is selected', () => {
|
|
const onChangeCallback = jest.fn()
|
|
|
|
const wrapper = mount(
|
|
<RadioInputField
|
|
title="Some Title"
|
|
items={[{ label: 'Item 1', value: 'item-1' }, { label: 'Item 2', value: 'item-2' }]}
|
|
selectedItem="item-1"
|
|
onChange={onChangeCallback}
|
|
description="Some Description"
|
|
/>
|
|
)
|
|
|
|
wrapper
|
|
.find('input[type="radio"]')
|
|
.at(1)
|
|
.simulate('change')
|
|
|
|
expect(onChangeCallback).toBeCalled()
|
|
})
|
|
|
|
test('Should change the selected item when `selectedItem` changes', () => {
|
|
const onChangeCallback = jest.fn()
|
|
|
|
const wrapper = mount(
|
|
<RadioInputField
|
|
title="Some Title"
|
|
items={[{ label: 'Item 1', value: 'item-1' }, { label: 'Item 2', value: 'item-2' }]}
|
|
selectedItem="item-1"
|
|
onChange={onChangeCallback}
|
|
description="Some Description"
|
|
/>
|
|
)
|
|
|
|
let inputs = wrapper.find('input[type="radio"]')
|
|
expect(inputs.length).toBe(2)
|
|
|
|
let firstInput = inputs.at(0)
|
|
let secondInput = inputs.at(1)
|
|
|
|
expect(firstInput.prop('checked')).toBe(true)
|
|
expect(secondInput.prop('checked')).toBe(false)
|
|
|
|
wrapper.setProps({ selectedItem: 'item-2' })
|
|
|
|
inputs = wrapper.find('input[type="radio"]')
|
|
expect(inputs.length).toBe(2)
|
|
|
|
firstInput = inputs.at(0)
|
|
secondInput = inputs.at(1)
|
|
|
|
expect(firstInput.prop('checked')).toBe(false)
|
|
expect(secondInput.prop('checked')).toBe(true)
|
|
})
|