javascript - 在React组件的props上使用mjackson的期望spyOn

尝试在props的函数上使用期望的spyOn时出现错误TypeError: Cannot assign to read only property 'onFocus' of object '#<Object>'，可能是由于spyOn行为所致。

it('handleFocus', () => {
      const wrapper = setup()
      const spy = spyOn(wrapper.props(), 'onFocus')
      wrapper.instance().handleFocus()
      expect(spy).toHaveBeenCalled()
})

有设置功能

const setup = (isMount) => {
    const props = {
      value: 'test',
      promise: () => Promise.resolve({}),
      access: () => {},
      onFocus: () => {},
      onChange: () => {},
      onUpdateInput: v => v
    }
    return isMount
      ? mount(<AutoCompleteAsync {...props} />)
      : shallow(<AutoCompleteAsync {...props} />)
  }

在那里您可以找到handleFocus函数

handleFocus () {
    const { onFocus, onInputFocus } = this.props
    if (onInputFocus) {
      onInputFocus()
    }
    onFocus()
  }

最佳答案

SpyOn尝试使用模拟覆盖您的方法。


  用间谍代替target中的方法。
  https://github.com/mjackson/expect#spyon


但是您的对象是酶提供的浅表副本：

// That's what actually happens in your test, setup() aside
const wrapper = shallow(<AutoCompleteAsync {...props} />)

修改道具的唯一方法是再次调用setProps。

it（'handleFocus'，（）=> {
      const wrapper = setup（）
      const props = {
         值：“测试”，
         onFocus：（）=> {}
      }
      //用sponed onFocus替换onFocus
      const spy = spyOn（props，'onFocus'）

  // Inject spied onFocus back
  wrapper.setProps(props)
  wrapper.instance().handleFocus()
  expect(spy).toHaveBeenCalled()

}）