2017-05-12 61 views
1

你好,我有一个玩笑/酶试验是这样的:在测试环境中触发this.props.dispatch

it('triggers checkbox onChange event',() => { 
    const configs = { 
    default: true, 
    label: 'My Label', 
    element: 'myElement', 
    } 
    const checkbox = shallow(
    <CheckBox 
     configs={configs} 
    /> 
) 
    checkbox.find('input').simulate('click') 
}) 

而且看起来像这样一个组件:

<div className="toggle-btn sm"> 
    <input 
    id={this.props.configs.element} 
    className="toggle-input round" 
    type="checkbox" 
    defaultChecked={ this.props.defaultChecked } 
    onClick={ e => this.onChange(e.target) } 
    > 
    </input> 
</div> 

点击input导致此方法被称为:

this.props.dispatch(update(data)) 

它可以在我的浏览器中正常工作,但是当测试t他onClick事件中,我得到这个错误:

TypeError: this.props.dispatch is not a function 

我如何this.props.dispatch在我的测试工作吗?

感谢

+0

请出示CheckBox组件的整体,使我们可以看到“this.props.dispatch(更新(数据))”的用武之地。 –

回答

1

您需要通过dispatch作为测试的道具。

修改下面的代码:

it('triggers checkbox onChange event',() => { 
    const configs = { 
    default: true, 
    label: 'My Label', 
    element: 'myElement', 
    } 

    const dispatch = jest.fn(); 

    const props = { 
    configs, 
    dispatch 
    } 
    const checkbox = shallow(
    <CheckBox 
     {...props} 
    /> 
) 
    checkbox.find('input').simulate('click') 
    expect(dispatch).toHaveBeenCalledWith(update(data)) 
}) 
+0

工作就像一个魅力,thx! – SeanPlusPlus