● Test suite failed to run [@RNC/AsyncStorage]: NativeModule: AsyncStorage is null.

[Shaaz-Techolution]

What happened?

I am trying to run unit test in my react native file and I am getting this error. I tried a lot of things available on the internet still nothing worked for me. I have been Stuck on this for more than 2 weeks now. Any Help would be highly appreciated.

This is my jest.config.js file module.exports = { preset: 'react-native', transform: { '^.+\\.jsx$': 'babel-jest', }, transformIgnorePatterns: [ 'node_modules/(?!(jest-)?@?react-native|@react-native-community|@react-navigation|@react-native-community/async-storage|@react-native-async-storage)', ], moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'], testEnvironment: 'node', };

This is my package.json devDependencies: { "@babel/core": "^7.20.0", "@babel/preset-env": "^7.20.0", "@babel/runtime": "^7.20.0", "@react-native/eslint-config": "^0.72.2", "@react-native/metro-config": "^0.72.11", "@testing-library/react-native": "^12.3.2", "@tsconfig/react-native": "^3.0.0", "@types/jest": "^29.5.8", "@types/react": "^18.2.33", "@types/react-native": "^0.72.6", "@types/react-test-renderer": "^18.0.5", "babel-jest": "^29.2.1", "eslint": "^8.51.0", "jest": "^29.7.0", "metro-react-native-babel-preset": "0.76.8", "prettier": "^2.4.1", "react-test-renderer": "18.2.0", "sonarqube-scanner": "^3.1.0", "ts-jest": "^29.1.1", "typescript": "4.8.4" }

This is the error that I am getting

Version

^1.21.0

What platforms are you seeing this issue on?

• [X] Android
• [X] iOS
• [ ] macOS
• [ ] Windows
• [ ] web

System Information

I am running 'npm test" in my terminal , but the test case fail for me.
The error that I am getting is

Test suite failed to run

    [@RNC/AsyncStorage]: NativeModule: AsyncStorage is null.

    To fix this issue try these steps:

      • Uninstall, rebuild and restart the app.

      • Run the packager with `--reset-cache` flag.

      • If you are using CocoaPods on iOS, run `pod install` in the `ios` directory, then rebuild and re-run the app.

      • Make sure your project's `package.json` depends on `@react-native-async-storage/async-storage`, even if you only depend on it indirectly through other dependencies. CLI only autolinks native modules found in your `package.json`.

      • If this happens while testing with Jest, check out how to integrate AsyncStorage here: https://react-native-async-storage.github.io/async-storage/docs/advanced/jest

    If none of these fix the issue, please open an issue on the GitHub repository: https://github.com/react-native-async-storage/async-storage/issues

    > 1 | import AsyncStorage from '@react-native-async-storage/async-storage';
        | ^
      2 |
      3 | export const setAsyncStoreValue = async (key, value) => {
      4 |   if (!!value) {

      at Object.<anonymous> (node_modules/@react-native-async-storage/async-storage/lib/commonjs/AsyncStorage.native.ts:23:9)
      at Object.require (node_modules/@react-native-async-storage/async-storage/lib/commonjs/index.ts:1:1)
      at Object.require (src/utils/asyncStorage.js:1:1)
      at Object.require (src/utils/axios.js:9:1)
      at Object.require (src/redux/slice/accounts/accountSlice.ts:4:1)
      at Object.require (src/components/header/Header.tsx:17:1)
      at Object.require (src/screens/fundAccount/fundAccount.tsx:17:1)
      at Object.require (src/screens/fundAccount/__tests__/FundAccount.test.tsx:3:1)

Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        1.957 s

System Information
Device I am using - Macbook Pro 13 inch M1 Chip
OS - Sonoma
React Native version - 0.72.6

Steps to Reproduce

Run this command "npm test" and you get the issue

[krizzu]

Have you seen jest integration docs?

[abmaurya07]

Any Update on this issue?

[berlin-joseph]

How to fix this issue ?

[Owais-Ramaera]

Any Progress. Still facing this issue @krizzu

[hughmancoder]

I'm also facing this issue. And have tried all the listed steps (and I can't easily downgrade to an expo sdk < 50)

Log: Error: [@RNC/AsyncStorage]: NativeModule: AsyncStorage is null.

To fix this issue try these steps:

• Uninstall, rebuild and restart the app.

• Run the packager with --reset-cache flag.

• If you are using CocoaPods on iOS, run pod install in the ios directory, then rebuild and re-run the app.

• Make sure your project's package.json depends on @react-native-async-storage/async-storage, even if you only depend on it indirectly through other dependencies. CLI only autolinks native modules found in your package.json.

• If this happens while testing with Jest, check out how to integrate AsyncStorage here: https://react-native-async-storage.github.io/async-storage/docs/advanced/jest

If none of these fix the issue, please open an issue on the GitHub repository: https://github.com/react-native-async-storage/async-storage/issues , js engine: hermes ERROR Invariant Violation: "main" has not been registered. This can happen if:

• Metro (the local dev server) is run from the wrong folder. Check if Metro is running, stop it and restart it in the current project.
• A module failed to load due to an error and AppRegistry.registerComponent wasn't called., js engine: hermes

[github-actions[bot]]

This issue has been marked as stale due to inactivity. Please respond or otherwise resolve the issue within 7 days or it will be closed.

[jayfunk]

I just recently hit this issue. I did not work around it because it looks like it may have been an issue with different versions of async-storage being required by different packages. The number of dependencies I would have had to change was more than I wanted so I ended up downgrading the version of async-storage to one that matches with the versions declared by other packages. Maybe this helps to identify the issue in your own projects.

[bladerunner2020]

I use mocks directory from Jest integration instruction, but got error TypeError: Cannot read properties of undefined (reading 'getItem'). Fixed by changing mocked async-storage.js to

export * from '@react-native-async-storage/async-storage/jest/async-storage-mock';
// added the line below
export { default } from '@react-native-async-storage/async-storage/jest/async-storage-mock';

[patilrahul9923]

I am still facing this issue.

Error: [@RNC/AsyncStorage]: NativeModule: AsyncStorage is null.

in ios run.

I have tried everything but not solved my issue.

[gift56]

Fixing AsyncStorage Issue in Jest Tests

Issue

When running tests for the component, you may encounter the following error:

[@RNC/AsyncStorage]: NativeModule: AsyncStorage is null.

Solution

To resolve this issue, follow the steps below:

1. Install Dependencies:

   Ensure that @react-native-async-storage/async-storage is listed in your dependencies:

   
   npm install @react-native-async-storage/async-storage

2. Mock AsyncStorage in Jest:

   Create a setup file to mock AsyncStorage for Jest.

   Create a file named jest.setup.js in the root of your project:

   // jest.setup.js

   
   import mockAsyncStorage from "@react-native-async-storage/async-storage/jest/async-storage-mock";
   
    jest.mock("@react-native-async-storage/async-storage", () => mockAsyncStorage);
   
    Ensure the setup file is included in your Jest configuration in package.json:
   
     ```bash
    "jest": {
       "preset": "jest-expo",
       "setupFiles": ["./jest.setup.js"],
        "transformIgnorePatterns": [
           "node_modules/(?!((jest-)?react-native|@react-native(-community)?)|expo(nent)?|@expo(nent)?/.*|@expo-google- 
               fonts/.*|react-navigation|@react-navigation/.*|@unimodules/.*|unimodules|sentry-expo|native-base|react-native- 
               svg|react-native-reanimated|react-native-gesture-handler|@react-native-async-storage/async-storage|@react-native- 
               async-storage/async-storage/jest/async-storage-mock)"
            ]
   }

3. Run test

   
       npx jest {COMPONENT_NAME}.test.tsx -t "renders correctly with given props"

Summary

 By mocking AsyncStorage in Jest, you can resolve the issue of AsyncStorage being null during test runs. Follow the steps to 
  set up the mock and include it in your Jest configuration.

  ```bash

Save this content to a file named README.md in your project directory. This provides a clear, step-by-step guide to resolving the AsyncStorage issue in your Jest tests.