Jest测试AsyncStorage报错：Cannot read properties of undefined (reading 'getItem')

核心问题定位 #

你遇到的报错是因为Jest没有正确加载AsyncStorage的mock，导致测试时调用的是未初始化的实例。以下是针对性的排查和解决步骤：

1. 检查Mock文件的路径与命名 #

• 必须保证__mocks__目录与node_modules同级，不能放在src或其他子目录下，Jest只会识别根目录下的__mocks__。
• Mock文件名要与包名完全对应：你需要创建__mocks__/@react-native-async-storage/async-storage.js（注意是嵌套目录，对应包的完整路径），而不是单独的async-storage.js。文件内容保持不变：

  export * from "@react-native-async-storage/async-storage/jest/async-storage-mock";
  

2. 强制指定Jest的Mock映射 #

打开项目的jest.config.js（或package.json中的jest配置段），添加手动映射规则，确保Jest优先使用你的mock文件：

module.exports = {
  // 其他配置...
  moduleNameMapper: {
    '@react-native-async-storage/async-storage': '<rootDir>/__mocks__/@react-native-async-storage/async-storage.js'
  }
};

3. 在测试文件中手动确认Mock生效 #

在测试代码开头添加手动mock声明，并提前设置返回值，避免依赖全局配置的不确定性：

import AsyncStorage from '@react-native-async-storage/async-storage';
// 强制Jest加载mock
jest.mock('@react-native-async-storage/async-storage');

beforeEach(() => {
  // 重置mock并预设测试数据
  jest.clearAllMocks();
  AsyncStorage.getItem.mockResolvedValue('你的测试存储值');
});

4. 检查业务代码的导入方式 #

确保页面代码中是直接导入官方包：

// 正确
import AsyncStorage from '@react-native-async-storage/async-storage';

// 如果用了自定义封装层，要确保封装层依赖的是官方包，而非其他未被mock的实例
import storage from '../utils/storage'; // 需确认该封装内部使用的是@react-native-async-storage/async-storage

5. 验证Mock是否生效 #

在测试用例中打印AsyncStorage实例，判断是否为Jest的mock函数：

test('验证mock是否加载', () => {
  console.log(AsyncStorage.getItem); // 输出应为`jest.fn()`，说明mock生效
});

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