Тестирование функции проверки Formik с помощью React-Test-Renderer - PullRequest
0 голосов
/ 06 мая 2020

Я пытаюсь проверить свою функцию validate с помощью react-test-renderer через onChange и onBlur.

Вот упрощенный тест:

import renderer, { act } from 'react-test-renderer';

const byTypeAndName = (type, name) => elem =>
  elem.type === type && elem.props.name === name;

const onSubmit = jest.fn();
const onValidate = jest.fn();
const instance = renderer.create(
  <Formik
    onSubmit={onSubmit}
    initialValues={{
      password: '',
      password2: '',
    }}
    validate={onValidate}
  >
    <Form>
      <Field
        type="password"
        name="password"
        autoComplete="new-password"
        required
      />
      <ErrorMessage name="password" />
    </Form>
  </Formik>
).root;

await act(async () => {
  const password = instance.find(byTypeAndName('input', 'password'));
  password.props.onChange('123');
});

expect(onValidate).toBeCalled(); // fails

1 Ответ

0 голосов
/ 06 мая 2020

Оказывается, что onChange и onBlur требуют name элемента, переданного в качестве currentTarget.

Это работает правильно:

await act(async () => {
  const password = instance.find(byTypeAndName('input', 'password'));
  password.props.onChange({
    currentTarget: {
      // `name` is required else Formik doesn't run validation
      name: 'password',
      value: '123',
    },
  });
});
...