GeekyAnts / GeekyAnts/NativeBase
`React.createElement: type is invalid` when running tests
- Dominant language
- TypeScript
- Stars
- 20.4k
- Forks
- 2.4k
- PR merge metrics
- No merged PRs in 30d
Description
### Description
Jest tests with @testing-library/react-native are failing with an error
### CodeSandbox/Snack link
N/A
### Steps to reproduce
I am getting the following error when attempting to render a component in a jest test:
```
console.error
Warning: React.createElement: 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.
Check the render method of `NativeBaseProvider`.
at NativeBaseProvider (/node_modules/native-base/lib/commonjs/core/NativeBaseProvider.tsx:51:9)
console.error
The above error occurred in the component:
at Provider (/node_modules/native-base/lib/commonjs/utils/createContext.tsx:9:11)
at NativeBaseProvider (/node_modules/native-base/lib/commonjs/core/NativeBaseProvider.tsx:51:9)
```
Here is how I have setup the test:
`Component.test.tsx`
```
import { NativeBaseProvider, Text } from "native-base";
import React from "react";
import { render } from "@testing-library/react-native";
import { theme } from "../theme";
const inset = {
frame: { x: 0, y: 0, width: 0, height: 0 },
insets: { top: 0, left: 0, right: 0, bottom: 0 },
};
describe("Text Component", () => {
test(`it should render`, () => {
const { toJSON } = render(
test!
);
expect(toJSON()).toMatchSnapshot();
});
});
```
`package.json`
```
"@testing-library/react": "^11.0.0",
"@testing-library/react-native": "^8.0.0",
"native-base": "^3.4.4",
"jest": "^26.6.0",
"react": "17.0.2",
"react-dom": "17.0.2",
"react-native": "0.68.2",
"react-native-linear-gradient": "^2.6.2",
"react-native-svg": "^12.4.4",
```
`jest.config.js`
```
module.exports = {
preset: "react-native",
transformIgnorePatterns: [
"node_modules/(?!(jest-)?@react-native|react-native|react-clone-referenced-element|@react-native-firebase|@react-native-community|expo(nent)?|@expo(nent)?/.*|react-navigation|@react-navigation/.*|@unimodules/.*|unimodules|sentry-expo|native-base|@sentry/.*)",
],
verbose: true,
};
```
### NativeBase Version
3.4.4
### Platform
- [x] Android
- [ ] CRA
- [ ] Expo
- [x] iOS
- [ ] Next
### Other Platform
_No response_
### Additional Information
I have tried upgrading, `@testing-library/react-native`, `jest` and using `ts-jest` and that did not solve the issue.
Contributor guide
Assessment
This issue has not been assessed yet.