тест изменения входных данных в реагирующей на тестирование библиотеке всегда проходит - PullRequest
0 голосов
/ 19 апреля 2020

Я заметил, что если я сломал форму, жестко закодировав значение в поле ввода и не имея никакого onChange - мои тесты все еще проходили!

Я тоже попытался использовать userEvent, но тест все еще проходит нормально. Что я здесь не так делаю? Я явно не могу изменить значение в браузере, оно привязано к жестко заданному значению.

Я также создал песочницу, показывающую проблему: https://codesandbox.io/s/dank-wave-hlsfp

Реагирующий компонент:

import React from "react";

const RegisterFormExample = () => (
  <form>
    <label htmlFor="name">Full name</label>
    <input type="name" id="name" value="this does not break a test" />
  </form>
);

export default RegisterFormExample;

Шутник:

import React from "react";
import { render, fireEvent } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import RegisterForm from "components/RegisterFormExample";

describe("RegisterForm", () => {
  test("full name input", async () => {
    const { getByLabelText } = render(<RegisterForm />);
    const input = getByLabelText(/full name/i);
    //This passes
    fireEvent.change(input, {
      target: {
        value: "Test Example",
      },
    });
    expect(input).toHaveValue("Test Example");

    //This is passing too
    await userEvent.type(input, "Test Example");
    expect(input).toHaveValue("Test Example");
  });
});

1 Ответ

0 голосов
/ 20 апреля 2020

Я получил ответ на мой вопрос Github здесь от eps1lon. Оказывается, что установка неправильного типа в поле ввода может испортить тест и заставить его пройти, никогда бы не догадался об этом.

Если задать тип text вместо name, тест завершится неудачно, так как ожидается.

<input type="text" id="name" value="test" />
...