2017-01-21 12 views
2

私はReactとJestで簡単なテストを書こうとしています。Reactで必要な小道具をテストするには

コンポーネント:

import React from "react"; 

class Task extends React.Component { 

    render() { 
     let onDelete = this.props.onDelete; 
     return (
       <li> 
        <div className="collapsible-header"><i className="material-icons" onClick={() => onDelete(this.props.taskId)}>delete</i>{this.props.title}</div> 
        <div className="collapsible-body"><p>{this.props.description}</p></div> 
       </li> 
       ); 
    } 
}; 

Task.propTypes = { 
    title: React.PropTypes.string.isRequired, 
    taskId: React.PropTypes.number.isRequired, 
    onDelete: React.PropTypes.func.isRequired, 
    description: React.PropTypes.string 
}; 

Task.defaultProps = { 
    description: '' 
}; 

export default Task; 

テスト

import React from 'react'; 
import Task from '../src/components/Task'; 
import renderer from 'react-test-renderer'; 

test('Task should require properties',() => { 
    const component = renderer.create(//this will give me React warnings which I would like to assert 
    <Task></Task> 
); 
}); 

今はtitletaskIdonDeleteTask成分に必要であることを主張したいです。それを指定しない(あるいは別のタイプを渡す)ことについてリアクションの警告が出るようになるだろう。

答えて

1

スパイを使用して、反応から何らかの種類の例外がスローされたかどうかを調べることができます。多くの人がSinon.jsという図書館を使います。 「テストスパイは、引数、戻り値、これの値、およびすべての呼び出しでスローされた例外(存在する場合)」を記録する関数です。

ここでは詳細に説明した優れたソリューションがあります:

How to test React PropTypes through Jest?

関連する問題