библиотека реагирования-тестирования не отображает правильные снимки - PullRequest
Новая
       1

библиотека реагирования-тестирования не отображает правильные снимки

1 голос
/ 17 июня 2019

Я пытаюсь проверить компонент на моментальный снимок. Компонент отображает флажок с событием onChange, и его проверенное состояние связано с состоянием компонента, для которого установлено значение true.

Когда снимок отображается, он не отображает onChange вообще, а отмеченный элемент отображается в виде пустой строки.

Результат, который я хочу получить: onChange = {[Функция]} проверено = {true}.

Я проверил, используя рендеринг-теста-рендеринга и Фермент, и оба правильно вывели снимок.

ФАЙЛ КОМПОНЕНТА 

import React, { useState } from "react";
import "./App.css";

function App() {
    const [count, setCount] = useState(true);

    return (
        <div className="App">
            <input type="checkbox" checked={count} onChange={() => {}} />
        </div>
    );
}

export default App;

ИСПЫТАТЕЛЬНЫЙ ФАЙЛ 

import React from "react";
import App from "./App";
import { render } from "@testing-library/react";

it("renders", () => {
    const { asFragment } = render(<App />);

    expect(asFragment()).toMatchSnapshot();
});

SNAPSHOT FILE 

exports[renders 1] =
<DocumentFragment>
  <div
    class="App"
  >
    <input
      checked=""
      type="checkbox"
    />
  </div>
</DocumentFragment>;

ожидаемый снимок: 

exports[renders 1] = 
<DocumentFragment>
  <div
    class="App"
  >
    <input
      checked={true}
      type="checkbox"
      onChange={[Function]}
    />
  </div>
</DocumentFragment>;

1 Ответ

0 голосов
/ 17 июня 2019

RTL работает как задумано. Метод render возвращает вам только DOM компонента, который вы отображаете. В DOM обработчики действий и состояние моментального снимка отсутствуют.

Вместо того, чтобы делать снимок, лучший способ протестировать ваш компонент - проверить эти значения напрямую.

...