无法涵盖具有支撑的React组件的单元测试用例

问题描述

我有一个包含以下代码的组件：-

import React from "react";
import { Box,Grid } from "@material-ui/core";
import ArrowBackIosIcon from "@material-ui/icons/ArrowBackIos";
import SearchOutlinedIcon from "@material-ui/icons/SearchOutlined";
import blue from "@material-ui/core/colors/blue";
const BackwithSearchIcon = (props) => {
    const blue_900 = blue[900];
    const searchOption = ()=>{
            return (props.searchOption)?(
                <Grid item>
                    <Box mr={2}>
                        <SearchOutlinedIcon color="primary" />
                    </Box>
                </Grid>    
            ):(null)
    }
 
    return (
        <Grid container>
            <Grid item>
              <Box>
                <ArrowBackIosIcon
                  color="primary"
                  onClick={()=>props.goBack()}
                />
              </Box>
            </Grid>
            <Grid item xs>
              <Box
                component="span"
                fontSize={18}
                fontWeight="fontWeightMedium"
                color={blue_900}
                onClick={()=>props.goBack()}
              >
                Back
              </Box>
            </Grid>
            {searchOption()}
        </Grid>
    )
}

export default BackwithSearchIcon;

我正在用以下代码编写单元测试用例：-

test('renders as expected',() => {
    const goBack = () => {}
    const renderer = new ShallowRenderer()
    const result=(<BackwithSearchIcon searchOption={true} goBack = {goBack}></BackwithSearchIcon>)
    expect(result.props.searchOption).toBe(true);
});

当我生成覆盖率报告报表时，覆盖率未达到14％ Coverage Report

我正在将尝试将searchOption发送为false的整个组件传递给我，但仍然无法正常工作

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）