react-native-async-storage / async-storage

An asynchronous, persistent, key-value storage system for React Native.
https://react-native-async-storage.github.io/async-storage/
MIT License
4.75k stars 467 forks source link

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

Closed Shaaz-Techolution closed 1 month ago

Shaaz-Techolution commented 11 months ago

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

Screenshot 2023-12-07 at 7 07 54 PM Screenshot 2023-12-07 at 7 08 03 PM

Version

^1.21.0

What platforms are you seeing this issue on?

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 commented 11 months ago

Have you seen jest integration docs?

abmaurya07 commented 11 months ago

Any Update on this issue?

berlin-joseph commented 10 months ago

How to fix this issue ?

Owais-Ramaera commented 9 months ago

Any Progress. Still facing this issue @krizzu

hughmancoder commented 9 months ago

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:

github-actions[bot] commented 7 months ago

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 commented 7 months ago

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 commented 6 months ago

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 commented 4 months ago

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 commented 3 months ago

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.

github-actions[bot] commented 1 month ago

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.