Не удается прочитать свойство 'URL' с нулевым значением в форме отправки с Formik - PullRequest
Новая
       78

Не удается прочитать свойство 'URL' с нулевым значением в форме отправки с Formik

0 голосов
/ 21 ноября 2019

Я пытаюсь протестировать свой компонент формы входа в ReactJS, используя Jest и Enzyme. Я использую Formik для обработки формы. Я хочу проверить, появляется ли компонент ошибки с компонентом Input, если значение поля input пусто и нажата кнопка Login. Ниже приведен код, который я выполнил в тесте: 

it("Should give error on email and password when login clicked", async () => {
  const store = getOrCreateStore();
  const wrap = mount(
    <Provider store={store}>
      <LoginPage />
    </Provider>
  );

  const form = wrap.find(".auth-board").find("form");
  const formBody = form.find(".form-body");

  const emailField = formBody.find(".form-group").at(0);
  const emailError = emailField.find(".error-validate");
  const passwordField = formBody.find(".form-group").at(1);
  const passwordError = passwordField.find("div").find(".error-validate");

  expect(emailError.length).toBe(0);
  expect(passwordError.length).toBe(0);

  form.simulate("submit");

  await setTimeout(async () => {
    wrap.update();
    await wrap.instance().forceUpdate();
    const wrapAfter = wrap.update();

    const formAfter = wrapAfter.find(".auth-board").find("form");
    const formBodyAfter = formAfter.find(".form-body");

    const emailFieldAfter = formBodyAfter.find(".form-group").at(0);
    const emailErrorAfter = emailFieldAfter.find(".error-validate");
    const passwordFieldAfter = formBodyAfter.find(".form-group").at(1);
    const passwordErrorAfter = passwordFieldAfter.find("div").find(".error-validate");

    expect(emailErrorAfter.length).toBe(1);
    expect(passwordErrorAfter.length).toBe(1);

    wrap.unmount();
    wrapAfter.unmount();
  }, 0);
});

Когда я запускаю тест, я получаю исключение: 

(node:19268) UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'URL' of null
at new XMLHttpRequest (/home/fawad-khalil/Documents/project/lunchon-web/node_modules/jsdom/lib/jsdom/living/xmlhttprequest.js:112:42)
at dispatchXhrRequest (/home/fawad-khalil/Documents/project/lunchon-web/node_modules/axios/lib/adapters/xhr.js:19:19)
at new Promise (<anonymous>)
at xhrAdapter (/home/fawad-khalil/Documents/project/lunchon-web/node_modules/axios/lib/adapters/xhr.js:11:10)
at dispatchRequest (/home/fawad-khalil/Documents/project/lunchon-web/node_modules/axios/lib/core/dispatchRequest.js:59:10)
at process._tickCallback (internal/process/next_tick.js:68:7)
(node:19268) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 4)
(node:19268) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

После небольшой игры с тестомкод, я пришел к выводу, что исключение происходит из-за оператора form.simulate("submit");, и оно не происходит, если этого оператора нет. Теперь, если событие submit имитируется, возникает исключение, и последние 2 expect операторы не выполняются, и сообщается, что тест пройден в консоли. Кто-нибудь знает, как справиться с этим поведением?

...