156 lines
4.2 KiB
TypeScript
156 lines
4.2 KiB
TypeScript
import React from 'react'
|
|
import { render, waitFor } from '@testing-library/react-native'
|
|
import HomeScreen from '../index'
|
|
|
|
// Mock react-native-safe-area-context FIRST
|
|
jest.mock('react-native-safe-area-context', () => ({
|
|
SafeAreaProvider: ({ children }: any) => children,
|
|
SafeAreaView: ({ children }: any) => children,
|
|
useSafeAreaInsets: () => ({ top: 0, right: 0, bottom: 0, left: 0 }),
|
|
}))
|
|
|
|
// Mock expo-linear-gradient
|
|
jest.mock('expo-linear-gradient', () => ({
|
|
LinearGradient: 'LinearGradient',
|
|
}))
|
|
|
|
// Mock expo-image
|
|
jest.mock('expo-image', () => ({
|
|
Image: 'Image',
|
|
}))
|
|
|
|
// Mock expo-status-bar
|
|
jest.mock('expo-status-bar', () => ({
|
|
StatusBar: 'StatusBar',
|
|
}))
|
|
|
|
// Mock icons
|
|
jest.mock('@/components/icon', () => ({
|
|
DownArrowIcon: () => 'DownArrowIcon',
|
|
PointsIcon: () => 'PointsIcon',
|
|
SearchIcon: () => 'SearchIcon',
|
|
}))
|
|
|
|
// Mock components
|
|
jest.mock('@/components/ErrorState', () => 'ErrorState')
|
|
jest.mock('@/components/LoadingState', () => 'LoadingState')
|
|
|
|
// Mock react-native RefreshControl (directly from react-native)
|
|
jest.mock('react-native', () =>
|
|
Object.assign({}, jest.requireActual('react-native'), {
|
|
RefreshControl: 'RefreshControl',
|
|
})
|
|
)
|
|
|
|
// Mock dependencies
|
|
jest.mock('expo-router', () => ({
|
|
useLocalSearchParams: jest.fn(() => ({})),
|
|
useRouter: jest.fn(() => ({
|
|
push: jest.fn(),
|
|
})),
|
|
}))
|
|
|
|
jest.mock('react-i18next', () => ({
|
|
useTranslation: () => ({
|
|
t: (key: string) => key,
|
|
}),
|
|
}))
|
|
|
|
jest.mock('@/hooks/use-activates', () => ({
|
|
useActivates: jest.fn(() => ({
|
|
load: jest.fn(),
|
|
data: {
|
|
activities: [
|
|
{
|
|
id: '1',
|
|
title: 'Test Activity',
|
|
desc: 'Test Description',
|
|
coverUrl: 'https://example.com/image.jpg',
|
|
link: '/test',
|
|
},
|
|
],
|
|
},
|
|
error: null,
|
|
})),
|
|
}))
|
|
|
|
jest.mock('@/hooks/use-categories', () => ({
|
|
useCategories: jest.fn(() => ({
|
|
load: jest.fn(),
|
|
data: {
|
|
categories: [
|
|
{
|
|
id: 'cat1',
|
|
name: 'Test Category',
|
|
templates: [
|
|
{
|
|
id: 'template1',
|
|
title: 'Test Template',
|
|
webpPreviewUrl: 'https://example.com/preview.webp',
|
|
previewUrl: 'https://example.com/preview.jpg',
|
|
coverImageUrl: 'https://example.com/cover.png',
|
|
aspectRatio: '1:1',
|
|
},
|
|
],
|
|
},
|
|
],
|
|
},
|
|
loading: false,
|
|
error: null,
|
|
})),
|
|
}))
|
|
|
|
jest.mock('@/hooks/use-user-balance', () => ({
|
|
useUserBalance: jest.fn(() => ({
|
|
balance: 1234,
|
|
loading: false,
|
|
error: null,
|
|
})),
|
|
}))
|
|
|
|
const renderWithProviders = (component: React.ReactElement) => {
|
|
return render(component)
|
|
}
|
|
|
|
describe('HomeScreen', () => {
|
|
it('should render title bar with app name', async () => {
|
|
const { getByText } = renderWithProviders(<HomeScreen />)
|
|
|
|
await waitFor(() => {
|
|
expect(getByText('Popcore')).toBeTruthy()
|
|
})
|
|
})
|
|
|
|
it('should render category tabs when data is loaded', async () => {
|
|
const { getByText } = renderWithProviders(<HomeScreen />)
|
|
|
|
await waitFor(() => {
|
|
expect(getByText('Test Category')).toBeTruthy()
|
|
})
|
|
})
|
|
|
|
it('should render template cards when category has templates', async () => {
|
|
const { getByText } = renderWithProviders(<HomeScreen />)
|
|
|
|
await waitFor(() => {
|
|
expect(getByText('Test Template')).toBeTruthy()
|
|
})
|
|
})
|
|
|
|
it('should not show loading state when data is loaded', async () => {
|
|
const { queryByText } = renderWithProviders(<HomeScreen />)
|
|
|
|
await waitFor(() => {
|
|
expect(queryByText('加载中')).toBeNull()
|
|
})
|
|
})
|
|
|
|
it('should display user balance from useUserBalance hook', async () => {
|
|
const { getByText } = renderWithProviders(<HomeScreen />)
|
|
|
|
await waitFor(() => {
|
|
expect(getByText('1234')).toBeTruthy()
|
|
})
|
|
})
|
|
})
|