1. 环境准备

　　要在项目中使用 TypeScript 和 Jest，首先确保你已安装以下工具：

　　·Node.js（建议使用 v16 或更高版本）

　　· npm 或 yarn

　　· TypeScript（建议使用最新版）

　　确认安装：

1. node -v

2. 　　npm -v

2. 配置项目

　　2.1 初始化项目

　　创建一个新的 Node.js 项目并初始化：

1. 　mkdir ts-jest-example

2. 　　cd ts-jest-example

3. 　　npm init -y

2.2 配置 TypeScript

　　安装 TypeScript 及相关工具：

npm install typescript @types/node --save-dev

初始化 TypeScript 配置：

　npx tsc --init

修改 tsconfig.json 配置，确保开启以下选项：

1. 　　{

2. 　　 "compilerOptions": {

3. 　　 "target": "ES2017",

4. 　　 "module": "commonjs",

5. 　　 "strict": true,

6. 　　 "esModuleInterop": true,

7. 　　 "outDir": "./dist",

8. 　　 "rootDir": "./src"

9. 　　 }

10. 　　}

创建 src 文件夹，用于存放代码和测试。

　　2.3 安装 Jest 及相关依赖

　　安装 Jest 和 TypeScript 支持插件：

　npm install jest ts-jest @types/jest --save-dev

初始化 Jest 配置：

npx ts-jest config:init

此命令会生成一个 jest.config.js 文件，配置示例如下：

1. 　module.exports = {

2. 　　 preset: 'ts-jest',

3. 　　 testEnvironment: 'node',

4. 　　 rootDir: 'src',

5. 　　};

3. 编写测试

　　以下以一个简单的函数为例，展示如何编写和测试代码。

　　3.1 编写简单的测试用例

　　创建文件 src/utils.ts：

1. 　// utils.ts

2. 　　export const sum = (a: number, b: number): number => {

3. 　　 return a + b;

4. 　　};

　为 sum 函数编写测试，创建文件 src/utils.test.ts：

1. 　// utils.test.ts

2. 　　import { sum } from './utils';

3. 　　test('adds 1 + 2 to equal 3', () => {

4. 　　 expect(sum(1, 2)).toBe(3);

5. 　　});

运行测试：

　　npx jest

　　输出结果：

1. 　PASS src/utils.test.ts

2. 　　√ adds 1 + 2 to equal 3 (5 ms)

3.2 测试异步代码

　　创建一个异步函数 src/asyncUtils.ts：

1. 　// asyncUtils.ts

2. 　　export const fetchData = async (): Promise<string> => {

3. 　　 return new Promise((resolve) => {

4. 　　 setTimeout(() => resolve('Hello, Jest!'), 1000);

5. 　　 });

6. 　　};

编写测试文件 src/asyncUtils.test.ts：

1. 　// asyncUtils.test.ts

2. 　　import { fetchData } from './asyncUtils';

3. 　　test('fetchData returns correct data', async () => {

4. 　　 const data = await fetchData();

5. 　　 expect(data).toBe('Hello, Jest!');

6. 　　});

运行测试：

　　npx jest

　3.3 测试接口调用（Mock 示例）

　　编写一个调用接口的函数 src/api.ts：

1. // api.ts

2. 　　import axios from 'axios';

3. 　　export const getUser = async (id: number): Promise<any> => {

4. 　　 const response = await axios.get(`https://jsonplaceholder.typicode.com/users/${id}`);

5. 　　 return response.data;

6. 　　};

为 getUser 函数编写测试，使用 Jest Mock：

1. 　// api.test.ts

2. 　　import { getUser } from './api';

3. 　　import axios from 'axios';

4. 　　// Mock axios

5. 　　jest.mock('axios');

6. 　　const mockedAxios = axios as jest.Mocked<typeof axios>;

7. 　　test('fetches user data', async () => {

8. 　　 const mockUser = { id: 1, name: 'John Doe' };

9. 　　 mockedAxios.get.mockResolvedValueOnce({ data: mockUser });

10. 　　 const user = await getUser(1);

11. 　　 expect(user).toEqual(mockUser);

12. 　　 expect(mockedAxios.get).toHaveBeenCalledWith('https://jsonplaceholder.typicode.com/users/1');

13. 　　});

运行测试并验证 Mock 功能。

　　4. 运行与调试

　　运行所有测试：

　npx jest

运行单个测试文件：

　npx jest src/utils.test.ts

在调试工具中运行测试（如 VSCode 的调试功能）：

　　在项目根目录创建 launch.json 文件。

　　配置如下：

1. 　{

2. 　　 "version": "0.2.0",

3. 　　 "configurations": [

4. 　　 {

5. 　　 "type": "node",

6. 　　 "request": "launch",

7. 　　 "name": "Debug Jest Tests",

8. 　　 "program": "${workspaceFolder}/node_modules/.bin/jest",

9. 　　 "args": ["--runInBand"],

10. 　　 "console": "integratedTerminal",

11. 　　 "internalConsoleOptions": "neverOpen"

12. 　　 }

13. 　　 ]

14. 　　}

　选择配置并开始调试。

　　5. 最佳实践

　　目录结构建议：

　　src：主代码文件夹。

　　tests：测试文件夹（可选，适用于大型项目）。

　　命名规范：

　　测试文件以 .test.ts 或 .spec.ts 结尾。

　　与被测试文件放在同一目录下或单独维护测试目录。

　　使用 Mock 减少依赖：

　　对于外部接口、数据库等不易直接测试的部分，使用 Jest Mock 减少测试依赖。

　　确保代码覆盖率：

　　添加覆盖率报告：

　npx jest --coverage

　6. 总结

　　通过结合 TypeScript 和 Jest，你可以实现类型安全、高质量的单元测试流程。Jest 提供了强大的 Mock 功能和丰富的测试工具，能有效提升开发效率。希望本文的指南和示例能帮助你更好地掌握 Jest 和 TypeScript 的测试方法！

感谢每一个认真阅读我文章的人，礼尚往来总是要有的，虽然不是什么很值钱的东西，如果你用得到的话可以直接拿走：

这些资料，对于【软件测试】的朋友来说应该是最全面最完整的备战仓库，这个仓库也陪伴上万个测试工程师们走过最艰难的路程，希望也能帮助到你!有需要的小伙伴可以点击下方小卡片领取