jest自动化测试快速模拟请求返回

遇到的问题

项目中请求，在自动化测试时每个测试用例都需要重复写请求模拟。具体如下：

1、项目请求目录结构

 

2、测试用例🌰

import React from 'react';
import { render, waitFor, act, screen, fireEvent } from '@testing-library/react';
import Category from '@views/xxx/category';
import '@testing-library/jest-dom/extend-expect';
import * as MockData from './mockData';

jest.mock('@services/xxx/xxx', () => ({
  queryPage: () => Promise.resolve(MockData.queryPages),
  delete: () => Promise.resolve(MockData.queryPages),
  add: () => Promise.resolve(MockData.queryPages),
}));

describe('Category View', () => {
  test('render', async () => {
    render(
        <Category />
    );
    await waitFor(() =>
      expect(screen.getByText('xxx')).toBeInTheDocument(),
    );
  });
});

观察上面请求目录文件夹不难发现请求文件之多，如果每个测试用例都像上面用例一样的写法，每个接口都需要手动去写mock实现，重复的劳动过多。

解决方案

基于上述问决定充分利用jest配置，比如 setupFiles ，把请求mock统一一起，然后使用setupFiles引入文件。如下：

<rootDir>/jest/services/web/test.js文件

jest.mock('@services/web/test', () => ({
  query: jest.fn().mockImplementation(() => Promise.resolve()),
  recordArchivesOperation: jest.fn().mockImplementation(() => Promise.resolve()),
  detail: jest.fn().mockImplementation(() => Promise.resolve()),
  files: jest.fn().mockImplementation(() => Promise.resolve()),
  search: jest.fn().mockImplementation(() => Promise.resolve()),
  downloadXml: jest.fn().mockImplementation(() => Promise.resolve()),
  downloadZIP: jest.fn().mockImplementation(() => Promise.resolve()),
  queryAcceptFiles: jest.fn().mockImplementation(() => Promise.resolve()),
  arcOffShelf: jest.fn().mockImplementation(() => Promise.resolve()),
  getToBorrow: jest.fn().mockImplementation(() => Promise.resolve()),
  getFiles: jest.fn().mockImplementation(() => Promise.resolve()),
}));

jest.config.js 

/*
 * For a detailed explanation regarding each configuration property, visit:
 * https://jestjs.io/docs/en/configuration.html
 */

module.exports = {
  ....
  setupFiles: ['<rootDir>/jest/services/web/test.js', 'jest-canvas-mock'],
 ....
};

 使用此方法测试用例中就不需要在去模拟请求，当然使用setupFiles会增加性能问题，为了少写代码测试性能忽略。继续偷懒mock文件可使用node开发自动写入程序，增加接口自动更新<rootDir>/jest/services/web/test.js