From 34b2c49dd1f12eec57ef1bc4717a44e6be4bab37 Mon Sep 17 00:00:00 2001
From: Tomasz Lesniakiewicz <tlesniakiewicz@gmail.com>
Date: Fri, 19 Jan 2024 16:03:27 +0100
Subject: [PATCH] refactor: move createAddListenerMock to separate file, add
 comments

---
 src/pages/SearchPage.js                 |  5 ++++
 tests/perf-test/SearchPage.perf-test.js | 34 +++----------------------
 tests/utils/TestHelper.js               | 25 +++++++++++++++++-
 3 files changed, 33 insertions(+), 31 deletions(-)

diff --git a/src/pages/SearchPage.js b/src/pages/SearchPage.js
index 35697fea661d..c420371f5a65 100755
--- a/src/pages/SearchPage.js
+++ b/src/pages/SearchPage.js
@@ -34,6 +34,11 @@ const propTypes = {
     /** Whether we are searching for reports in the server */
     isSearchingForReports: PropTypes.bool,
 
+    /**
+     * The navigation prop passed by the navigator.
+     *
+     * This is required because transitionEnd event doesn't trigger in the automated testing environment.
+     */
     navigation: PropTypes.shape({}),
 };
 
diff --git a/tests/perf-test/SearchPage.perf-test.js b/tests/perf-test/SearchPage.perf-test.js
index 337007f04c31..c1568bea5dcd 100644
--- a/tests/perf-test/SearchPage.perf-test.js
+++ b/tests/perf-test/SearchPage.perf-test.js
@@ -93,34 +93,8 @@ function SearchPageWrapper(args) {
 
 const runs = CONST.PERFORMANCE_TESTS.RUNS;
 
-/**
- * This is a helper function to create a mock for the addListener function of the react-navigation library.
- * Same approach as in ReportScreen.perf-test.js
- *
- * P.S: This can't be moved to a utils file because Jest wants any external function to stay in the scope.
- *
- * @returns {Object} An object with two functions: triggerTransitionEnd and addListener
- */
-const createAddListenerMock = () => {
-    const transitionEndListeners = [];
-    const triggerTransitionEnd = () => {
-        transitionEndListeners.forEach((transitionEndListener) => transitionEndListener());
-    };
-
-    const addListener = jest.fn().mockImplementation((listener, callback) => {
-        if (listener === 'transitionEnd') {
-            transitionEndListeners.push(callback);
-        }
-        return () => {
-            _.filter(transitionEndListeners, (cb) => cb !== callback);
-        };
-    });
-
-    return {triggerTransitionEnd, addListener};
-};
-
 test('[Search Page] should interact when text input changes', async () => {
-    const {addListener} = createAddListenerMock();
+    const {addListener} = TestHelper.createAddListenerMock();
 
     const scenario = async () => {
         await screen.findByTestId('SearchPage');
@@ -147,7 +121,7 @@ test('[Search Page] should interact when text input changes', async () => {
 });
 
 test('[Search Page] should render options list', async () => {
-    const {triggerTransitionEnd, addListener} = createAddListenerMock();
+    const {triggerTransitionEnd, addListener} = TestHelper.createAddListenerMock();
     const smallMockedPersonalDetails = getMockedPersonalDetails(5);
 
     const scenario = async () => {
@@ -173,7 +147,7 @@ test('[Search Page] should render options list', async () => {
 });
 
 test('[Search Page] should search in options list', async () => {
-    const {triggerTransitionEnd, addListener} = createAddListenerMock();
+    const {triggerTransitionEnd, addListener} = TestHelper.createAddListenerMock();
 
     const scenario = async () => {
         await screen.findByTestId('SearchPage');
@@ -204,7 +178,7 @@ test('[Search Page] should search in options list', async () => {
 });
 
 test('[Search Page] should click on list item', async () => {
-    const {triggerTransitionEnd, addListener} = createAddListenerMock();
+    const {triggerTransitionEnd, addListener} = TestHelper.createAddListenerMock();
 
     const scenario = async () => {
         await screen.findByTestId('SearchPage');
diff --git a/tests/utils/TestHelper.js b/tests/utils/TestHelper.js
index 03f5416a92fb..dd95ab4efb67 100644
--- a/tests/utils/TestHelper.js
+++ b/tests/utils/TestHelper.js
@@ -216,4 +216,27 @@ function assertFormDataMatchesObject(formData, obj) {
     expect(_.reduce(Array.from(formData.entries()), (memo, x) => ({...memo, [x[0]]: x[1]}), {})).toEqual(expect.objectContaining(obj));
 }
 
-export {getGlobalFetchMock, signInWithTestUser, signOutTestUser, setPersonalDetails, buildPersonalDetails, buildTestReportComment, assertFormDataMatchesObject};
+/**
+ * This is a helper function to create a mock for the addListener function of the react-navigation library.
+ *
+ * @returns {Object} An object with two functions: triggerTransitionEnd and addListener
+ */
+const createAddListenerMock = () => {
+    const transitionEndListeners = [];
+    const triggerTransitionEnd = () => {
+        transitionEndListeners.forEach((transitionEndListener) => transitionEndListener());
+    };
+
+    const addListener = jest.fn().mockImplementation((listener, callback) => {
+        if (listener === 'transitionEnd') {
+            transitionEndListeners.push(callback);
+        }
+        return () => {
+            _.filter(transitionEndListeners, (cb) => cb !== callback);
+        };
+    });
+
+    return {triggerTransitionEnd, addListener};
+};
+
+export {getGlobalFetchMock, signInWithTestUser, signOutTestUser, setPersonalDetails, buildPersonalDetails, buildTestReportComment, assertFormDataMatchesObject, createAddListenerMock};