2016-10-05 3 views
2

Jest를 사용하여 연결된 구성 요소를 테스트하고 있습니다. 이 구성 요소가 모습입니다 :Jest for React/Redux 구성 요소를 사용하여 단위 테스트

import React, {Component, PropTypes} from 'react'; 
import { connect } from 'react-redux'; 

class MyComponent extends Component { 
    constructor(){ 
    super(); 
    this.onButtonClick = this.onButtonClick.bind(this); 
    } 

    onButtonClick(id) { 
    dispatch(actions.onButtonClick(id)); 
    } 

    render() { 
    return (
     <div onClick={this.onButtonClick} /> 
    ) 
    } 
} 

function mapStateToProps(state) { 
    something: state.something 
} 

MyComponent.propTypes = { 
    dispatch: PropTypes.func.isRequired 
} 

export default connect(mapStateToProps)(MyComponent) 

내가 테스트하는 방법을 잘 모르겠습니다 'onButtonClick'는 액션을 전달하기 때문이다. jest를 사용하여 올바른 매개 변수로 디스패치를 ​​호출하는 방법

답변

2

기본 내보내기 외에 구성 요소를 내 보내면됩니다. 그래서로 변경 : 테스트에서

export class MyComponent extends Component 

, 당신은 지금 연결된 기기 대신 실제 구성 요소를 가져올 수 있습니다. 구성 요소의 보조 도구로 dispatch을 가지고 있으므로 시험에서 dispatch에 대해 모의 함수 또는 스파이 (재스민 또는 사론을 사용)를 제공하고 정확한 매개 변수로 호출되는지 테스트 할 수 있습니다.

여기에서 redux 테스트에 대해 자세히 알아보십시오. http://redux.js.org/docs/recipes/WritingTests.html