import { describe, it, expect } from 'vitest'
import { mount } from '@vue/test-utils'
import MenuItem from '@/components/MenuItem.vue'

describe('MenuItem 组件', () => {
  it('应该正确接收菜单项 props', () => {
    const menu = {
      id: 1,
      name: '仪表盘',
      path: '/dashboard',
      icon: 'Odometer',
      sort: 1
    }

    const wrapper = mount(MenuItem, {
      props: { menu },
      global: {
        stubs: {
          'el-menu-item': {
            template: '<div><slot /></div>'
          },
          'el-sub-menu': {
            template: '<div><slot name="title" /><slot /></div>'
          },
          'el-icon': {
            template: '<div><slot /></div>'
          }
        }
      }
    })

    expect(wrapper.props('menu')).toEqual(menu)
  })

  it('应该正确处理有子菜单的菜单项', () => {
    const menu = {
      id: 2,
      name: '系统管理',
      path: '/system',
      icon: 'Setting',
      sort: 2,
      children: [
        {
          id: 3,
          name: '用户管理',
          path: '/users',
          sort: 1
        }
      ]
    }

    const wrapper = mount(MenuItem, {
      props: { menu },
      global: {
        stubs: {
          'el-menu-item': {
            template: '<div><slot /></div>'
          },
          'el-sub-menu': {
            template: '<div><slot name="title" /><slot /></div>'
          },
          'el-icon': {
            template: '<div><slot /></div>'
          }
        }
      }
    })

    expect(wrapper.props('menu')).toEqual(menu)
    expect(wrapper.props('menu').children).toHaveLength(1)
  })
})