Migrate Enzyme tests to React Native Testing Library for Sheet compon…

…ents

app/component-library/components/Sheet/SheetBottom/SheetBottom.test.tsx

@@ -1,35 +1,11 @@
 // Third party dependencies.
 import React from 'react';
-import { shallow } from 'enzyme';
+import { render, screen } from '@testing-library/react-native';
 import { Platform, View } from 'react-native';
 
 // Internal dependencies.
 import SheetBottom from './SheetBottom';
 
-jest.mock('react-native-safe-area-context', () => {
-  // using disting digits for mock rects to make sure they are not mixed up
-  const inset = { top: 1, right: 2, bottom: 3, left: 4 };
-  const frame = { width: 5, height: 6, x: 7, y: 8 };
-  return {
-    SafeAreaProvider: jest.fn().mockImplementation(({ children }) => children),
-    SafeAreaConsumer: jest
-      .fn()
-      .mockImplementation(({ children }) => children(inset)),
-    useSafeAreaInsets: jest.fn().mockImplementation(() => inset),
-    useSafeAreaFrame: jest.fn().mockImplementation(() => frame),
-  };
-});
-
-jest.mock('@react-navigation/native', () => {
-  const actualNav = jest.requireActual('@react-navigation/native');
-  return {
-    ...actualNav,
-    useNavigation: () => ({
-      navigate: jest.fn(),
-    }),
-  };
-});
-
 describe('SheetBottom', () => {
   enum PlatformEnum {
     iOS = 'ios',
@@ -38,11 +14,11 @@ describe('SheetBottom', () => {
   const platforms = [PlatformEnum.iOS, PlatformEnum.Android];
   test.each(platforms)('should render correctly on %s', (platform) => {
     Platform.OS = platform;
-    const wrapper = shallow(
+    render(
       <SheetBottom>
         <View />
       </SheetBottom>,
     );
-    expect(wrapper).toMatchSnapshot(platform);
+    expect(screen.toJSON()).toMatchSnapshot(platform);
   });
 });

app/component-library/components/Sheet/SheetHeader/SheetHeader.test.tsx

@@ -1,6 +1,6 @@
 // Third party dependencies.
 import React from 'react';
-import { shallow } from 'enzyme';
+import { render, screen } from '@testing-library/react-native';
 
 // Internal dependencies.
 import SheetHeader from './SheetHeader';
@@ -11,28 +11,24 @@ import {
 
 describe('SheetHeader', () => {
   it('should render correctly', () => {
-    const wrapper = shallow(<SheetHeader title={'Title'} />);
-    expect(wrapper).toMatchSnapshot();
+    render(<SheetHeader title={'Title'} />);
+    expect(screen.toJSON()).toMatchSnapshot();
   });
 
   it('should render back button', () => {
-    const wrapper = shallow(<SheetHeader onBack={jest.fn} title={'Title'} />);
-    const backButton = wrapper.findWhere(
-      (node) => node.prop('testID') === SHEET_HEADER_BACK_BUTTON_ID,
-    );
-    expect(backButton.exists()).toBe(true);
+    render(<SheetHeader onBack={jest.fn} title={'Title'} />);
+    const backButton = screen.getByTestId(SHEET_HEADER_BACK_BUTTON_ID);
+    expect(backButton).toBeTruthy();
   });
 
   it('should render action button', () => {
-    const wrapper = shallow(
+    render(
       <SheetHeader
         title={'Title'}
         actionButtonOptions={{ label: 'Action', onPress: jest.fn }}
       />,
     );
-    const actionButton = wrapper.findWhere(
-      (node) => node.prop('testID') === SHEET_HEADER_ACTION_BUTTON_ID,
-    );
-    expect(actionButton.exists()).toBe(true);
+    const actionButton = screen.getByTestId(SHEET_HEADER_ACTION_BUTTON_ID);
+    expect(actionButton).toBeTruthy();
   });
 });