React项目如何Mock全局依赖的exampleSDK以解决单元测试报错？

方法一：Mock 整个 exampleSDK 模块（推荐） #

因为项目中几乎所有组件都导入了该SDK，直接Mock整个模块是最省心的方式，避免每个测试文件都处理window对象的问题。

假设组件中导入SDK的方式为：

import { ExampleHandler } from 'example-sdk';

在测试文件的顶部添加以下代码，Mock整个SDK的实现：

// Mock 整个SDK模块，返回组件需要的方法/类
jest.mock('example-sdk', () => ({
  // Mock ExampleHandler类，返回组件用到的实例方法
  ExampleHandler: jest.fn().mockImplementation(() => ({
    login: jest.fn().mockResolvedValue({ success: true }),
    logout: jest.fn(),
    // 按组件实际使用的方法添加
  })),
  // 如果SDK还有其他导出的方法/变量，也在这里Mock
  otherAuthMethod: jest.fn()
}));

这样组件导入的会是Mock后的SDK，不会执行原SDK的内部代码，自然就不会触发window.x.y的报错。

方法二：修复 window 对象的属性赋值 #

之前的尝试失败是因为window.x.y被设为空对象，而SDK需要它是一个带有prototype的构造函数。在测试前正确初始化window对象：

// 在所有测试前执行初始化
beforeAll(() => {
  // 给window.x.y设置为一个空构造函数，并添加prototype
  window.x = {
    y: function() {},
  };
  window.x.y.prototype = {};
});

// 或者使用Object.defineProperty（确保属性可写）
beforeAll(() => {
  Object.defineProperty(window, 'x', {
    value: {
      y: function() {},
    },
    writable: true,
    enumerable: true,
    configurable: true,
  });
  window.x.y.prototype = {};
});

这样SDK内部的Object.create(window.x.y.prototype)就能正常执行，不会抛出错误。

方法三：Mock 全局 SDK（如果是全局引入） #

如果SDK是通过<script>标签全局引入的（而非模块化导入），可以直接Mock全局变量：

beforeAll(() => {
  global.exampleSDK = {
    ExampleHandler: jest.fn().mockImplementation(() => ({
      // 组件用到的方法
    }))
  };
});

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