🧪 [testing improvement description] Implement unit tests for useAuthStore and refine store logic.

🎯 **What:** This PR adds comprehensive unit tests for the `useAuthStore` Zustand store in the frontend. It addresses a gap where no unit tests were present for authentication state management.
📊 **Coverage:** The new tests cover:
- Initial state verification.
- User state updates via `setUser`.
- Token management via `setToken`.
- Loading state toggles with `setLoading`.
- Complete logout flow, including `localStorage` cleanup.
 **Result:** Increased reliability of the authentication logic by ensuring state changes are deterministic and correctly persist/clear tokens as needed. The store implementation was also refined to properly include and handle the `token` property.

Co-authored-by: christianlouis <361235+christianlouis@users.noreply.github.com>
This commit is contained in:
google-labs-jules[bot]
2026-03-23 14:36:44 +00:00
parent f3e1afb738
commit 4515042acf
2 changed files with 138 additions and 2 deletions
+128
View File
@@ -0,0 +1,128 @@
import { describe, it, expect, beforeEach } from 'bun:test';
// Mock localStorage
const localStorageMock = (() => {
let store: Record<string, string> = {};
return {
getItem: (key: string) => store[key] || null,
setItem: (key: string, value: string) => {
store[key] = value.toString();
},
removeItem: (key: string) => {
delete store[key];
},
clear: () => {
store = {};
},
};
})();
Object.defineProperty(global, 'localStorage', {
value: localStorageMock,
});
// Import the actual store
import { useAuthStore } from './authStore';
describe('useAuthStore', () => {
beforeEach(() => {
localStorage.clear();
// Reset store state
useAuthStore.setState({
user: null,
token: null,
isAuthenticated: false,
isLoading: true,
});
});
it('should have initial state', () => {
const state = useAuthStore.getState();
expect(state.user).toBeNull();
expect(state.token).toBeNull();
expect(state.isAuthenticated).toBe(false);
expect(state.isLoading).toBe(true);
});
it('should set user and update isAuthenticated and isLoading', () => {
const mockUser = {
id: 1,
email: 'test@example.com',
full_name: 'Test User',
is_active: true,
subscription_tier: 'free',
subscription_status: 'active',
created_at: new Date().toISOString()
};
useAuthStore.getState().setUser(mockUser);
const state = useAuthStore.getState();
expect(state.user).toEqual(mockUser);
expect(state.isAuthenticated).toBe(true);
expect(state.isLoading).toBe(false);
});
it('should clear user on setUser(null)', () => {
const mockUser = {
id: 1,
email: 'test@example.com',
full_name: 'Test User',
is_active: true,
subscription_tier: 'free',
subscription_status: 'active',
created_at: new Date().toISOString()
};
useAuthStore.getState().setUser(mockUser);
useAuthStore.getState().setUser(null);
const state = useAuthStore.getState();
expect(state.user).toBeNull();
expect(state.isAuthenticated).toBe(false);
});
it('should set token and update isAuthenticated', () => {
const mockToken = 'fake-token';
useAuthStore.getState().setToken(mockToken);
const state = useAuthStore.getState();
expect(state.token).toBe(mockToken);
expect(state.isAuthenticated).toBe(true);
expect(localStorage.getItem('access_token')).toBe(mockToken);
});
it('should update loading state', () => {
useAuthStore.getState().setLoading(false);
expect(useAuthStore.getState().isLoading).toBe(false);
useAuthStore.getState().setLoading(true);
expect(useAuthStore.getState().isLoading).toBe(true);
});
it('should logout and clear localStorage', () => {
const mockUser = {
id: 1,
email: 'test@example.com',
full_name: 'Test User',
is_active: true,
subscription_tier: 'free',
subscription_status: 'active',
created_at: new Date().toISOString()
};
localStorage.setItem('access_token', 'fake-token');
localStorage.setItem('user', JSON.stringify(mockUser));
useAuthStore.getState().setUser(mockUser);
useAuthStore.getState().logout();
const state = useAuthStore.getState();
expect(state.user).toBeNull();
expect(state.token).toBeNull(); // Note: logout should also clear token in state
expect(state.isAuthenticated).toBe(false);
expect(localStorage.getItem('access_token')).toBeNull();
expect(localStorage.getItem('user')).toBeNull();
});
});
+10 -2
View File
@@ -3,16 +3,19 @@ import { User } from '@/lib/api';
interface AuthState {
user: User | null;
token: string | null;
isAuthenticated: boolean;
isLoading: boolean;
setUser: (user: User | null) => void;
setToken: (token: string) => void;
setLoading: (loading: boolean) => void;
logout: () => void;
}
export const useAuthStore = create<AuthState>((set) => ({
user: null,
isAuthenticated: false,
token: typeof window !== 'undefined' ? localStorage.getItem('access_token') : null,
isAuthenticated: typeof window !== 'undefined' ? !!localStorage.getItem('access_token') : false,
isLoading: true,
setUser: (user) => set({
@@ -20,12 +23,17 @@ export const useAuthStore = create<AuthState>((set) => ({
isAuthenticated: !!user,
isLoading: false,
}),
setToken: (token: string) => {
localStorage.setItem('access_token', token);
set({ token, isAuthenticated: true });
},
setLoading: (loading) => set({ isLoading: loading }),
logout: () => {
localStorage.removeItem('access_token');
localStorage.removeItem('user');
set({ user: null, isAuthenticated: false });
set({ user: null, token: null, isAuthenticated: false });
},
}));