Question

我对测试很陌生。

考虑到我下面有一个组件

export default function ResolutionCount({ componentUsedIn }) {
    const dispatch = useDispatch();

    const userID = useSelector(
        (state) => state.userInfoReducer.userInfo[0]["user_id"]
    );

    useEffect(() => {

        dispatch({
            type: SET_RESOLUTION_STATUS_COUNT_BAR_CHART_FETCHING_DATA,
            payload: true,
        });
        dispatch(getResolutionStatusCount([]));

        return () => {
            dispatch({
                type: SET_RESOLUTION_STATUS_COUNT_BAR_CHART,
                payload: {
                    barChartData: [],
                    barChartCategories: [],
                    resolution_status_environment: [],
                },
            });
        };
    }, []);

    const handleSelection = (selectedData) => {

        dispatch({
            type: SET_RESOLUTION_STATUS_COUNT_SELECTED_ENV,
            payload: selectedData,
        });

        dispatch(
            getResolutionCount(
                [],
                startDate,
                endDate,
                false,
                selectedData
            )
        );
    };

    return (
        <Fragment>
            <Space>
                <DateRangePicker
                    componentUsedIn={componentUsedIn}
                ></DateRangePicker>
                <Selection
                    options={environment}
                    handleSelection={handleSelection}
                ></Selection>
            </Space>
            <BarChart componentUsedIn={componentUsedIn}></BarChart>
        </Fragment>
    );

}

在此选择中，DateRangePicker和BarChart组件用React.memo()包装。现在进行单元测试，我实际上正在使用玩笑和酵素，并在酵素的浅层中运行useEffect，我正在使用另一个名为jest-react-hooks-shallow

的软件包

我实际上想测试handleSelection组件中的ResolutionCount函数。因为测试用例没有涵盖该功能。我浏览了酶的文档中有关如何调用此函数的文档，发现如果它是基于类的组件，我们可以获取包装器实例并调用该函数。但是在react hooks组件中，我们应该如何测试组件内部的功能。

我经历了Testing React Functional Component with Hooks using Jest，但这没有帮助。

我还了解到测试内部实现不是最佳实践。在这种情况下，此功能将不会涵盖测试范围，对吗？可以吗？

有人可以帮助/建议我吗？

请原谅，如果重复此问题，请先谢谢您！

Answer 1

在测试功能组件时，我认为通常这是一种很好的方法，您尝试测试组件的行为，而不是实现。

因此，当涉及到您的案例时，其想法是模拟选择（我想它实质上是一个HTML select）并检查某些行为，这些行为是使用{{1 }}。

如何涵盖对React-hooks组件内部功能的测试-酶/笑话

1 个答案: