Jest 单元测试不通过：Received number of calls did not match 的解决方法

在进行前端开发时，我们经常需要写单元测试来保证代码的正确性和可靠性。而在使用 Jest 进行单元测试时，有时会遇到一个错误：Received number of calls did not match。这个错误通常是由于函数被调用次数不符合预期而引起的。本文将详细介绍这个错误的原因和解决方法，并提供示例代码供读者参考。

错误原因

在 Jest 中，我们可以使用 jest.fn() 来创建一个模拟函数，用于在测试中替代真实的函数。模拟函数可以跟踪自身的调用情况，包括被调用的次数、传入的参数等等。当我们在测试中期望某个模拟函数被调用特定的次数时，就可以使用 Jest 提供的 matcher toBeCalledTimes() 来进行断言。

例如，我们有一个名为 foo 的函数，我们希望在测试中断言它被调用了 3 次：

const foo = jest.fn();
foo();
foo();
foo();
expect(foo).toBeCalledTimes(3);

然而，如果 foo 函数在测试中被调用的次数不符合预期，就会触发 Received number of calls did not match 错误。这个错误的具体表现形式可能有很多种，例如：

• Expected number of calls: 3 Received number of calls: 2
• Expected number of calls: >= 3 Received number of calls: 2
• Expected number of calls: <= 3 Received number of calls: 4

这些错误都表示我们在测试中期望某个模拟函数被调用特定的次数，但实际上它被调用的次数和我们的期望不符合。

解决方法

当我们遇到 Received number of calls did not match 错误时，需要检查以下几点：

1. 测试代码的正确性

首先，我们需要确保测试代码本身的正确性。有时候我们可能会犯一些低级错误，比如：

• 没有正确地调用被测试的函数；
• 没有正确地调用模拟函数；
• 没有正确地设置模拟函数的返回值；
• 没有正确地使用 Jest 提供的 matcher。

这些错误都可能导致测试失败，从而触发 Received number of calls did not match 错误。因此，我们需要仔细检查测试代码，确保它们的正确性。

2. 模拟函数的正确性

如果测试代码本身没有问题，那么我们需要检查模拟函数的正确性。有时候我们可能会犯一些低级错误，比如：

• 没有正确地创建模拟函数；
• 没有正确地设置模拟函数的返回值；
• 没有正确地调用模拟函数。

这些错误都可能导致模拟函数的行为不符合预期，从而触发 Received number of calls did not match 错误。因此，我们需要仔细检查模拟函数的正确性。

3. 调用次数的正确性

如果测试代码和模拟函数都没有问题，那么我们需要检查调用次数的正确性。有时候我们可能会犯一些低级错误，比如：

• 没有正确地设置模拟函数被调用的次数；
• 没有正确地设置模拟函数被调用的参数；
• 没有正确地调用被测试的函数，从而导致模拟函数没有被调用。

这些错误都可能导致模拟函数的调用次数不符合预期，从而触发 Received number of calls did not match 错误。因此，我们需要仔细检查调用次数的正确性。

4. 调试信息的输出

如果以上步骤都检查过了，但仍然无法解决问题，那么我们可以使用 Jest 提供的调试信息来帮助我们定位问题。我们可以在测试中使用 console.log() 或 debugger 语句来输出调试信息，从而了解程序的执行情况。

示例代码

下面是一个示例代码，演示了如何使用 Jest 进行单元测试，并处理 Received number of calls did not match 错误：

// javascriptcn.com 代码示例
// foo.js
function foo() {
  return 'foo';
}

// foo.test.js
const foo = require('./foo');

test('foo should be called 3 times', () => {
  const mockedFoo = jest.fn(foo);
  mockedFoo();
  mockedFoo();
  expect(mockedFoo).toBeCalledTimes(3); // Error: Expected number of calls: 3 Received number of calls: 2
});

test('foo should be called with correct arguments', () => {
  const mockedFoo = jest.fn(foo);
  mockedFoo(1);
  mockedFoo(2);
  mockedFoo(3);
  expect(mockedFoo).toHaveBeenCalledWith(1);
  expect(mockedFoo).toHaveBeenCalledWith(2);
  expect(mockedFoo).toHaveBeenCalledWith(3);
});

test('foo should return correct value', () => {
  const mockedFoo = jest.fn(foo);
  mockedFoo.mockReturnValueOnce('bar');
  mockedFoo.mockReturnValueOnce('baz');
  expect(mockedFoo()).toBe('bar');
  expect(mockedFoo()).toBe('baz');
});

在这个示例代码中，我们定义了一个名为 foo 的函数，并在测试中使用 Jest 提供的 jest.fn() 来创建一个模拟函数 mockedFoo。我们使用 mockedFoo() 来调用模拟函数，并使用 expect() 和 matcher 来进行断言。在第一个测试中，我们期望模拟函数 mockedFoo 被调用了 3 次，但实际上它只被调用了 2 次，因此触发了 Received number of calls did not match 错误。在第二个测试中，我们期望模拟函数 mockedFoo 被正确地调用了 3 次，并传入了正确的参数。在第三个测试中，我们期望模拟函数 mockedFoo 能够正确地返回指定的值。

总结

在进行单元测试时，我们经常会遇到 Received number of calls did not match 错误。这个错误通常是由于函数被调用次数不符合预期而引起的。在解决这个错误时，我们需要仔细检查测试代码、模拟函数和调用次数的正确性，并使用 Jest 提供的调试信息来帮助我们定位问题。通过认真地分析和处理 Received number of calls did not match 错误，我们可以提高单元测试的可靠性和有效性，从而更好地保证代码的正确性和可靠性。

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/657bc500d2f5e1655d66e410