javascript - 将参数传递给 jest 函数

Question

我的子组件中有这个函数:

<div> {handTotal('dealersHand').total} </div>

这是上面传下来的

但是，当我运行 jest 时，它显示无法读取未定义的属性“total”

当我 console.log(handTotal('dealersHand') 时，它正在记录正确的事情并且该函数可以工作，所以我知道它正在做正确的事情

我已经像这样 Jest 把它删掉了:

const handTotalStub = jest.fn()
  beforeEach(() => {
    wrapper = mount(<Dealer
      dealersHand={dealersHandStub}
      containsAce={containsAceStub}
      handTotal={handTotalStub}
    />);
  })

如何将参数传递到此函数中以便 jest 理解它是什么？

如果没有意义，可以添加更多代码/解释

stub :

  const handTotalStub = jest.fn().mockReturnValue('dealersHand')

测试:

  it('expects dealers hand to equal', () => {
    expect(handTotalStub('dealersHand').total).toEqual(1);
  });

Answer 1

您的 handleTotalStub Jest spy 不会返回任何内容，因此它返回 undefined。当您的组件尝试调用 handTotal('dealersHand').total 时，它会调用 undefined.total，因为 handTotal(...)未定义。

更新您的 spy 以通过更改返回某些内容(任何内容)

handTotalStub = jest.fn();

到

handTotalStub = jest.fn().mockReturnValue(SOME_VALUE);

或

handTotalStub = jest.fn().mockImplementation(() => SOME_VALUE);

(其中 SOME_VALUE 是您可以模拟出的任何值，以充当组件期望的值)

编辑-- 好的，所以您误解了mockReturnValue 的作用。您不必模拟传递给该方法的参数。因为您的组件已经传入该字符串。但是，实际的 handTotal 方法永远不会被调用(这是一件好事，因为我们不是测试 handTotal 的工作原理，而是测试组件的工作原理作品)。

因此，通常返回的 handTotal 就是您想要放入 mockReturnValue() 中的内容。因此，如果 handTotal 返回一个像 {total: 1} 这样的对象，那么你会说 mockReturnValue({total: 1})