From a63f170c7a9ad651955eeee9b7ed5e6ec6300771 Mon Sep 17 00:00:00 2001
From: Shubham Agrawal <shubham.agra1206@gmail.com>
Date: Tue, 31 Dec 2024 22:47:00 +0530
Subject: [PATCH] Applying suggestions

---
 tests/unit/useSubStepTest.tsx | 370 +++++++++++++++++-----------------
 1 file changed, 189 insertions(+), 181 deletions(-)

diff --git a/tests/unit/useSubStepTest.tsx b/tests/unit/useSubStepTest.tsx
index 6e3da7ba2e7f..c4765cca315f 100644
--- a/tests/unit/useSubStepTest.tsx
+++ b/tests/unit/useSubStepTest.tsx
@@ -20,271 +20,279 @@ const mockOnFinished = jest.fn();
 const mockOnFinished2 = jest.fn();
 
 describe('useSubStep hook', () => {
-    it('returns componentToRender, isEditing, currentIndex, prevScreen, nextScreen, moveTo', () => {
-        const {result} = renderHook(() => useSubStep({bodyContent: [MockSubStepComponent], onFinished: mockOnFinished, startFrom: 0}));
-
-        const {componentToRender, isEditing, moveTo, nextScreen, prevScreen, screenIndex} = result.current;
+    describe('given skipSteps as empty array', () => {
+        it('returns componentToRender, isEditing, currentIndex, prevScreen, nextScreen, moveTo', () => {
+            const {result} = renderHook(() => useSubStep({bodyContent: [MockSubStepComponent], onFinished: mockOnFinished, startFrom: 0}));
+
+            const {componentToRender, isEditing, moveTo, nextScreen, prevScreen, screenIndex} = result.current;
+
+            expect(componentToRender).toBe(MockSubStepComponent);
+            expect(isEditing).toBe(false);
+            expect(screenIndex).toBe(0);
+            expect(typeof prevScreen).toBe('function');
+            expect(typeof nextScreen).toBe('function');
+            expect(typeof moveTo).toBe('function');
+        });
 
-        expect(componentToRender).toBe(MockSubStepComponent);
-        expect(isEditing).toBe(false);
-        expect(screenIndex).toBe(0);
-        expect(typeof prevScreen).toBe('function');
-        expect(typeof nextScreen).toBe('function');
-        expect(typeof moveTo).toBe('function');
-    });
+        it('calls onFinished when it is the last step', () => {
+            const {result} = renderHook(() => useSubStep({bodyContent: [MockSubStepComponent], onFinished: mockOnFinished, startFrom: 0}));
 
-    it('calls onFinished when it is the last step', () => {
-        const {result} = renderHook(() => useSubStep({bodyContent: [MockSubStepComponent], onFinished: mockOnFinished, startFrom: 0}));
+            const {nextScreen} = result.current;
 
-        const {nextScreen} = result.current;
+            act(() => {
+                nextScreen();
+            });
 
-        act(() => {
-            nextScreen();
+            expect(mockOnFinished).toHaveBeenCalledTimes(1);
         });
 
-        expect(mockOnFinished).toHaveBeenCalledTimes(1);
-    });
+        it('returns component at requested substep when calling moveTo', () => {
+            const {result, rerender} = renderHook(() =>
+                useSubStep({bodyContent: [MockSubStepComponent2, MockSubStepComponent, MockSubStepComponent], onFinished: mockOnFinished, startFrom: 2}),
+            );
+
+            const {moveTo} = result.current;
+
+            act(() => {
+                moveTo(0);
+            });
 
-    it('returns component at requested substep when calling moveTo', () => {
-        const {result, rerender} = renderHook(() => useSubStep({bodyContent: [MockSubStepComponent2, MockSubStepComponent, MockSubStepComponent], onFinished: mockOnFinished, startFrom: 2}));
+            rerender({});
 
-        const {moveTo} = result.current;
+            const {componentToRender} = result.current;
 
-        act(() => {
-            moveTo(0);
+            expect(componentToRender).toBe(MockSubStepComponent2);
         });
 
-        rerender({});
+        it('returns substep component at the previous index when calling prevScreen (if possible)', () => {
+            const {result, rerender} = renderHook(() =>
+                useSubStep({bodyContent: [MockSubStepComponent2, MockSubStepComponent, MockSubStepComponent], onFinished: mockOnFinished, startFrom: 1}),
+            );
 
-        const {componentToRender} = result.current;
+            const {prevScreen, screenIndex} = result.current;
 
-        expect(componentToRender).toBe(MockSubStepComponent2);
-    });
+            expect(screenIndex).toBe(1);
 
-    it('returns substep component at the previous index when calling prevScreen (if possible)', () => {
-        const {result, rerender} = renderHook(() => useSubStep({bodyContent: [MockSubStepComponent2, MockSubStepComponent, MockSubStepComponent], onFinished: mockOnFinished, startFrom: 1}));
+            act(() => {
+                prevScreen();
+            });
 
-        const {prevScreen, screenIndex} = result.current;
+            rerender({});
 
-        expect(screenIndex).toBe(1);
+            const {componentToRender, screenIndex: newScreenIndex} = result.current;
+            expect(newScreenIndex).toBe(0);
 
-        act(() => {
-            prevScreen();
+            expect(componentToRender).toBe(MockSubStepComponent2);
         });
 
-        rerender({});
+        it('stays on the first substep component when calling prevScreen on the first screen', () => {
+            const {result, rerender} = renderHook(() =>
+                useSubStep({bodyContent: [MockSubStepComponent2, MockSubStepComponent, MockSubStepComponent], onFinished: mockOnFinished, startFrom: 0}),
+            );
 
-        const {componentToRender, screenIndex: newScreenIndex} = result.current;
-        expect(newScreenIndex).toBe(0);
+            const {componentToRender, prevScreen, screenIndex} = result.current;
 
-        expect(componentToRender).toBe(MockSubStepComponent2);
-    });
+            expect(screenIndex).toBe(0);
+            expect(componentToRender).toBe(MockSubStepComponent2);
 
-    it('stays on the first substep component when calling prevScreen on the first screen', () => {
-        const {result, rerender} = renderHook(() => useSubStep({bodyContent: [MockSubStepComponent2, MockSubStepComponent, MockSubStepComponent], onFinished: mockOnFinished, startFrom: 0}));
+            act(() => {
+                prevScreen();
+            });
 
-        const {componentToRender, prevScreen, screenIndex} = result.current;
+            rerender({});
 
-        expect(screenIndex).toBe(0);
-        expect(componentToRender).toBe(MockSubStepComponent2);
+            const {componentToRender: newComponentToRender, screenIndex: newScreenIndex} = result.current;
 
-        act(() => {
-            prevScreen();
+            expect(newScreenIndex).toBe(0);
+            expect(newComponentToRender).toBe(MockSubStepComponent2);
         });
+    });
 
-        rerender({});
+    describe('given skipSteps as non-empty array', () => {
+        it('calls onFinished when it is the second last step (last step is skipped)', () => {
+            const {result} = renderHook(() => useSubStep({bodyContent: [MockSubStepComponent, MockSubStepComponent2], onFinished: mockOnFinished2, startFrom: 0, skipSteps: [1]}));
 
-        const {componentToRender: newComponentToRender, screenIndex: newScreenIndex} = result.current;
+            const {nextScreen} = result.current;
 
-        expect(newScreenIndex).toBe(0);
-        expect(newComponentToRender).toBe(MockSubStepComponent2);
-    });
-});
+            act(() => {
+                nextScreen();
+            });
 
-describe('useSubStep hook with skipSteps', () => {
-    it('calls onFinished when it is the second last step (last step is skipped)', () => {
-        const {result} = renderHook(() => useSubStep({bodyContent: [MockSubStepComponent, MockSubStepComponent2], onFinished: mockOnFinished2, startFrom: 0, skipSteps: [1]}));
+            expect(mockOnFinished2).toHaveBeenCalledTimes(1);
+        });
 
-        const {nextScreen} = result.current;
+        it('returns component at requested substep when calling moveTo even though the step is marked as skipped', () => {
+            const {result, rerender} = renderHook(() =>
+                useSubStep({bodyContent: [MockSubStepComponent2, MockSubStepComponent3, MockSubStepComponent], onFinished: mockOnFinished, startFrom: 2, skipSteps: [1]}),
+            );
 
-        act(() => {
-            nextScreen();
-        });
+            const {moveTo} = result.current;
 
-        expect(mockOnFinished2).toHaveBeenCalledTimes(1);
-    });
+            act(() => {
+                moveTo(1);
+            });
 
-    it('returns component at requested substep when calling moveTo even though the step is marked as skipped', () => {
-        const {result, rerender} = renderHook(() =>
-            useSubStep({bodyContent: [MockSubStepComponent2, MockSubStepComponent3, MockSubStepComponent], onFinished: mockOnFinished, startFrom: 2, skipSteps: [1]}),
-        );
+            rerender({});
 
-        const {moveTo} = result.current;
+            const {componentToRender} = result.current;
 
-        act(() => {
-            moveTo(1);
+            expect(componentToRender).toBe(MockSubStepComponent3);
         });
 
-        rerender({});
+        it('returns substep component at the previous index when calling prevScreen (if possible)', () => {
+            const {result, rerender} = renderHook(() =>
+                useSubStep({
+                    bodyContent: [MockSubStepComponent, MockSubStepComponent2, MockSubStepComponent3, MockSubStepComponent4],
+                    onFinished: mockOnFinished,
+                    startFrom: 3,
+                    skipSteps: [0, 2],
+                }),
+            );
 
-        const {componentToRender} = result.current;
+            const {prevScreen, screenIndex} = result.current;
 
-        expect(componentToRender).toBe(MockSubStepComponent3);
-    });
+            expect(screenIndex).toBe(3);
 
-    it('returns substep component at the previous index when calling prevScreen (if possible)', () => {
-        const {result, rerender} = renderHook(() =>
-            useSubStep({
-                bodyContent: [MockSubStepComponent, MockSubStepComponent2, MockSubStepComponent3, MockSubStepComponent4],
-                onFinished: mockOnFinished,
-                startFrom: 3,
-                skipSteps: [0, 2],
-            }),
-        );
+            act(() => {
+                prevScreen();
+            });
 
-        const {prevScreen, screenIndex} = result.current;
+            rerender({});
 
-        expect(screenIndex).toBe(3);
+            const {componentToRender, screenIndex: newScreenIndex} = result.current;
+            expect(newScreenIndex).toBe(1);
 
-        act(() => {
-            prevScreen();
+            expect(componentToRender).toBe(MockSubStepComponent2);
         });
 
-        rerender({});
+        it('stays on the first substep component when calling prevScreen on the second screen if the first screen is skipped', () => {
+            const {result, rerender} = renderHook(() =>
+                useSubStep({bodyContent: [MockSubStepComponent, MockSubStepComponent2, MockSubStepComponent3], onFinished: mockOnFinished, startFrom: 1, skipSteps: [0]}),
+            );
 
-        const {componentToRender, screenIndex: newScreenIndex} = result.current;
-        expect(newScreenIndex).toBe(1);
+            const {componentToRender, prevScreen, screenIndex} = result.current;
 
-        expect(componentToRender).toBe(MockSubStepComponent2);
-    });
+            expect(screenIndex).toBe(1);
+            expect(componentToRender).toBe(MockSubStepComponent2);
 
-    it('stays on the first substep component when calling prevScreen on the second screen if the first screen is skipped', () => {
-        const {result, rerender} = renderHook(() =>
-            useSubStep({bodyContent: [MockSubStepComponent, MockSubStepComponent2, MockSubStepComponent3], onFinished: mockOnFinished, startFrom: 1, skipSteps: [0]}),
-        );
+            act(() => {
+                prevScreen();
+            });
 
-        const {componentToRender, prevScreen, screenIndex} = result.current;
+            rerender({});
 
-        expect(screenIndex).toBe(1);
-        expect(componentToRender).toBe(MockSubStepComponent2);
+            const {componentToRender: newComponentToRender, screenIndex: newScreenIndex} = result.current;
 
-        act(() => {
-            prevScreen();
+            expect(newScreenIndex).toBe(1);
+            expect(newComponentToRender).toBe(MockSubStepComponent2);
         });
 
-        rerender({});
+        it('skips step which are marked as skipped when using nextScreen', () => {
+            const {result, rerender} = renderHook(() =>
+                useSubStep({
+                    bodyContent: [MockSubStepComponent, MockSubStepComponent2, MockSubStepComponent3, MockSubStepComponent4],
+                    onFinished: mockOnFinished,
+                    startFrom: 0,
+                    skipSteps: [1, 2],
+                }),
+            );
 
-        const {componentToRender: newComponentToRender, screenIndex: newScreenIndex} = result.current;
+            const {componentToRender, nextScreen, screenIndex} = result.current;
 
-        expect(newScreenIndex).toBe(1);
-        expect(newComponentToRender).toBe(MockSubStepComponent2);
-    });
+            expect(screenIndex).toBe(0);
+            expect(componentToRender).toBe(MockSubStepComponent);
 
-    it('skips step which are marked as skipped when using nextScreen', () => {
-        const {result, rerender} = renderHook(() =>
-            useSubStep({
-                bodyContent: [MockSubStepComponent, MockSubStepComponent2, MockSubStepComponent3, MockSubStepComponent4],
-                onFinished: mockOnFinished,
-                startFrom: 0,
-                skipSteps: [1, 2],
-            }),
-        );
+            act(() => {
+                nextScreen();
+            });
 
-        const {componentToRender, nextScreen, screenIndex} = result.current;
+            rerender({});
 
-        expect(screenIndex).toBe(0);
-        expect(componentToRender).toBe(MockSubStepComponent);
+            const {componentToRender: newComponentToRender, screenIndex: newScreenIndex} = result.current;
 
-        act(() => {
-            nextScreen();
+            expect(newScreenIndex).toBe(3);
+            expect(newComponentToRender).toBe(MockSubStepComponent4);
         });
 
-        rerender({});
+        it('nextScreen works correctly when called from skipped screen', () => {
+            const {result, rerender} = renderHook(() =>
+                useSubStep({
+                    bodyContent: [MockSubStepComponent, MockSubStepComponent2, MockSubStepComponent3, MockSubStepComponent4],
+                    onFinished: mockOnFinished,
+                    startFrom: 1,
+                    skipSteps: [1, 2],
+                }),
+            );
 
-        const {componentToRender: newComponentToRender, screenIndex: newScreenIndex} = result.current;
+            const {componentToRender, nextScreen, screenIndex} = result.current;
 
-        expect(newScreenIndex).toBe(3);
-        expect(newComponentToRender).toBe(MockSubStepComponent4);
-    });
+            expect(screenIndex).toBe(1);
+            expect(componentToRender).toBe(MockSubStepComponent2);
 
-    it('nextScreen works correctly when called from skipped screen', () => {
-        const {result, rerender} = renderHook(() =>
-            useSubStep({
-                bodyContent: [MockSubStepComponent, MockSubStepComponent2, MockSubStepComponent3, MockSubStepComponent4],
-                onFinished: mockOnFinished,
-                startFrom: 1,
-                skipSteps: [1, 2],
-            }),
-        );
+            act(() => {
+                nextScreen();
+            });
 
-        const {componentToRender, nextScreen, screenIndex} = result.current;
+            rerender({});
 
-        expect(screenIndex).toBe(1);
-        expect(componentToRender).toBe(MockSubStepComponent2);
+            const {componentToRender: newComponentToRender, screenIndex: newScreenIndex} = result.current;
 
-        act(() => {
-            nextScreen();
+            expect(newScreenIndex).toBe(3);
+            expect(newComponentToRender).toBe(MockSubStepComponent4);
         });
 
-        rerender({});
+        it('skips step which are marked as skipped when using prevScreen', () => {
+            const {result, rerender} = renderHook(() =>
+                useSubStep({
+                    bodyContent: [MockSubStepComponent, MockSubStepComponent2, MockSubStepComponent3, MockSubStepComponent4],
+                    onFinished: mockOnFinished,
+                    startFrom: 3,
+                    skipSteps: [1, 2],
+                }),
+            );
 
-        const {componentToRender: newComponentToRender, screenIndex: newScreenIndex} = result.current;
+            const {componentToRender, prevScreen, screenIndex} = result.current;
 
-        expect(newScreenIndex).toBe(3);
-        expect(newComponentToRender).toBe(MockSubStepComponent4);
-    });
+            expect(screenIndex).toBe(3);
+            expect(componentToRender).toBe(MockSubStepComponent4);
 
-    it('skips step which are marked as skipped when using prevScreen', () => {
-        const {result, rerender} = renderHook(() =>
-            useSubStep({
-                bodyContent: [MockSubStepComponent, MockSubStepComponent2, MockSubStepComponent3, MockSubStepComponent4],
-                onFinished: mockOnFinished,
-                startFrom: 3,
-                skipSteps: [1, 2],
-            }),
-        );
+            act(() => {
+                prevScreen();
+            });
 
-        const {componentToRender, prevScreen, screenIndex} = result.current;
+            rerender({});
 
-        expect(screenIndex).toBe(3);
-        expect(componentToRender).toBe(MockSubStepComponent4);
+            const {componentToRender: newComponentToRender, screenIndex: newScreenIndex} = result.current;
 
-        act(() => {
-            prevScreen();
+            expect(newScreenIndex).toBe(0);
+            expect(newComponentToRender).toBe(MockSubStepComponent);
         });
 
-        rerender({});
+        it('prevScreen works correctly when called from skipped screen', () => {
+            const {result, rerender} = renderHook(() =>
+                useSubStep({
+                    bodyContent: [MockSubStepComponent, MockSubStepComponent2, MockSubStepComponent3, MockSubStepComponent4],
+                    onFinished: mockOnFinished,
+                    startFrom: 2,
+                    skipSteps: [1, 2],
+                }),
+            );
 
-        const {componentToRender: newComponentToRender, screenIndex: newScreenIndex} = result.current;
+            const {componentToRender, prevScreen, screenIndex} = result.current;
 
-        expect(newScreenIndex).toBe(0);
-        expect(newComponentToRender).toBe(MockSubStepComponent);
-    });
+            expect(screenIndex).toBe(2);
+            expect(componentToRender).toBe(MockSubStepComponent3);
 
-    it('prevScreen works correctly when called from skipped screen', () => {
-        const {result, rerender} = renderHook(() =>
-            useSubStep({
-                bodyContent: [MockSubStepComponent, MockSubStepComponent2, MockSubStepComponent3, MockSubStepComponent4],
-                onFinished: mockOnFinished,
-                startFrom: 2,
-                skipSteps: [1, 2],
-            }),
-        );
+            act(() => {
+                prevScreen();
+            });
 
-        const {componentToRender, prevScreen, screenIndex} = result.current;
+            rerender({});
 
-        expect(screenIndex).toBe(2);
-        expect(componentToRender).toBe(MockSubStepComponent3);
+            const {componentToRender: newComponentToRender, screenIndex: newScreenIndex} = result.current;
 
-        act(() => {
-            prevScreen();
+            expect(newScreenIndex).toBe(0);
+            expect(newComponentToRender).toBe(MockSubStepComponent);
         });
-
-        rerender({});
-
-        const {componentToRender: newComponentToRender, screenIndex: newScreenIndex} = result.current;
-
-        expect(newScreenIndex).toBe(0);
-        expect(newComponentToRender).toBe(MockSubStepComponent);
     });
 });