Как я могу получить доступ к form.elements в реакции / шутке / ферментном тесте при подключении - PullRequest
0 голосов
/ 01 апреля 2020

В моем компоненте реагирования у меня есть форма с реф. После нажатия кнопки «отправить», handleSubmitButtonClick выполняется и нормально работает в браузере.

const formRef = useRef(null);

const handleSubmitButtonClick = async function() {
  const form = formRef.current;
  form['clientNumber'].setCustomValidity('invalid');
};

return (
  <form className="needs-validation" ref={formRef} noValidate>
    // ...
    <input type="text" name="clientNumber" id="clientNumber" value="">
    <button type="button" onClick={handleSubmitButtonClick}>Submit</button>
  </form>
);

При написании теста (jest / энзим / jsdom) и нажатии кнопки вызывается метод как и ожидалось, но я получаю сообщение об ошибке.

test('should do something...', async () => {
  const wrapper = mount(<MyComponent />);
  const submitButton = wrapper.find('button').filterWhere((b) => b.text() === 'Submit');
  submitButton.simulate('click');
  // ...
  });
TypeError: Cannot read property 'setCustomValidity' of undefined
    > 1495 | form['clientNumber'].setCustomValidity('invalid');

Когда я отлаживаю в браузере форму и смотрю на коллекцию элементов, я вижу элементы в массиве, как и ожидалось:

enter image description here

При отладке теста form.elements отображается как «Прокси»:

enter image description here

Я не уверен, почему коллекция form.elements недоступна в тесте. Любая помощь будет оценена

...