反应组分中的间谍方法

rid*_*nsb 2 reactjs jestjs enzyme mobx-react

我的组件有一个方法..

onUpdateProperty = (key, value) => {
  this.state.formData[key] = value;
}
Run Code Online (Sandbox Code Playgroud)

我想测试是否在更改输入后调用此方法...

it('on update input should update formData', function () {
  const wrapper = mount(<MyComp.wrappedComponent {...this.minProps} />);
  const spy = spyOn(wrapper.instance(), 'onUpdateProperty');

  expect(spy).not.toHaveBeenCalled();

  const nameInput = wrapper.find('[name="name"]');
  nameInput.simulate('change', {
    target: { name: 'name', value: 'v1' },
  });

  wrapper.update();

  // expect(spy).toHaveBeenCalledWith('name', 'v1');
  expect(spy).toHaveBeenCalled();
});  
Run Code Online (Sandbox Code Playgroud)

wrappedComponent是因为我使用Mobx-react

And*_*rle 7

我的建议是不要间谍你的组件的内部功能,而只是测试state.

expect(wrapper.state.formData.name).toBe('v1)
Run Code Online (Sandbox Code Playgroud)

如果你真的想窥探它,你必须监视你组件的原型.

jest.spyOn(MyComp.wrappedComponent.prototype, 'onUpdateProperty')
Run Code Online (Sandbox Code Playgroud)