import React from 'react'
import { render } from '@testing-library/react'
import CartPage from '@/pages/cart/index'

// Mock Taro相关API
jest.mock('@tarojs/taro', () => ({
  default: {
    navigateBack: jest.fn(),
    navigateTo: jest.fn(),
    showToast: jest.fn(),
    showModal: jest.fn(),
    getStorageSync: jest.fn(),
    setStorageSync: jest.fn(),
  },
}))

// Mock购物车hook
jest.mock('@/utils/cart', () => ({
  useCart: () => ({
    cart: {
      items: [
        {
          id: 1,
          name: '测试商品',
          price: 29.9,
          image: 'test-image.jpg',
          stock: 10,
          quantity: 2,
          spec: '红色/M',
        },
      ],
      totalAmount: 59.8,
      totalCount: 2,
    },
    updateQuantity: jest.fn(),
    removeFromCart: jest.fn(),
    clearCart: jest.fn(),
    isLoading: false,
  }),
}))

// Mock布局组件
jest.mock('@/layouts/tab-bar-layout', () => ({
  TabBarLayout: ({ children }: any) => <div data-testid="tabbar-layout">{children}</div>,
}))

// Mock导航栏组件
jest.mock('@/components/ui/navbar', () => ({
  Navbar: ({ title }: any) => <div data-testid="navbar">{title}</div>,
}))

// Mock按钮组件
jest.mock('@/components/ui/button', () => ({
  Button: ({ children }: any) => <button data-testid="button">{children}</button>,
}))

// Mock图片组件
jest.mock('@/components/ui/image', () => ({
  Image: ({ src }: any) => <img src={src} alt="商品图片" data-testid="image" />,
}))

describe('购物车页面基础测试', () => {
  it('应该正确渲染购物车页面', () => {
    const { getByTestId } = render(<CartPage />)

    expect(getByTestId('tabbar-layout')).toBeDefined()
    expect(getByTestId('navbar')).toBeDefined()
  })

  it('应该显示购物车标题', () => {
    const { getByTestId } = render(<CartPage />)
    const navbar = getByTestId('navbar')

    expect(navbar.textContent).toBe('购物车')
  })
})