How to test Async Storage with Jest?

Question

I\'m building an app with React Native. I want to minimize how often I communicate to the database, so I make heavy use of AsyncStorage. There\'s a lot of room for bugs in t

Answer 1

For everyone who sees this question in > 2019:

Since February 2019, AsyncStorage was moved to @react-native-community/async-storage, which causes this warning to appear if you're importing it from react-native:

Warning: Async Storage has been extracted from react-native core and will be removed in a future release.

The new module includes its own mock, so you don't have to worry about writing your own anymore.

Per the project's documentation, you can set it up in 2 different ways:

With mocks directory

• In your project root directory, create a __mocks__/@react-native-community directory.
• Inside that folder, create async-storage.js file.
• Inside that file, export Async Storage mock.

  export default from '@react-native-community/async-storage/jest/async-storage-mock'
  

  Jest should then mock AsyncStorage by default in all your tests. If it doesn't, try calling jest.mock(@react-native-community/async-storage) at the top of your test file.

With Jest setup file

• In your Jest config (probably in package.json or jest.config.js) add the setup file's location:

  "jest": {
    "setupFiles": ["./path/to/jestSetupFile.js"]
  }
  

• Inside your setup file, set up the AsyncStorage mock:

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

If you're using TypeScript, using the 2nd option (Jest setup file) is way easier, since with the 1st one (mocks directory) it won't associate @types/react-native-community__async-storage with the mock automatically.