Jest 和 ESM 的测试问题以及解决方法

本周，我的任务是向我的 RefactorCode 项目添加测试。当我开始添加新功能时，我注意到一些现有功能正在崩溃，并且手动测试所有内容变得越来越困难。这清楚地表明我需要实施适当的自动化测试以确保应用程序稳定。

由于我在之前的《程序员云计算》课程中使用过 Node.js，因此有过使用 Jest 的经验，所以我决定也将它用于这个项目。我首先编写一些测试来检查代码的功能。但是，我遇到了一些以前从未遇到过的错误。经过一些调试和 Stack Overflow 搜索后，我意识到在 Jest 中使用 ESM（ECMAScript 模块）时需要额外的配置。在我之前的项目中，我使用了 CommonJS，效果非常好。虽然我可以选择使用 Babel 进行转换，但 Jest 提供了一个新的测试版功能，允许 ESM 直接运行。我决定尝试一下，效果非常好！

这解释了与使用 ESM 配置 jest 相关的所有内容：https://jestjs.io/docs/ecmascript-modules

以下是设置的快速概述：

安装笑话：

npm install --save-dev jest

创建 jest.config.js 文件。在这里我还设置了要忽略的文件夹：

export default {
  testPathIgnorePatterns: ["/node_modules/", "/examples"],
  transform: {},
};

在 package.json 脚本部分，使用 jest 的实验参数来处理 ESM 模块：

"scripts": {
    "test": "node --experimental-vm-modules node_modules/jest/bin/jest.js"
}

创建一个测试文件。我在根目录的测试文件夹中创建了所有测试。这是我创建的一个简单的：

import { readFile, checkIfDirectory } from "../src/fileUtils";

describe("File Utility", () => {
    test("Read File", () => {
      readFile("./examples/test.txt").then((data) => {
        expect(data).toBe("Hello World");
      });

    });

    test('should return true if the path is a directory', async () => {
      const result = await checkIfDirectory('./examples');
      expect(result).toBe(true);
    });
});

如果您想使用单个测试文件进行测试：

npm test -- banner.test.js

为了运行所有测试，我们使用之前在 package.json 中添加的脚本：

npm run test

最后，基本测试完成了。然而，这只是我的故障排除之旅的开始。我在模拟库和模块方面也遇到了困难，特别是因为它们使用了 ESM。这些需要额外的配置，但经过一些调整后，我能够让一切正常工作，并且测试成功运行。

您必须使用jest.unstable_mockModule，而不是使用常规的jest.mock：

For example: await jest.unstable_mockModule("fs", () => ({
  existsSync: jest.fn(),
  readFileSync: jest.fn(),
}));

请参阅本节了解更多信息。

我想测试的核心功能之一涉及与​​ Gemini API 的集成。由于我不想依赖实时 API 进行测试，因此我决定模拟 API 调用。最初，我尝试使用 Nock，但遇到了问题，因为它与 Node 的默认 fetch 实现不能很好地配合。看来 Gemini 库使用的是默认的 fetch 而不是第三方的 fetch 实现，这导致了模拟失败。经过多次尝试没有成功后，我切换到另一个名为MSW（Mock Service Worker）的库。尽管创建模拟服务器需要更多的设置，但第一次尝试时它工作得非常完美。我根据 Gemini API 的响应方式制作了一个示例响应，这使我能够测试重构的功能。

以下是模拟服务器的设置方式以供参考：

npm install --save-dev jest

您可以看到我正在模拟我用于应用程序的特定 API 端点。现在您所要做的就是添加以下内容以在测试时启动服务器：

export default {
  testPathIgnorePatterns: ["/node_modules/", "/examples"],
  transform: {},
};

反思这个过程，这对我来说是一次很好的学习经历。事后看来，我可能应该检查我正在使用的库的兼容性，并事先考虑任何潜在的问题。尽管面临挑战，我很高兴我的测试能够顺利进行。我期待将来添加更多测试并提高项目的整体稳定性。

以上是Jest 和 ESM 的测试问题以及解决方法的详细内容。更多信息请关注PHP中文网其他相关文章！