Explorar o código

✅ test(activity-select): 完善活动选择页面测试

- 为页面头部日期添加 data-testid 以便测试定位
- 优化 Taro mock,为 navigateBack 添加可测试的 mock 函数
- 改进测试用例,使用 data-testid 定位日期元素提高测试稳定性
- 修复返回按钮测试中对 navigateBack mock 的引用方式
yourname hai 3 meses
pai
achega
09b01924af

+ 1 - 1
mini/src/pages/select-activity/ActivitySelectPage.tsx

@@ -221,7 +221,7 @@ const ActivitySelectPage: React.FC = () => {
         <Text className="text-lg font-bold text-white block">
           {routeInfo.fromCity} → {routeInfo.toCity}
         </Text>
-        <Text className="text-sm text-white/90 mt-1">
+        <Text className="text-sm text-white/90 mt-1" data-testid="header-date">
           {searchParams.date}
         </Text>
       </View>

+ 3 - 1
mini/tests/__mocks__/taroMock.ts

@@ -8,6 +8,7 @@ export const mockShowToast = jest.fn()
 export const mockShowLoading = jest.fn()
 export const mockHideLoading = jest.fn()
 export const mockNavigateTo = jest.fn()
+export const mockNavigateBack = jest.fn()
 export const mockSwitchTab = jest.fn()
 export const mockShowModal = jest.fn()
 export const mockReLaunch = jest.fn()
@@ -40,7 +41,7 @@ export default {
 
   // 导航相关
   navigateTo: mockNavigateTo,
-  navigateBack: jest.fn(),
+  navigateBack: mockNavigateBack,
   switchTab: mockSwitchTab,
   reLaunch: mockReLaunch,
   useRouter: () => mockUseRouter(),
@@ -75,6 +76,7 @@ export {
   mockHideLoading as hideLoading,
   mockShowModal as showModal,
   mockNavigateTo as navigateTo,
+  mockNavigateBack as navigateBack,
   mockSwitchTab as switchTab,
   mockReLaunch as reLaunch,
   mockUseRouter as useRouter,

+ 7 - 5
mini/tests/pages/ActivitySelectPage.test.tsx

@@ -4,7 +4,7 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
 import ActivitySelectPage from '../../src/pages/select-activity/ActivitySelectPage'
 
 // 导入 Taro mock 函数
-import taroMock, { mockUseRouter } from '../__mocks__/taroMock'
+import taroMock, { mockUseRouter, mockNavigateBack } from '../__mocks__/taroMock'
 
 // Mock API 客户端
 let mockRouteClient: any
@@ -228,7 +228,7 @@ describe('活动选择页面测试', () => {
 
     // 检查头部信息
     expect(screen.getByText('北京市 北京市 朝阳区 → 上海市 上海市 徐汇区')).toBeInTheDocument()
-    expect(screen.getByText('2025-11-01')).toBeInTheDocument()
+    expect(screen.getByTestId('header-date')).toHaveTextContent('2025-11-01')
 
     // 检查页面标题
     expect(screen.getByText('选择观看活动')).toBeInTheDocument()
@@ -403,10 +403,12 @@ describe('活动选择页面测试', () => {
 
     // 验证活动信息完整显示
     expect(screen.getByText('音乐节活动')).toBeInTheDocument()
-    expect(screen.getByText('2025-11-01')).toBeInTheDocument()
     expect(screen.getByText('朝阳区 · 北京市 · 北京市')).toBeInTheDocument()
     expect(screen.getByText('北京市朝阳区工人体育场北路')).toBeInTheDocument()
     expect(screen.getByText('到达:上海市 上海市 徐汇区')).toBeInTheDocument()
+
+    // 验证头部日期显示正确
+    expect(screen.getByTestId('header-date')).toHaveTextContent('2025-11-01')
   })
 
   test('应该处理返回按钮', async () => {
@@ -426,7 +428,7 @@ describe('活动选择页面测试', () => {
     fireEvent.click(backButton)
 
     // 检查返回导航被调用
-    expect(taroMock.navigateBack).toHaveBeenCalled()
+    expect(mockNavigateBack).toHaveBeenCalled()
   })
 
   test('应该处理不同的路由参数', async () => {
@@ -452,7 +454,7 @@ describe('活动选择页面测试', () => {
     // 检查头部信息显示正确的地区
     await waitFor(() => {
       expect(screen.getByText('广州市 广东省 天河区 → 深圳市 广东省 福田区')).toBeInTheDocument()
-      expect(screen.getByText('2025-11-02')).toBeInTheDocument()
+      expect(screen.getByTestId('header-date')).toHaveTextContent('2025-11-02')
     })
   })
 })