React Native单元测试报错：redux-persist: config.storage is required

App中配置redux-persist后运行正常，但执行默认单元测试时出现如下报错：

FAIL tests/App-test.tsx
● 测试套件运行失败

redux-persist: config.storage is required. Try using one of the provided storage engines `import storage from 'redux-persist/lib/storage'`

  10 | };
  11 |
> 12 | const loginReducer = persistCombineReducers(persistConfig, {
     |                      ^
  13 |   login: LoginReducer,
  14 | });
  15 |

  at persistReducer (node_modules/redux-persist/lib/persistReducer.js:39:32)
  at persistCombineReducers (node_modules/redux-persist/lib/persistCombineReducers.js:17:10)
  at Object.<anonymous> (src/redux/store/store.ts:12:22)
  at Object.<anonymous> (App.tsx:6:1)

我的Store配置 #

import {configureStore} from '@reduxjs/toolkit';
import {LoginReducer} from '../reducers/Reducers';
import {persistCombineReducers} from 'redux-persist';
import AsyncStorage from '@react-native-async-storage/async-storage';

const persistConfig = {
  key: 'login',
  version: 1,
  storage: AsyncStorage,
};

const loginReducer = persistCombineReducers(persistConfig, {
  login: LoginReducer,
});

const store = configureStore({
  reducer: {
    login: loginReducer,
  },
  middleware: getDefaultMiddleware =>
    getDefaultMiddleware({serializableCheck: false}),
});

依赖版本 #

"@react-native-async-storage/async-storage": "^1.17.10",
"redux-persist": "^6.0.0",
"@reduxjs/toolkit": "^1.8.5",
"react": "18.1.0",
"react-native": "0.70.1",
"react-redux": "^8.0.4",
"jest": "25.x.x"

解决方案 #

1. Mock AsyncStorage（测试环境专用） #

Jest运行在Node环境中，@react-native-async-storage/async-storage无法在测试环境自动初始化，导致storage参数为undefined。直接使用官方提供的Mock包即可解决：

在测试文件（如tests/App-test.tsx）顶部添加：

import AsyncStorage from '@react-native-async-storage/async-storage';
jest.mock('@react-native-async-storage/async-storage', () =>
  require('@react-native-async-storage/async-storage/jest/async-storage-mock')
);

如果要全局生效，创建jest.setup.js文件并添加上述代码，然后在jest.config.js中配置：

module.exports = {
  preset: 'react-native',
  setupFilesAfterEnv: ['./jest.setup.js'],
};

2. 给Store配置添加测试环境兜底 #

在store.ts中判断环境，测试环境使用redux-persist的内存存储替代AsyncStorage：

import {configureStore} from '@reduxjs/toolkit';
import {LoginReducer} from '../reducers/Reducers';
import {persistCombineReducers} from 'redux-persist';
import AsyncStorage from '@react-native-async-storage/async-storage';
import createMemoryStorage from 'redux-persist/lib/storage/memory';

const persistConfig = {
  key: 'login',
  version: 1,
  storage: process.env.NODE_ENV === 'test' ? createMemoryStorage() : AsyncStorage,
};

const loginReducer = persistCombineReducers(persistConfig, {
  login: LoginReducer,
});

const store = configureStore({
  reducer: {
    login: loginReducer,
  },
  middleware: getDefaultMiddleware =>
    getDefaultMiddleware({serializableCheck: false}),
});

3. 检查Jest基础配置 #

确保jest.config.js中正确使用react-native预设，避免模块解析问题：

module.exports = {
  preset: 'react-native',
};

内容的提问来源于stack exchange，提问作者Hiram Estrada Barrios