#react-native #redux #asyncstorage
Вопрос:
Когда я пытаюсь проверить, правильно ли добавлен Кот в асинхронное хранилище, я получаю null. Как я могу это решить? В приложении все работает правильно. Я использую React Native, React-Native-Асинхронное хранилище, Redux Thunk и Redux Persist.
редуктор
export const INITIAL_STATE: CatsState = {
cats: [],
selectedCat: null
}
const catsReducer = (state = INITIAL_STATE, action: CatsAction): CatsState => {
switch (action.type) {
case CatsActionTypes.SET_CATS:
return { ...state, cats: action.payload }
case CatsActionTypes.SELECT_CAT:
return { ...state, selectedCat: action.payload }
default:
return state
}
}
Экшен
export const addCat = ({ cat }: AddCatData): ThunkAction<void, RootState, null, CatsAction> => {
return async (dispatch: Dispatch<CatsAction>) => {
try {
const response = await AsyncStorage.getItem(STORAGE_KEYS.cats)
const cats: Cat[] = response ? JSON.parse(response) : []
cats.push(cat)
await AsyncStorage.setItem(STORAGE_KEYS.cats, JSON.stringify(cats))
dispatch({ type: CatsActionTypes.SET_CATS, payload: cats })
} catch (error) {
console.log(error)
}
}
}
тест
beforeEach(async () => await AsyncStorage.clear())
describe('add cat', () => {
it('persist cat correctly into local storage', async () => {
const cat: Cat = {
id: '1',
name: 'Cat',
breed: 'Breed',
age: 1,
gender: 'male',
weight: 5,
size: 'Big',
color: 'Brown',
mood: 'Angry',
description: 'Cat description',
friendly: 3,
liked: true
}
addCat({ cat })
const response = await AsyncStorage.getItem(STORAGE_KEYS.cats)
const cats: Cat[] = JSON.parse(response)
const expectedArray = { cats: [cat] }
expect(cats).toStrictEqual(expectedArray)
})
})
Спасибо
Ответ №1:
Используйте react-native-async-storage
пакет официальной документации: https://react-native-async-storage.github.io/async-storage/docs/advanced/jest
обновленный:
Для вас, если вам нужно сделать несколько шагов:
#1 Издевайтесь над своими данными
const CAT_MOCK = {
id: '1',
name: 'Cat',
}
#2 Макет Хранилища
const STORAGE_MOCK = {
[STORAGE_KEYS.cats]: [CAT_MOCK]
}
#3 Макет библиотеки для вашего случая
jest.mock('@react-native-async-storage', () => ({
getItem: jest.fn((item) => {
return new Promise((resolve, reject) => {
resolve(STORAGE_MOCK[item]);
});
}),
}));
Комментарии:
1. Я уже сделал это и все еще не работаю
2. Хорошо, после макетной библиотеки вам нужно добавить макет для ваших случаев. Я приведу вам пример
3. Спасибо, но чего я не понимаю, так это части mockItems[item] =(
4. Извините, я обновил ответ. Используйте
STORAGE_MOCK[item]
вместо этогоmockItems[item]