TypeScript编写VS Code扩展：Mocha框架下Axios调用Mock示例

直接用axios-mock-adapter就能轻松在Mocha里Mock Axios调用，这个库专门为Axios设计，和Mocha、TypeScript兼容良好，完全不需要切换到Jest。

步骤1：安装依赖 #

npm install axios-mock-adapter --save-dev

这个库自带TypeScript类型定义，无需额外安装@types包。

步骤2：业务代码示例（待测试的Axios调用逻辑） #

假设你的业务代码在api.ts中：

import axios from 'axios';

export async function fetchRemoteData(apiUrl: string) {
  try {
    const response = await axios.get(apiUrl);
    return response.data;
  } catch (error) {
    // 自定义错误处理逻辑
    throw error;
  }
}

步骤3：Mocha测试用例（Mock Axios） #

创建api.test.ts，结合Chai断言库编写测试：

import { expect } from 'chai';
import axios from 'axios';
import MockAdapter from 'axios-mock-adapter';
import { fetchRemoteData } from './api';

describe('Axios调用测试', () => {
  let mockAdapter: MockAdapter;

  // 每个测试前初始化Mock
  beforeEach(() => {
    mockAdapter = new MockAdapter(axios);
  });

  // 每个测试后清理Mock，避免影响其他测试
  afterEach(() => {
    mockAdapter.restore();
  });

  it('成功请求时返回Mock数据', async () => {
    const targetUrl = 'https://your-api-endpoint.com/data';
    const mockResponse = { code: 200, data: [{ id: 1, content: '测试内容' }] };

    // 配置Mock：匹配GET请求的URL，返回预设响应
    mockAdapter.onGet(targetUrl).reply(200, mockResponse);

    const result = await fetchRemoteData(targetUrl);
    // 断言返回数据与Mock一致
    expect(result).to.deep.equal(mockResponse);
    // 验证请求确实被触发过
    expect(mockAdapter.history.get.length).to.equal(1);
    expect(mockAdapter.history.get[0].url).to.equal(targetUrl);
  });

  it('请求失败时正确抛出错误', async () => {
    const targetUrl = 'https://your-api-endpoint.com/data';
    const errorMsg = '服务器内部错误';

    // 配置Mock返回500错误
    mockAdapter.onGet(targetUrl).reply(500, { error: errorMsg });

    try {
      await fetchRemoteData(targetUrl);
      // 如果执行到这里，说明测试失败（应该抛出错误）
      expect.fail('预期fetchRemoteData会抛出错误');
    } catch (err: any) {
      // 断言错误响应的状态码和信息
      expect(err.response?.status).to.equal(500);
      expect(err.response?.data.error).to.equal(errorMsg);
    }
  });
});

关于代码覆盖率 #

用c8生成覆盖率报告时，只要测试用例覆盖了业务代码中Axios调用的分支（成功、失败、异常处理等），c8就会自动统计这部分代码的执行情况。Mock工具只是替代了真实HTTP请求，但业务代码里的Axios调用逻辑依然会被执行，不会影响覆盖率统计。

内容的提问来源于stack exchange，提问作者tuck1s