mini-starter/mini/tests/unit/pay-success-page.test.tsx

/**
 * 支付成功页面组件测试
 */

import React from 'react'
import { render, screen, fireEvent } from '@testing-library/react'
import '@testing-library/jest-dom'
import PaySuccessPage from '@/pages/pay-success/index'

// Mock Taro相关API
const mockNavigateTo = jest.fn()
const mockUseRouter = jest.fn()
const mockUseLoad = jest.fn()

jest.mock('@tarojs/taro', () => ({
  useRouter: () => mockUseRouter(),
  navigateTo: mockNavigateTo,
  useLoad: (callback: any) => mockUseLoad(callback)
}))

describe('PaySuccessPage', () => {
  beforeEach(() => {
    mockUseRouter.mockReturnValue({
      params: {
        totalPrice: '100',
        passengerCount: '2',
        orderId: '123'
      }
    })

    mockUseLoad.mockImplementation((callback) => {
      if (callback) callback()
    })

    mockNavigateTo.mockClear()
  })

  it('should render payment success page correctly', () => {
    render(<PaySuccessPage />)

    expect(screen.getByText('支付成功！')).toBeInTheDocument()
    expect(screen.getByText('感谢您的信任与支持')).toBeInTheDocument()
    expect(screen.getByText('¥100')).toBeInTheDocument()
    expect(screen.getByText('2张')).toBeInTheDocument()
  })

  it('should handle view order button click', () => {
    render(<PaySuccessPage />)

    const viewOrderButton = screen.getByText('查看订单')
    fireEvent.click(viewOrderButton)

    expect(mockNavigateTo).toHaveBeenCalledWith({
      url: '/pages/orders/orders'
    })
  })

  it('should handle back to home button click', () => {
    render(<PaySuccessPage />)

    const backToHomeButton = screen.getByText('返回首页')
    fireEvent.click(backToHomeButton)

    expect(mockNavigateTo).toHaveBeenCalledWith({
      url: '/pages/home/index'
    })
  })

  it('should handle missing parameters gracefully', () => {
    mockUseRouter.mockReturnValue({
      params: {} // 缺少参数
    })

    render(<PaySuccessPage />)

    // 应该使用默认值渲染
    expect(screen.getByText('¥0')).toBeInTheDocument()
    expect(screen.getByText('0张')).toBeInTheDocument()
  })

  it('should log order ID on load', () => {
    const consoleSpy = jest.spyOn(console, 'log')

    render(<PaySuccessPage />)

    expect(consoleSpy).toHaveBeenCalledWith('支付成功页面加载，订单ID:', '123')

    consoleSpy.mockRestore()
  })

  it('should display correct payment information', () => {
    mockUseRouter.mockReturnValue({
      params: {
        totalPrice: '250.5',
        passengerCount: '3',
        orderId: '456'
      }
    })

    render(<PaySuccessPage />)

    expect(screen.getByText('¥250.5')).toBeInTheDocument()
    expect(screen.getByText('3张')).toBeInTheDocument()
  })

  it('should have proper navigation structure', () => {
    render(<PaySuccessPage />)

    // 检查导航栏
    expect(screen.getByText('支付成功')).toBeInTheDocument()

    // 检查按钮布局
    const buttons = screen.getAllByRole('button')
    expect(buttons).toHaveLength(2)
    expect(screen.getByText('返回首页')).toBeInTheDocument()
    expect(screen.getByText('查看订单')).toBeInTheDocument()
  })

  it('should handle navigation back', () => {
    const mockNavigateBack = jest.fn()
    jest.doMock('@tarojs/taro', () => ({
      useRouter: () => mockUseRouter(),
      navigateTo: mockNavigateTo,
      useLoad: (callback: any) => mockUseLoad(callback),
      navigateBack: mockNavigateBack
    }))

    render(<PaySuccessPage />)

    // 这里需要模拟导航栏返回按钮的点击
    // 由于组件结构，可能需要通过不同的方式触发
  })
})