В своем приложении реакции я реализовал отложенную загрузку, используя React.lazy(() => import("..."))
. Но я не могу реализовать тестовый сценарий, который будет поддерживать отложенную загрузку.
Без React.lazy(() => import("..."))
мои тестовые случаи работают нормально, но только с React.lazy
он не работает.
Пожалуйста, помогите в этом.
auth.jsx
import React, { Suspense } from "react";
import { Switch, Route } from "react-router-dom";
const SignIn = React.lazy(() => import("../../components/SignIn/SignIn"));
const Authentication = props => {
return (
<div id="wrapper" className="bg-gradient-primary">
<Suspense fallback={<div>Loading...</div>}>
<Switch>
<Route path="/sign-in" component={SignIn} />
</Switch>
</Suspense>
</div>
);
};
export default Authentication;
А вот мой тестовый код.
auth.spe c .jsx
import React from "react";
import { shallow } from "enzyme";
import Authentication from "./Authentication";
import SignIn from "../../components/SignIn/SignIn";
describe("Authentication", () => {
let component;
beforeEach(() => {
component = shallow(<Authentication />);
});
it("should render", () => {
expect(component.find("#wrapper")).toHaveLength(1);
});
it('should render "SignIn"', () => {
const routeEl = component.find('Route[path="/sign-in"]');
expect(routeEl.first().prop("component")).toBe(SignIn);
});
});
Когда я запускаю свои тестовые случаи, я получаю ошибку ниже
expect(received).toBe(expected) // Object.is equality
Expected: [Function SignIn]
Received: {"$$typeof": Symbol(react.lazy), "_ctor": [Function anonymous], "_result": null, "_status": -1}