Модульное тестирование этого компонента отображается правильно - недопустимый вызов ловушки

Question

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

Следующий код не работает с сообщением об ошибке недопустимого вызова ловушки. «Неверный вызов ловушки. Перехватчики могут быть вызваны только внутри тела функционального компонента». Я не уверен, в чем может быть причина этой проблемы, я думал, что неправильно настроил свой тест.

import { shallow } from "enzyme";
import { Stopwatch } from "../../Components/Stopwatch";
import * as React from "react";
import {
  onAddClick,
  isEnabled,
  setAddButtonEnabled,
} from "../Fixtures/stopwatch";

test("renders without crashing", () => {
  const wrapper = shallow(<Stopwatch />);
  expect(wrapper.html()).toMatchSnapshot();
});

Импорт для onAddClick, isEnabled и setAddButtonEnabled является фиктивным props я передавал компоненту Stopwatch, поскольку изначально думал, что это может решить проблему.

Answer 1

Если кто-то сталкивается с той же проблемой, по-видимому, в React есть ошибка, связанная с обновлением состояния в мелких оболочках, поэтому исправление заключается в замене shallow на mount.

Итак, в мой случай const wrapper = mount(<Stopwatch/>);