Question

我正在尝试模拟/测试调用props.onClick的按键事件。我使用类似的测试代码成功模拟了onClick，但是按键不起作用。

当我通过按Enter键手动测试它时，它可以正常工作，但是当我尝试为其编写测试时，它总是失败，我不确定为什么。我在useEffect函数中放置了一个记录器，并在测试过程中调用了该记录器，但是它失败并给出一个错误，即从未调用过onClickFnc。

在按钮功能组件中，我绑定了一个事件侦听器：

button.js

  useEffect(() => {
    if (enterEnable) {
      window.addEventListener('keydown', onEnterPress);
      return () => window.removeEventListener('keydown', onEnterPress);
    }
  });

  const onEnterPress = e => {
    if (e.which == 13) {
      onClickSync(e);
    }
  };

  const onClickSync = e => {
    props.onClick(e);
  };

button.test.js

  it('check ButtonLoader enable enter to work', () => {

    const onClickFnc = jest.fn(); 
    const wrapper = shallow(<ButtonLoader {...props} enterEnable={true} onClick={onClickFnc}/>);
    wrapper.find('button').simulate('keypress', {key: 'Enter'})
    expect(onClickFnc).toBeCalled();
  });

错误：

    expect(jest.fn()).toBeCalled()

    Expected number of calls: >= 1
    Received number of calls:    0

如何成功测试呢？

Answer 1

改为尝试

wrapper.find('button').simulate('keydown', {which: 13})

从我所看到的情况来看，simulator不会根据参数创建事件对象。而是按原样传递对象。

如何使用Jest模拟/测试按键？

1 个答案: