如何使用 jest + 酶测试延迟加载组件

Question

在我的反应应用程序中，我使用React.lazy(() => import("...")). 但我无法实现支持延迟加载的测试用例。

如果没有React.lazy(() => import("..."))我的测试用例，则工作正常，但仅使用React.lazy它就无法工作。

请帮忙。

授权.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;

这是我的测试代码。

授权规范.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}