Type error when run jest test

[trungdeveloper]

Description

Throw error when running jest

CodeSandbox/Snack link

no

Steps to reproduce

I got these errors when run yarn test
`● Test suite failed to run

node_modules/native-base/src/hooks/useThemeProps/useProps.tsx:1:17 - error TS7016: Could not find a declaration file for module 'lodash.get'. 'F:/deal_platform_mobile/node_modules/lodash.get/index.js' implicitly has an 'any' type.
  Try `npm i --save-dev @types/lodash.get` if it exists or add a new declaration (.d.ts) file containing `declare module 'lodash.get';`

1 import get from 'lodash.get';
                  ~~~~~~~~~~~~
node_modules/native-base/src/hooks/useThemeProps/useProps.tsx:2:18 - error TS7016: Could not find a declaration file for module 'lodash.omit'. 'F:/deal_platform_mobile/node_modules/lodash.omit/index.js' implicitly has an 'any' type.
  Try `npm i --save-dev @types/lodash.omit` if it exists or add a new declaration (.d.ts) file containing `declare module 'lodash.omit';`

2 import omit from 'lodash.omit';`

My jest.config.js:
`const { defaults: jsDefault } = require('ts-jest/presets');

/** @type {import('ts-jest').JestConfigWithTsJest} /
module.exports = {
...jsDefault,
preset: 'react-native',
testEnvironment: 'node',
setupFiles: ['./node_modules/react-native-gesture-handler/jestSetup.js'],
setupFilesAfterEnv: ['@testing-library/jest-native/extend-expect'],
transform: {
'^.+\.jsx$': 'babel-jest',
'^.+\.tsx?$': [
'ts-jest',
{
tsconfig: 'tsconfig.json',
babelConfig: 'babel.config.json',
},
],
},
transformIgnorePatterns: [
'node_modules/(?!((jest-)?react-native(-.)?|@react-native(-community)?|native-base)/)',
],
moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
};`

Babel.config.json:
{ "presets": ["module:metro-react-native-babel-preset"], "plugins": [ [ "module-resolver", { "root": ["./src"], "extensions": [".ts", ".tsx", ".js", ".json"], "alias": { "@screens": "./src/screens", "@routes": "./src/routes", "@components": "./src/components", "@hooks": "./src/hooks", "@utils": "./src/utils", "@contexts": "./src/contexts", "@themes": "./src/themes", "@core": "./src/core", "@types": "./src/types", "@localization": "./src/localization", "@api": "./src/api", "@helper": "./src/helper", "@constants": "./src/constants", "@hoc": "./src/hoc", "@builder": "./src/builder" } } ], [ "module:react-native-dotenv", { "envName": "APP_ENV", "moduleName": "@env", "path": ".env" } ], "react-native-reanimated/plugin" ] }

tsconfig.json:
`// prettier-ignore
{
"extends": "@tsconfig/react-native/tsconfig.json", /* Recommended React Native TSConfig base /
"compilerOptions": {
"jsx": "react",
/ Visit https://aka.ms/tsconfig.json to read more about this file */

/* Completeness */
"skipLibCheck": true,
"baseUrl": "./src",
"paths": {
    "@screens": ["screens"],
    "@screens/*": ["screens/*"],
    "@routes": ["routes"],
    "@routes/*": ["routes/*"],
    "@components": ["components"],
    "@components/*": ["components/*"],
    "@hooks": ["hooks"],
    "@hooks/*": ["hooks/*"],
    "@utils": ["utils"],
    "@utils/*": ["utils/*"],
    "@contexts": ["contexts"],
    "@contexts/*": ["contexts/*"],
    "@themes": ["themes"],
    "@themes/*": ["themes/*"],
    "@core": ["core"],
    "@core/*": ["core/*"],
    "@types": ["types"],
    "@types/*": ["types/*"],
    "@localization": ["localization"],
    "@localization/*": ["localization/*"],
    "@api": ["api"],
    "@api/*": ["api/*"],
    "@helper": ["helper"],
    "@helper/*": ["helper/*"],
    "@constants": ["constants"],
    "@constants/*": ["constants/*"],
    "@hoc": ["hoc"],
    "@hoc/*": ["hoc/*"],
    "@builder": ["builder"],
    "@builder/*": ["builder/*"]
}

}
}
`

My test file `import React from 'react';
import { render } from '../setupTests';
import AboutDeal from '@components/AboutDeal';

test('renders AboutDeal correctly', () => {
const { toJSON } = render();
expect(toJSON()).toMatchSnapshot();
});
setupTests.tsx:// setupTests.js
import '@testing-library/jest-native/extend-expect';
import { NativeBaseProvider } from 'native-base';
import { render, RenderOptions } from '@testing-library/react-native';
import React from 'react';
const inset = {
frame: { x: 0, y: 0, width: 0, height: 0 },
insets: { top: 0, left: 0, right: 0, bottom: 0 },
};
const AllTheProviders = ({ children }: { children: JSX.Element }) => {
return {children};
};

const customRender = (ui: React.ReactElement, options?: RenderOptions) =>
render(ui, { wrapper: AllTheProviders, ...options });

export * from '@testing-library/react-native';

export { customRender as render };
`

CategoryList .tsx
`import { FlatList, ListRenderItemInfo, StyleSheet } from 'react-native';
import React from 'react';
import { CategoryItem, CategoryItemProps } from './CategoryItem';
import { Spacing, Colors } from '@themes';

export interface CategoryListProps {
list: CategoryItemProps[];
}

const CategoryList = ({ list = [] }: CategoryListProps) => {
const _renderItem = ({ item }: ListRenderItemInfo) => {
return <CategoryItem {...item} style={styles.item} />;
};

const _keyExtractor = (item: CategoryItemProps) =>
    `CATEGORY_ITEM_${item.iconName}_${item.title}`;

return (
    <FlatList
        data={list}
        renderItem={_renderItem}
        keyExtractor={_keyExtractor}
        horizontal
        style={styles.container}
    />
);

};

export { CategoryList };

const styles = StyleSheet.create({
container: {
backgroundColor: Colors.secondary,
width: '100%',
padding: Spacing.S,
},
item: {
marginRight: Spacing.S,
},
});
`

NativeBase Version

3.4.28

Platform

• Android
• CRA
• Expo
• iOS
• Next

Other Platform

No response

Additional Information

No response