无法从玩笑测试中访问内置 Node.js `fetch` 函数

Question

我有一个具有如下功能的文件：

export async function loginNextAuth(displayName, password) {
    const response = await fetch('/api/auth/callback/credentials')
}

注意没有导入，这是全局命名空间中的内置 Node.js 获取函数。这在剧作家测试和常规代码中效果很好。

由于某种原因，在 Jest 测试中运行时，

global

和

globalThis

都没有

fetch

属性。这会导致开玩笑时出现错误，指出

fetch

变量未声明。

jest 测试中返回的

process.version

与我在开发中使用的 Node 版本相同。

This是一个类似的SO问题，但是OP正在使用从模块导入的外部获取函数。

更新：节点版本为v18.12.1

有问题的错误：

    const response = await fetch("/api/auth/callback/credentials", {
                     ^

ReferenceError: fetch is not defined
    at Object.loginNextAuth (web_app/lib/tests/jest/login.js:8:22)
    at loginAs (web_app/pages/permissions.jest.js:22:71)

Answer 1

使用 Node 18 时，Jest 删除了对 fetch 的全局引用。

解决方法是将其添加到您的

jest.config.js

文件中的全局变量中。

globals: {
  fetch: global.fetch,
}

需要牢记的其他一些潜在问题：

1. 您的节点获取将需要绝对 URL，而不是相对 URL。
2. fetch 不使用 Node 的 http 模块，因此 Nock 等工具目前无法拦截所进行的调用。 https://github.com/nock/nock/issues/2336

Answer 2

对于那些仍在寻找答案的人，

fetch

API 仅在 Jest v28+ 中的 Jest 节点测试环境中可用，如此评论中所指出。要访问它，您必须在

node

测试环境（Jest 的默认测试环境）而不是

jsdom

中运行测试。您可以将

testEnvironment: "node"

添加到您的笑话配置中，或者如果您想针对特定测试文件更改它，您可以在测试文件顶部的文档块中添加

@jest-environment node

。请参阅https://jestjs.io/docs/configuration#testenvironment-string。

Answer 3

您正在使用 Node 18+ 和 JSDom 环境，但 Jest 的开发人员拒绝解决此问题，直到 JSDom 解决为止。

在我们等待期间，将其添加到您的自定义环境中：

// ./jsdom-env.js
import JSDOMEnvironment from "jest-environment-jsdom";

export default class FixJSDOMEnvironment extends JSDOMEnvironment {
  constructor(...args) {
    super(...args);
    this.global.fetch = fetch;
    this.global.Request = Request;
  }
}

并将其添加到您的 jest.config 文件中：

module.exports = {
  testEnvironment: "./jsdom-env.js"
}