在react.js,Jest,Ease中模拟一个简单的函数

问题描述

我是反应测试的新手,正在构建一个简单的待办事项应用程序。我正在努力模拟列表组件中的删除功能。

我的测试目前看起来像这样

  it('deletes an item from the list',() => {
    const deleteItem = jest.fn();
    const items = [{body: "New note",id: "12345"}]
    const textEl = wrapper.find("#text-output p")
    wrapper = shallow(<ListItems list={items} deleteItem={deleteItem}/>)
    wrapper.find('#delete').simulate('click')
    expect(textEl.text()).toContain("//Should be empty")
  })

目前,当我运行测试时,错误显示为。

Expected substring: "//Should be empty"
Received string:    "New note X"

该应用程序工作正常,但由于仍在传递“新注释”,因此我在测试中无法正确模拟删除功能。我在做什么错了?

以防万一,这是我正在测试的文件。

function ListItems(props) {
   const list = props.list
    const displayItems = list.map((item,index) => 
    {
      return <div id='text-output' key={index}>
            <p>
              {item.body } 
              &nbsp;
              <button
              id="delete"
              onClick={ () => props.deleteItem(item.id)}>
                X
              </button>
            </p>
        </div>
    })
  return(
  <div>
    <h1>This is the list</h1>
    {displayItems}
  </div>
  )
}

任何帮助都会很棒!

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)