|
|
@@ -1,29 +1,22 @@
|
|
|
+/**
|
|
|
+ * 个人中心页面组件测试
|
|
|
+ */
|
|
|
+
|
|
|
import React from 'react'
|
|
|
import { render, screen, fireEvent, waitFor } from '@testing-library/react'
|
|
|
+import '@testing-library/jest-dom'
|
|
|
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
|
|
|
import ProfilePage from '../../src/pages/profile/index'
|
|
|
|
|
|
-// Mock Taro
|
|
|
+// Mock Taro相关API
|
|
|
const mockShowToast = jest.fn()
|
|
|
const mockShowLoading = jest.fn()
|
|
|
const mockHideLoading = jest.fn()
|
|
|
const mockShowModal = jest.fn()
|
|
|
const mockNavigateTo = jest.fn()
|
|
|
const mockReLaunch = jest.fn()
|
|
|
-
|
|
|
-jest.mock('@tarojs/taro', () => ({
|
|
|
- showToast: mockShowToast,
|
|
|
- showLoading: mockShowLoading,
|
|
|
- hideLoading: mockHideLoading,
|
|
|
- showModal: mockShowModal,
|
|
|
- navigateTo: mockNavigateTo,
|
|
|
- reLaunch: mockReLaunch,
|
|
|
-}))
|
|
|
-
|
|
|
-// Mock 微信客服API
|
|
|
const mockOpenCustomerServiceChat = jest.fn()
|
|
|
|
|
|
-// 更新Taro mock以包含openCustomerServiceChat
|
|
|
jest.mock('@tarojs/taro', () => ({
|
|
|
showToast: mockShowToast,
|
|
|
showLoading: mockShowLoading,
|
|
|
@@ -32,6 +25,17 @@ jest.mock('@tarojs/taro', () => ({
|
|
|
navigateTo: mockNavigateTo,
|
|
|
reLaunch: mockReLaunch,
|
|
|
openCustomerServiceChat: mockOpenCustomerServiceChat,
|
|
|
+ getSystemInfoSync: () => ({
|
|
|
+ statusBarHeight: 20
|
|
|
+ }),
|
|
|
+ getMenuButtonBoundingClientRect: () => ({
|
|
|
+ width: 87,
|
|
|
+ height: 32,
|
|
|
+ top: 48,
|
|
|
+ right: 314,
|
|
|
+ bottom: 80,
|
|
|
+ left: 227
|
|
|
+ })
|
|
|
}))
|
|
|
|
|
|
// Mock TabBarLayout 组件
|
|
|
@@ -125,13 +129,28 @@ jest.mock('@/utils/auth', () => ({
|
|
|
}))
|
|
|
}))
|
|
|
|
|
|
-// Mock cn utility
|
|
|
+// Mock React Query hooks
|
|
|
+const mockUseQuery = jest.fn()
|
|
|
+const mockUseMutation = jest.fn()
|
|
|
+
|
|
|
+jest.mock('@tanstack/react-query', () => {
|
|
|
+ const actual = jest.requireActual('@tanstack/react-query')
|
|
|
+ return {
|
|
|
+ ...actual,
|
|
|
+ useQuery: (options: any) => mockUseQuery(options),
|
|
|
+ useMutation: (options: any) => mockUseMutation(options)
|
|
|
+ }
|
|
|
+})
|
|
|
+
|
|
|
+// Mock cn工具函数
|
|
|
jest.mock('@/utils/cn', () => ({
|
|
|
- cn: jest.fn((...args) => args.join(' '))
|
|
|
+ cn: (...inputs: any[]) => inputs.join(' ')
|
|
|
}))
|
|
|
|
|
|
-// Mock CSS imports
|
|
|
-jest.mock('../../src/pages/profile/index.css', () => ({}))
|
|
|
+// Mock platform工具
|
|
|
+jest.mock('@/utils/platform', () => ({
|
|
|
+ isWeapp: () => false
|
|
|
+}))
|
|
|
|
|
|
// 创建测试用的 QueryClient
|
|
|
const createTestQueryClient = () => new QueryClient({
|
|
|
@@ -159,6 +178,17 @@ describe('个人中心页面测试', () => {
|
|
|
// 设置环境变量
|
|
|
process.env.TARO_APP_WX_CORP_ID = 'wwc6d7911e2d23b7fb'
|
|
|
process.env.TARO_APP_WX_KEFU_URL = 'https://work.weixin.qq.com/kfid/kfc5f4d729bc3c893d7'
|
|
|
+
|
|
|
+ // 初始化 React Query mock
|
|
|
+ mockUseQuery.mockImplementation(() => ({
|
|
|
+ data: null,
|
|
|
+ isLoading: false
|
|
|
+ }))
|
|
|
+
|
|
|
+ mockUseMutation.mockImplementation((options) => ({
|
|
|
+ mutateAsync: options.mutationFn,
|
|
|
+ isPending: false
|
|
|
+ }))
|
|
|
})
|
|
|
|
|
|
test('应该正确渲染个人中心页面', () => {
|
|
|
@@ -173,7 +203,7 @@ describe('个人中心页面测试', () => {
|
|
|
|
|
|
// 检查用户信息
|
|
|
expect(screen.getByText('测试用户')).toBeInTheDocument()
|
|
|
- expect(screen.getByText('ID: 0001')).toBeInTheDocument()
|
|
|
+ expect(screen.getByText('ID: 1')).toBeInTheDocument()
|
|
|
|
|
|
// 检查功能菜单
|
|
|
expect(screen.getByText('我的服务')).toBeInTheDocument()
|