0

我有一个组件,它有一个输入框,就像->

class search extends React.Component {

    constructor(props) {
        super(props);
        this.staate = {
            search : ''
        }
    }

     onInputChnage = (e) => {
        this.setState({ search: e.target.value });
     }

    render() {

        const { jobs: { content } } = this.props;
        const { search } = this.state;
        const filteredList = content.filter(job => (job.jdName && job.jdName.toLowerCase().includes(search.toLowerCase())) || (job.technology && job.technology.toLowerCase().includes(search.toLowerCase())));

        return (
            <input type="text"
                id="searchJob"
                className="form-control-sm border-0 flex-grow-1"
                value={this.state.search}
                placeholder="Technology / Job title"
                onChange={this.onInputChnage}
            />
            <i className="fa fa-search search-job"></i>
        )
    }
}

在这个组件中,现在我有来自 reducer 的作业数据。

this.props.jobs = {
    "content": [{
        "id": "5b7d4a566c5fd00507501051",
        "companyId": null,
        "jdName": "Senior/ Lead UI Developer",
        "jobDescription": null,
        "technology": "java"
    },{
        "id": "5b7d4a566c5fd005075011",
        "companyId": null,
        "jdName": "ead UI Developer",
        "jobDescription": null,
        "technology": "angular"
    }]
}

现在,在这里我想使用单元测试用例来测试这个组件的搜索功能。我正在使用jest. 现在,任何人都可以帮我解决这个问题吗?任何提示都会非常有帮助。谢谢。

4

0 回答 0