如何使用Jest模拟navigator.userAgentData.platform？

Jest里可以直接修改全局navigator对象来模拟平台属性，完全满足你针对macOS/Windows的正负测试需求，具体实现如下：

基础模拟方式 #

在测试前的钩子或单个测试用例里，直接覆盖navigator.userAgentData的platform属性即可：

// 全局钩子，确保每个测试前都能重置模拟（可选）
beforeEach(() => {
  global.navigator = {
    ...global.navigator,
    userAgentData: {
      platform: 'macOS' // 默认模拟macOS环境
    }
  };
});

正负测试示例 #

正测试（macOS平台） #

test('macOS环境下不执行else分支逻辑', () => {
  global.navigator.userAgentData.platform = 'macOS';
  render(<MyComponent />);
  // 这里写你的断言：比如验证else里的操作没发生（比如某个DOM元素不存在、函数未被调用等）
});

负测试（非macOS平台） #

test('Windows环境下执行else分支逻辑', () => {
  global.navigator.userAgentData.platform = 'Windows';
  render(<MyComponent />);
  // 这里写你的断言：比如验证else里的操作已执行（比如某个DOM元素存在、函数被调用等）
});

处理边界场景 #

如果要模拟navigator.userAgentData不存在的旧浏览器环境，直接删除该属性即可：

test('userAgentData不存在时执行else分支逻辑', () => {
  delete global.navigator.userAgentData;
  render(<MyComponent />);
  // 编写对应断言
});

避免测试污染 #

为了防止不同测试用例的模拟互相干扰，建议在afterEach钩子中恢复原始navigator状态：

afterEach(() => {
  delete global.navigator.userAgentData;
  // 或者直接恢复成初始的window.navigator
  global.navigator = window.navigator;
});

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