将事件对象传递给酶 .simulate [英] Passing an event object to enzyme .simulate

问题描述

我正在使用 Jest 和 Enzyme 来测试 React 复选框组件.

这是我的测试:

it('触发复选框 onChange 事件', () => {常量配置 = {默认值:真，label: '我的标签',元素:'我的元素'，}const 复选框 = 浅(<复选框配置={配置}/>)checkbox.find('input').simulate('click')})

但是在运行测试时出现此错误:

TypeError: 无法读取未定义的属性目标"

这是我的组件的输入:

<输入id={this.props.configs.element}className="切换输入轮"类型=复选框"defaultChecked={ this.props.defaultChecked }onClick={ e =>this.onChange(e.target) }></输入>

我认为我需要传递一个事件作为 simulate 的第二个对象，但我不知道如何做到这一点.

谢谢

解决方案

simulate 函数采用将传递给事件处理程序的其他参数.您可以模拟您的活动.例如:

const mockedEvent = { 目标:{} }checkbox.find('input').simulate('click', mockedEvent)

I am using Jest and Enzyme to test a React checkbox component.

This is my test:

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')
})

I get this error however when running the test:

TypeError: Cannot read property 'target' of undefined

This is the input for my component:

<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>

I think that I need to pass an event as the second object to simulate but I am not sure how to do this.

Thanks

解决方案

simulate function takes other arguments which will be passed to the event handler. You can mock your event. E.g.:

const mockedEvent = { target: {} }
checkbox.find('input').simulate('click', mockedEvent)

这篇关于将事件对象传递给酶 .simulate的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！