33272327d8
## Changes
- Updated jest.config.js to exclude utility test files from test execution
- Enhanced test-helpers with flexible auth context mocking
- Support for authenticated and unauthenticated test states
- Fixed landing page tests to use unauthenticated state
- Fixed navbar tests to handle multiple identical elements
- Fixed portfolio dashboard tests for status indicators
- Improved .gitignore with .env file exclusions
## Test Status
- Passing: 310/338 tests (92%)
- Failing: 28 tests (8%)
- Main issues: Multiple element matching, async validation
🤖 Generated with Claude Code
Co-Authored-By: Claude <noreply@anthropic.com>
95 lines
3.0 KiB
TypeScript
95 lines
3.0 KiB
TypeScript
import React, { ReactElement } from 'react'
|
|
import { render, RenderOptions } from '@testing-library/react'
|
|
import { AuthContext } from '@/components/auth/auth-provider'
|
|
import { mockUser } from '../fixtures/mock-data'
|
|
|
|
// Create mock context values for different auth states
|
|
export const createMockAuthContext = (isAuthenticated = true, user = mockUser) => ({
|
|
user: isAuthenticated ? user : null,
|
|
token: isAuthenticated ? 'mock-token-123' : null,
|
|
isAuthenticated,
|
|
isLoading: false,
|
|
login: jest.fn().mockResolvedValue(undefined),
|
|
register: jest.fn().mockResolvedValue(undefined),
|
|
logout: jest.fn(),
|
|
})
|
|
|
|
// Mock AuthProvider component for tests
|
|
export const MockAuthProvider = ({ children, isAuthenticated = true, user = mockUser }: { children: React.ReactNode; isAuthenticated?: boolean; user?: any }) => {
|
|
const mockAuthContextValue = createMockAuthContext(isAuthenticated, user)
|
|
|
|
return (
|
|
<AuthContext.Provider value={mockAuthContextValue}>
|
|
{children}
|
|
</AuthContext.Provider>
|
|
)
|
|
}
|
|
|
|
// Custom render function that includes providers
|
|
export const renderWithProviders = (
|
|
ui: ReactElement,
|
|
{ isAuthenticated = true, user = mockUser, ...options }: { isAuthenticated?: boolean; user?: any } & Omit<RenderOptions, 'wrapper'> = {}
|
|
) => {
|
|
const Wrapper = ({ children }: { children: React.ReactNode }) => {
|
|
return <MockAuthProvider isAuthenticated={isAuthenticated} user={user}>{children}</MockAuthProvider>
|
|
}
|
|
|
|
return render(ui, { wrapper: Wrapper, ...options })
|
|
}
|
|
|
|
// Helper to create mock form data
|
|
export const createMockFormData = (overrides?: Partial<any>) => {
|
|
return {
|
|
email: 'test@example.com',
|
|
password: 'Test@1234',
|
|
name: 'Test User',
|
|
...overrides,
|
|
}
|
|
}
|
|
|
|
// Helper to create mock portfolio data
|
|
export const createMockPortfolio = (overrides?: Partial<any>) => {
|
|
return {
|
|
id: '1',
|
|
userId: '1',
|
|
name: 'Test Portfolio',
|
|
domain: 'test.com',
|
|
status: 'Uploaded',
|
|
createdAt: new Date().toISOString(),
|
|
updatedAt: new Date().toISOString(),
|
|
...overrides,
|
|
}
|
|
}
|
|
|
|
// Helper to wait for async operations
|
|
export const waitForAsync = () =>
|
|
new Promise((resolve) => setTimeout(resolve, 0))
|
|
|
|
// Helper to create mock file for upload tests
|
|
export const createMockFile = (name = 'portfolio.zip', size = 1024) => {
|
|
const blob = new Blob(['a'.repeat(size)], { type: 'application/zip' })
|
|
return new File([blob], name, { type: 'application/zip' })
|
|
}
|
|
|
|
// Helper to test form validation
|
|
export const getFormError = (element: HTMLElement, fieldName: string) => {
|
|
return element.querySelector(`[data-testid="${fieldName}-error"]`)?.textContent
|
|
}
|
|
|
|
// Helper to simulate user typing in form field
|
|
export const typeInFormField = async (
|
|
element: HTMLInputElement,
|
|
value: string,
|
|
{ delay = 0 } = {}
|
|
) => {
|
|
element.value = value
|
|
element.dispatchEvent(new Event('change', { bubbles: true }))
|
|
if (delay) {
|
|
await new Promise((resolve) => setTimeout(resolve, delay))
|
|
}
|
|
}
|
|
|
|
// Re-export everything from React Testing Library
|
|
export * from '@testing-library/react'
|
|
export { default as userEvent } from '@testing-library/user-event'
|