/**
 * 侧栏菜单项：折叠态只显示图标。
 *
 * 回归背景：分组分支在折叠态走的是 G3Dropdown（触发器里只有图标），
 * 而叶子分支的名称没跟着折叠态隐藏 —— 折叠后行里仍是「图标 + 名称」，
 * 侧栏只剩 collapseWidth 那么宽（图标+间距就占掉二十几像素），
 * 名称被裁成一两个字加省略号，比不显示更糟。
 */

import { describe, expect, it } from 'vitest'
import { mount } from '@vue/test-utils'
import { ref } from 'vue'
import { createMemoryHistory, createRouter } from 'vue-router'
import SidebarMenuItem from '@/layouts/SidebarMenuItem.vue'
import type { SidebarMenuNode } from '@/types/menu'

const LEAF: SidebarMenuNode = {
  key: 'approval_todo',
  title: '我的待办',
  path: '/approval/todo',
  icon: { template: '<i class="stub-icon" />' },
}

function mountLeaf(collapsed: boolean) {
  return mount(SidebarMenuItem, {
    props: { item: LEAF, level: 0 },
    global: {
      plugins: [
        createRouter({
          history: createMemoryHistory(),
          routes: [{ path: '/approval/todo', component: { template: '<div />' } }],
        }),
      ],
      provide: {
        'sidebar-menu': {
          collapsed: ref(collapsed),
          isLeafActive: () => false,
          isGroupActive: () => false,
          isGroupOpen: () => false,
          toggleGroup: () => {},
          selectPath: () => {},
        },
      },
    },
  })
}

describe('SidebarMenuItem 叶子项', () => {
  it('展开态：图标与名称都在，不需要 title 提示', () => {
    const wrapper = mountLeaf(false)

    expect(wrapper.find('.stub-icon').exists()).toBe(true)
    expect(wrapper.find('.layout-sidebar__label').text()).toBe('我的待办')
    expect(wrapper.find('a').attributes('title')).toBeUndefined()
  })

  it('折叠态：只渲染图标，名称不进 DOM，改为 title 提示', () => {
    const wrapper = mountLeaf(true)

    expect(wrapper.find('.stub-icon').exists()).toBe(true)
    expect(wrapper.find('.layout-sidebar__label').exists()).toBe(false)
    expect(wrapper.find('a').attributes('title')).toBe('我的待办')
  })
})