diff --git a/jest.config.js b/jest.config.js
index 441507af4228..5b36e44c7581 100644
--- a/jest.config.js
+++ b/jest.config.js
@@ -23,7 +23,7 @@ module.exports = {
     },
     testEnvironment: 'jsdom',
     setupFiles: ['<rootDir>/jest/setup.ts', './node_modules/@react-native-google-signin/google-signin/jest/build/setup.js'],
-    setupFilesAfterEnv: ['@testing-library/jest-native/extend-expect', '<rootDir>/jest/setupAfterEnv.ts', '<rootDir>/tests/perf-test/setupAfterEnv.js'],
+    setupFilesAfterEnv: ['<rootDir>/jest/setupAfterEnv.ts', '<rootDir>/tests/perf-test/setupAfterEnv.js'],
     cacheDirectory: '<rootDir>/.jest-cache',
     moduleNameMapper: {
         '\\.(lottie)$': '<rootDir>/__mocks__/fileMock.ts',
diff --git a/jest/setupAfterEnv.ts b/jest/setupAfterEnv.ts
index 6f7836b64dbb..d59495874588 100644
--- a/jest/setupAfterEnv.ts
+++ b/jest/setupAfterEnv.ts
@@ -1 +1,4 @@
+// This is required in order for jest to recognize custom matchers like toBeDisabled. This can be removed once testing-library/react-native version is bumped to v12.4 or later
+import '@testing-library/jest-native/extend-expect';
+
 jest.useRealTimers();
diff --git a/tests/unit/CalendarPickerTest.js b/tests/unit/CalendarPickerTest.tsx
similarity index 92%
rename from tests/unit/CalendarPickerTest.js
rename to tests/unit/CalendarPickerTest.tsx
index 3aab3a13c1c3..8beb02ec80c4 100644
--- a/tests/unit/CalendarPickerTest.js
+++ b/tests/unit/CalendarPickerTest.tsx
@@ -1,19 +1,22 @@
+import type ReactNavigationNative from '@react-navigation/native';
 import {fireEvent, render, within} from '@testing-library/react-native';
 import {addMonths, addYears, subMonths, subYears} from 'date-fns';
-import CalendarPicker from '../../src/components/DatePicker/CalendarPicker';
-import CONST from '../../src/CONST';
-import DateUtils from '../../src/libs/DateUtils';
+import type {ComponentType} from 'react';
+import CalendarPicker from '@components/DatePicker/CalendarPicker';
+import type {WithLocalizeProps} from '@components/withLocalize';
+import DateUtils from '@libs/DateUtils';
+import CONST from '@src/CONST';
 
 const monthNames = DateUtils.getMonthNames(CONST.LOCALES.EN);
 
 jest.mock('@react-navigation/native', () => ({
-    ...jest.requireActual('@react-navigation/native'),
+    ...jest.requireActual<typeof ReactNavigationNative>('@react-navigation/native'),
     useNavigation: () => ({navigate: jest.fn()}),
     createNavigationContainerRef: jest.fn(),
 }));
 
-jest.mock('../../src/components/withLocalize', () => (Component) => {
-    function WrappedComponent(props) {
+jest.mock('../../src/components/withLocalize', () => (Component: ComponentType<WithLocalizeProps>) => {
+    function WrappedComponent(props: Omit<WithLocalizeProps, 'translate' | 'preferredLocale'>) {
         return (
             <Component
                 // eslint-disable-next-line react/jsx-props-no-spreading