After Upgrading NativeBase Unit Tests Fail to Render

[SirFitz]

Description

After upgrading Native Base to the latest version, Unit Tests fail to render and React is defined as being null

CodeSandbox/Snack link

private project

Steps to reproduce

I've added a basic setup below, by following the react-native testing library i've created a custom render function. However with the NativeBaseProvider component added I receive this error:

NativeBase Version

3.4.17

Platform

• [X] Android
• [ ] CRA
• [ ] Expo
• [X] iOS
• [ ] Next

Other Platform

No response

Additional Information

Utils

import { render, RenderOptions } from '@testing-library/react-native';
import 'jest-styled-components/native';
import React from 'react';
import { theme as lightTheme } from 'src/themes/index';
import { ThemeProvider } from 'styled-components/native';
import { NativeBaseProvider } from 'native-base';

const inset = {
  frame: { x: 0, y: 0, width: 0, height: 0 },
  insets: { top: 0, left: 0, right: 0, bottom: 0 },
};

const WithThemeProviders: React.FC = ({ children }) => {
  return (
    <NativeBaseProvider initialWindowMetrics={inset}>
      <ThemeProvider theme={lightTheme}>{children} </ThemeProvider>
    </NativeBaseProvider>
  );
};

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

// re-export everything
export * from '@testing-library/react-native';
// override render method
export { customRender as render };

Badge Test

import Bagde from '@components/atoms/Bagde';
import React from 'react';
import { render } from '__tests__/utils';

describe('[Atom] Bagde', () => {
  beforeEach(() => {
    jest.resetModules();
  });

  it('should render', () => {
    const { getByTestId } = render(<Bagde value="new" />);
    const text = getByTestId('badge-text');
    expect(text).toHaveTextContent('new');
  });

});

Badge

import React from 'react';
import { View, Text } from 'react-native';

interface Props {
  value: string;
}

const Badge: React.FC<Props> = ({ value }) => {
  return (
    <View style={{ backgroundColor: 'blue' }}>
      <Text>{value}</Text>
    </View>
  );
};

export default Badge;

[AshwiniKumar007]

Hey @SirFitz , Thanks for reporting. We will look into it