Jest 测试时如何禁用 console.log 的输出

在进行前端单元测试时，常常需要使用 console.log() 来输出调试信息，但这些信息可能会产生噪音并变得混乱，尤其在持续集成时。因此，有时需要禁用掉 console.log() 的输出。本文将介绍如何在 Jest 测试中禁用 console.log() 的输出。

方法

可以通过以下两个步骤来禁用 console.log() 的输出：

1. 使用 global.console.log 替代 console.log
2. 将 global.console.log 设置为一个空函数

以下是相关的 Jest 配置：

{
  // ...
  silent: true,
  verbose: false,
  setupFilesAfterEnv: ['./jest.setup.js'],
  // ...
}

其中 silent 为测试运行时禁止输出日志，verbose 则决定是否开启详细日志。setupFilesAfterEnv 将在运行测试之前执行的脚本列表。在上述配置中，我们使用了如下的 jest.setup.js 文件来禁用 console.log()：

global.console.log = jest.fn()

这会将 global 对象上的 console.log() 设置为一个 Jest 模拟函数。由于 Jest 模拟函数不会产生任何输出，因此所有的 console.log() 都将被静默掉。

示例

下面是一个简单的例子，演示如何在 Jest 测试中禁用 console.log()：

// Logger.js
export default function Logger() {
  this.log = function (msg) {
    console.log(`[LOG] ${msg}`)
  }
}

// www.javascriptcn.com code example
// Logger.test.js
import Logger from './Logger'

describe('Logger', () => {
  let logger

  beforeAll(() => {
    // 禁用 console.log() 输出
    global.console.log = jest.fn()
  })

  afterAll(() => {
    // 恢复 console.log() 原有行为
    global.console.log.mockRestore()
  })

  beforeEach(() => {
    logger = new Logger()
  })

  it('should log messages', () => {
    logger.log('Message')
    expect(global.console.log).toHaveBeenCalled()
  })
})

在这个例子中，我们使用了 beforeAll 和 afterAll 钩子来禁用和恢复 console.log() 的输出。在 beforeAll 中，我们将 global.console.log 设置为一个 Jest 模拟函数，以避免在测试运行时输出任何日志。在 afterAll 中，我们恢复了 console.log() 的原始行为。

在每个测试之前，我们都创建了一个 Logger 实例，在测试中调用 logger.log() 方法，预期会产生一次 console.log() 的调用。在测试中，我们使用了 expect(global.console.log).toHaveBeenCalled() 断言，确保 console.log() 在测试中被调用。

指导意义

禁用 console.log() 的输出有助于减少不必要的日志信息，使测试结果更加清晰。此外，若测试文件运行缓慢或存在内存泄漏，也有可能发现是 console.log() 导致的。通过禁用 console.log() 的输出，可以帮助我们更好地排查问题和提高测试执行性能。

结语

以上就是在 Jest 测试中禁用 console.log() 输出的方式和示例。在实际应用中，若需要输出日志，则可以将 setupFilesAfterEnv 设置为空数组，或者将 global.console.log 重新设置为 console.log 原有的行为。希望这篇文章能够帮助您更好地进行前端单元测试。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67c407686e1fc40e36cd2b71