Getting undefined when I'm trying to use a Provider in my tests

[Pelasua]

What version of React, ReactDOM/React Native, Redux, and React Redux are you using?

• React: 18.2.0
• ReactDOM/React Native: RN 0.71.7
• Redux: 4.2.1
• React Redux: 8.0.7

What is the current behavior?

I'm trying to do a test with a component that is using useDispatch of react-redux. Then I create a Provider wrapper in order to be able to use redux in my tests but an error appears saying:

console.error
  Warning: React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

  43 |   it('should render the component and handle the finish stop logic', async () => {
  44 |     const {getByText} = render(
> 45 |       <Provider store={store}>
     |       ^
  46 |         <FinishStop />
  47 |       </Provider>,
  48 |     );`

I have done a console.log of provider and the result is 'undefined' but the importation is right.

import {Provider} from 'react-redux';

I don't know if this is because of my config. Here you go my config files:

babel.config.js

module.exports = {
  presets: ['module:metro-react-native-babel-preset'],
  plugins: [
    [
      'module:react-native-dotenv',
      {
        moduleName: '@env',
        path: '.env',
        safe: false,
        allowUndefined: true,
        verbose: false,
      },
    ],
  ],
};

package.json

  {
    "name": "siportAndroidTablet",
    "version": "0.0.1",
    "private": true,
    "scripts": {
      "android": "react-native run-android",
      "android-dev": "cross-env NODE_ENV=development npx react-native run-android",
      "ios": "react-native run-ios",
      "lint": "eslint .",
      "start": "react-native start",
      "test": "jest"
    },
    "dependencies": {
      "@react-native-async-storage/async-storage": "^1.18.1",
      "@react-native-community/geolocation": "^3.0.6",
      "@reduxjs/toolkit": "^1.9.5",
      "axios": "^1.4.0",
      "dotenv-flow": "^3.2.0",
      "eslint-plugin-import": "^2.27.5",
      "eslint-plugin-simple-import-sort": "^10.0.0",
      "moment": "^2.29.4",
      "prop-types": "^15.8.1",
      "react": "18.2.0",
      "react-native": "0.71.7",
      "react-native-device-info": "^10.6.0",
      "react-native-dotenv": "^3.4.8",
      "react-native-imei": "^0.2.0",
      "react-native-maps": "^1.7.1",
      "react-native-paper": "^5.7.2",
      "react-native-safe-area-context": "^4.5.2",
      "react-native-vector-icons": "^9.2.0",
      "react-native-webview": "^12.0.2",
      "react-redux": "^8.0.7",
      "redux": "^4.2.1"
    },
    "devDependencies": {
      "@babel/core": "^7.22.1",
      "@babel/preset-env": "^7.22.4",
      "@babel/preset-flow": "^7.21.4",
      "@babel/preset-react": "^7.22.3",
      "@babel/preset-typescript": "^7.21.5",
      "@babel/runtime": "^7.20.0",
      "@react-native-community/eslint-config": "^3.2.0",
      "@testing-library/jest-dom": "^5.16.5",
      "@testing-library/react-native": "^12.1.2",
      "@tsconfig/react-native": "^2.0.2",
      "@types/jest": "^29.2.1",
      "@types/react": "^18.0.24",
      "@types/react-test-renderer": "^18.0.0",
      "babel-jest": "^29.5.0",
      "babel-plugin-module-resolver": "^5.0.0",
      "cross-env": "^7.0.3",
      "eslint": "^8.19.0",
      "jest": "^29.5.0",
      "metro-react-native-babel-preset": "0.73.9",
      "prettier": "^2.4.1",
      "prettier-eslint": "^15.0.1",
      "react-test-renderer": "18.2.0",
      "typescript": "4.8.4"
    },
    "jest": {
      "preset": "react-native",
      "transformIgnorePatterns": [
        "node_modules/(?!(jest-)?@?react-native|@react-native-community|@react-navigation/(.*))"
      ]
    }
  }

What is the expected behavior?

provider is undefined

Which browser and OS are affected by this issue?

No response

Did this work in previous versions of React Redux?

• Yes

[Pelasua]

I had a mock of redux that generated this problem.