reactjs - 如何测试在作为 prop 传递的另一个 React 组件中激活的功能？

Question

我有一个这样的 React 类：

class EvidenceRelatedCases {
//...
    private handleAdd(selectedCases: []) {
         selectedCases.forEach(c => {
            // this is a GET request which I mocked
            CaseSource.get(c.id).then((fetchedCase) => {
            //do stuff; activates error message
            }
         }
    }

    render(
        return <div>
            <EntityPicker
                onAdd={this.handleAdd.bind(this)}
            />
}

我想测试 handleAdd 函数，但是，它只在 EntityPicker 组件内执行，所以我很难触发它。这是我目前拥有的：

    it("should trigger error message when adding cases which are at limit capacity", () => {
        // trigger handleAdd() --> ??
        // mock get request
        // mock case that is to be returned from get request
        // check if error message displayed

        // mock get request; suppose to be called inside handleAdd()
        CaseSource.get.mockImplementation((caseId: string): Promise<ICaseModel> => {
            // mock maxed out case
            let caseModel = generateCase("1234");
            caseModel['Evidences'] = new Array(5000);
            return new Promise<ICaseModel>((resolve, reject) => { });
        });

        // trigger handleAdd(), (createView renders <EvidenceRelatedCases> with its props)
        const view = createView(context, evidenceId, true, [], [], null, null);
        view.handleAdd([/*one case object*/]);

        // verify if message is displayed
        const list = TestUtils.findRenderedComponentWithType(view, List as any) as List;
        console.log(list);

        const warning = TestUtils.findRenderedDOMComponentWithClass(list, "has-warning");

        expect(warning).toBeTruthy();
    });

目的是检查一旦“案例”已满并且用户仍然添加（handleAdd）时是否显示错误消息。错误和显示错误的函数在 EvidenceRelatedCases 类组件中，而触发函数的地方在 EntityPicker。

标签： reactjstestingjestjsenzyme