add: implement tests for Redux hooks, rootReducer, and store to verify initial state and action handling

Author: bakaqc

tests/redux/hooks.test.ts

@@ -0,0 +1,61 @@
+import { renderHook } from '@testing-library/react-hooks';
+import { Provider } from 'react-redux';
+import configureMockStore from 'redux-mock-store';
+import * as React from 'react';
+import { AnyAction } from 'redux';
+
+import { useAppDispatch, useAppSelector } from '@/redux/hooks';
+
+// Mock the store
+const mockStore = configureMockStore();
+const initialState = {
+  gifts: {
+    gifts: [],
+    loading: false,
+    error: null
+  },
+  recipients: {
+    recipients: [],
+    loading: false,
+    error: null
+  }
+};
+const store = mockStore(initialState);
+
+// Use a custom wrapper function that correctly types the Provider props
+const wrapper = ({ children }: { children: React.ReactNode }) => {
+  // Make TypeScript happy by properly typing the Provider props
+  return React.createElement(
+    Provider as React.ComponentType<{ store: typeof store; children?: React.ReactNode }>,
+    { store },
+    children
+  );
+};
+
+describe('Redux hooks', () => {
+  describe('useAppDispatch', () => {
+    it('should return a dispatch function', () => {
+      const { result } = renderHook(() => useAppDispatch(), { wrapper });
+      expect(typeof result.current).toBe('function');
+    });
+
+    it('should dispatch an action correctly', () => {
+      const { result } = renderHook(() => useAppDispatch(), { wrapper });
+      result.current({ type: 'TEST_ACTION' });
+      
+      const actions = store.getActions();
+      expect(actions).toContainEqual({ type: 'TEST_ACTION' });
+    });
+  });
+
+  describe('useAppSelector', () => {
+    it('should select data from the store state', () => {
+      const { result } = renderHook(
+        () => useAppSelector((state) => state.gifts.gifts),
+        { wrapper }
+      );
+      
+      expect(result.current).toEqual([]);
+    });
+  });
+});

tests/redux/rootReducer.test.ts

@@ -0,0 +1,82 @@
+import rootReducer from '@/redux/rootReducer';
+
+describe('rootReducer', () => {
+  it('should return the initial state', () => {
+    const state = rootReducer(undefined, { type: 'UNKNOWN_ACTION' });
+    
+    // Check that the root state has the expected structure with both reducers
+    expect(state).toHaveProperty('gifts');
+    expect(state).toHaveProperty('recipients');
+  });
+
+  it('should handle actions for the gifts slice', () => {
+    // Initial state that would be provided by the store
+    const initialState = {
+      gifts: {
+        gifts: [],
+        loading: false,
+        error: null
+      },
+      recipients: {
+        recipients: [],
+        loading: false,
+        error: null
+      }
+    };
+
+    // Dispatch a gifts-specific action
+    const state = rootReducer(initialState, { 
+      type: 'gifts/addGift/fulfilled',
+      payload: { 
+        id: '1', 
+        title: 'Test Gift', 
+        image: 'test.jpg', 
+        price: 50, 
+        recipient: '1', 
+        selectedDate: '2025-05-01' 
+      }
+    });
+
+    // The gifts slice should have updated
+    expect(state.gifts.gifts).toHaveLength(1);
+    expect(state.gifts.gifts[0].title).toBe('Test Gift');
+    
+    // The recipients slice should remain unchanged
+    expect(state.recipients).toEqual(initialState.recipients);
+  });
+
+  it('should handle actions for the recipients slice', () => {
+    // Initial state
+    const initialState = {
+      gifts: {
+        gifts: [],
+        loading: false,
+        error: null
+      },
+      recipients: {
+        recipients: [],
+        loading: false,
+        error: null
+      }
+    };
+
+    // Dispatch a recipients-specific action
+    const state = rootReducer(initialState, { 
+      type: 'recipients/addRecipient/fulfilled',
+      payload: { 
+        id: '1', 
+        name: 'Test Recipient', 
+        image: 'test.jpg',
+        budget: 100,
+        spent: 0
+      }
+    });
+
+    // The recipients slice should have updated
+    expect(state.recipients.recipients).toHaveLength(1);
+    expect(state.recipients.recipients[0].name).toBe('Test Recipient');
+    
+    // The gifts slice should remain unchanged
+    expect(state.gifts).toEqual(initialState.gifts);
+  });
+});

tests/redux/store.test.ts

@@ -0,0 +1,52 @@
+import store from '@/redux/store';
+
+describe('Redux store', () => {
+	it('should have the correct initial state', () => {
+		const state = store.getState();
+
+		// Check that the store contains the expected slices
+		expect(state).toHaveProperty('gifts');
+		expect(state).toHaveProperty('recipients');
+
+		// Check that gifts slice has the expected initial state
+		expect(state.gifts).toEqual({
+			gifts: [],
+			loading: false,
+			error: null,
+		});
+
+		// Check that recipients slice has the expected initial state
+		expect(state.recipients).toEqual({
+			recipients: [],
+			loading: false,
+			error: null,
+		});
+	});
+
+	it('should handle dispatched actions', () => {
+		// Dispatch a test action
+		store.dispatch({
+			type: 'gifts/fetchGifts/pending',
+		});
+
+		// Check that the state was updated correctly
+		const state = store.getState();
+		expect(state.gifts.loading).toBe(true);
+
+		// Reset store to avoid affecting other tests
+		store.dispatch({ type: 'UNKNOWN_ACTION' });
+	});
+
+	it('should have thunk middleware available', () => {
+		// Dispatch an async thunk action (mock)
+		const asyncAction = () => (dispatch: any) => {
+			dispatch({ type: 'TEST_ASYNC_ACTION' });
+		};
+
+		// This will throw if thunk middleware isn't available
+		store.dispatch(asyncAction() as any);
+
+		// Reset store to avoid affecting other tests
+		store.dispatch({ type: 'UNKNOWN_ACTION' });
+	});
+});