У меня проблема с тестированием React Router useRouteMatch внутри теста. Я использую Jest Shallow и Enzyme. Каждый раз, когда я получаю эту ошибку
Error: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s%s
Это мой упрощенный, очень простой компонент. Я попытался использовать react-router-dom
также.
import React from "react";
import { Route } from "react-router-dom";
import { useRouteMatch } from "react-router";
import { AddFieldModal } from "Modals/AddFieldModal";
const Forms = () => {
const match = useRouteMatch();
return (
<Route
path={`${match.url}/newField`}
render={() => <AddFieldModal />}
/>
);
};
export { Forms };
Это очень просто, и это работает. Это мой тест
import React from "react";
import toJson from "enzyme-to-json";
import { shallow } from "enzyme";
import { Forms } from "../index";
jest.mock("react-router", () => ({
useRouteMatch: () => ({ url: "testUrl" }),
}));
describe("<Forms />", () => {
it("should render", () => {
const wrapper = shallow(<Forms />);
expect(toJson(wrapper)).toMatchSnapshot();
});
});
Реакт версия: 16.12.0 Версия роутера: 5.1.2
Есть идеи? Спасибо
РЕДАКТИРОВАТЬ: Добавление импорта и версий