Я уже некоторое время работаю над этим тестом, и хотя я могу найти несколько решений в Интернете, я не могу найти ничего, что будет работать для меня. Я хочу проверить, обновляется ли отображаемый текст в поле ввода при использовании функции onChange
. Я не хочу проверять состояние напрямую.
У меня есть форма со следующим состоянием и функцией обработки изменений:
const [formState, setFormState] = useState({
createFirstName: '',
createLastName: '',
createEmail: '',
createJobTitle: '',
createWorkPhone: '',
createCellPhone: '',
createExtension: '',
});
const handleChange = event => {
const value = event.target.value;
setFormState({
...formState,
[event.target.name]: value
});
};
Пока довольно стандартно. У меня также есть форма со следующим полем ввода:
<input
name="createFirstName"
id="assign-role-form-first-name-input"
onChange={handleChange}
type="text"
ref={register({ required: true })}
defaultValue={""}
/>
Теперь я должен упомянуть, что я использую react-hook-form
, который помогает с проверками формы, хотя я не думаю, что это вызовет проблему.
Я пытаюсь написать тест, который вызывает изменение входного значения. Я пробовал много разных комбинаций вещей, таких как:
it('Should capture firstname correctly onChange', () => {
const wrapper = mount(<AssignRoleForm />);
const input = wrapper.find('#assign-role-form-first-name-input')
input.simulate('change', {target: {value: 'Goose'}});
expect(input.props()).toEqual('Goose')
})
или
it('Should capture firstname correctly onChange', () => {
const wrapper = mount(<AssignRoleForm />);
const input = wrapper.find('#assign-role-form-first-name-input')
input.simulate('change', {target: {name: 'createFirstName' value: 'Goose'}});
expect(input.prop('value')).toEqual('Goose')
})
Я также пытался установить опору, используя
input.prop('onChange')({target: {value: 'Goose'}})
Я пыталсяиспользуя act(() => {}
, а также другие комбинации вышеперечисленного. Я также попытался избавиться от defaultValue
в поле ввода и использовать вместо него value
, но это тоже не сработало. Я не уверен, что моя проблема в обновлении ввода или в том, как я вызываю ввод.