React+Mobx应用中如何用Jest toThrow()测试catalogStore异常抛出？

在React+Mobx应用里，我们需要验证catalogStore的loadProducts方法在数据获取失败时是否会正确抛出异常。下面是整理并补全后的测试代码，已经模拟了catalogService.get函数使其强制拒绝：

import catalogStore from './path-to-your-catalogStore';
import catalogService from './path-to-your-catalogService';

// 模拟catalogService模块，避免依赖真实API请求
jest.mock('./path-to-your-catalogService', () => ({
  get: jest.fn()
}));

describe("catalogStore", () => {
  describe("if the catalog fails to get the data", () => {
    beforeAll(() => {
      // 让get方法返回拒绝状态的Promise，模拟请求失败场景
      catalogService.get.mockRejectedValue(new Error('Failed to fetch products'));
    });

    it("should throw an error when loading products fails", async () => {
      const store = new catalogStore();
      
      // 断言异步方法会抛出指定异常
      await expect(store.loadProducts()).rejects.toThrow('Failed to fetch products');
    });
  });
});

关键细节说明： #

• 用jest.mock提前模拟catalogService，确保测试完全隔离，不依赖真实后端服务
• 在beforeAll钩子中通过mockRejectedValue构造失败场景，让数据获取函数强制拒绝
• 使用async/await配合expect(...).rejects.toThrow，这是测试异步函数异常的标准写法，能准确捕获并验证抛出的错误信息

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