94 lines
3.1 KiB
TypeScript
94 lines
3.1 KiB
TypeScript
|
import { mount } from '@vue/test-utils'
|
||
|
|
import { describe, expect, it } from 'vitest'
|
||
|
|
import { adminNavigation, filterAdminNavigation, type AdminNavigationNode } from '@/navigation/adminNavigation'
|
||
|
|
import AdminSidebarMenu from './AdminSidebarMenu.vue'
|
||
|
|
|
||
|
|
const stubs = {
|
||
|
|
'el-menu': {
|
||
|
|
props: ['defaultActive', 'collapse'],
|
||
|
|
template: '<nav :data-active="defaultActive" :data-collapsed="String(collapse)"><slot /></nav>',
|
||
|
|
},
|
||
|
|
'el-sub-menu': {
|
||
|
|
props: ['index'],
|
||
|
|
template: '<section data-kind="group" :data-index="index"><header><slot name="title" /></header><slot /></section>',
|
||
|
|
},
|
||
|
|
'el-menu-item': {
|
||
|
|
props: ['index'],
|
||
|
|
template: '<a data-kind="item" :data-index="index"><slot name="title" /><slot /></a>',
|
||
|
|
},
|
||
|
|
}
|
||
|
|
|
||
|
|
describe('AdminSidebarMenu', () => {
|
||
|
|
it('renders grouped page entries and forwards the active route', () => {
|
||
|
|
const wrapper = mount(AdminSidebarMenu, {
|
||
|
|
props: { items: adminNavigation, activePath: '/system/users', collapsed: false },
|
||
|
|
global: { stubs },
|
||
|
|
})
|
||
|
|
|
||
|
|
expect(wrapper.get('nav').attributes('data-active')).toBe('/system/users')
|
||
|
|
expect(wrapper.findAll('[data-kind="group"] header').map((node) => node.text())).toEqual([
|
||
|
|
'业务管理',
|
||
|
|
'基础资料',
|
||
|
|
'系统管理',
|
||
|
|
])
|
||
|
|
expect(wrapper.findAll('[data-kind="item"]').map((node) => node.attributes('data-index'))).toEqual([
|
||
|
|
'/customers',
|
||
|
|
'/customers/reviews',
|
||
|
|
'/warehouses',
|
||
|
|
'/orders/first-leg',
|
||
|
|
'/master-data/express-companies',
|
||
|
|
'/master-data/counterparties',
|
||
|
|
'/system/users',
|
||
|
|
'/system/roles',
|
||
|
|
'/system/permissions',
|
||
|
|
])
|
||
|
|
})
|
||
|
|
|
||
|
|
it('forwards desktop collapse state to Element Plus', () => {
|
||
|
|
const wrapper = mount(AdminSidebarMenu, {
|
||
|
|
props: { items: adminNavigation, activePath: '/', collapsed: true },
|
||
|
|
global: { stubs },
|
||
|
|
})
|
||
|
|
|
||
|
|
expect(wrapper.get('nav').attributes('data-collapsed')).toBe('true')
|
||
|
|
})
|
||
|
|
|
||
|
|
it('renders only entries included in the filtered navigation input', () => {
|
||
|
|
const items = filterAdminNavigation(adminNavigation, new Set(['platform:permission:list']))
|
||
|
|
const wrapper = mount(AdminSidebarMenu, {
|
||
|
|
props: { items, activePath: '/', collapsed: false },
|
||
|
|
global: { stubs },
|
||
|
|
})
|
||
|
|
|
||
|
|
expect(wrapper.text()).toContain('菜单权限')
|
||
|
|
expect(wrapper.text()).not.toContain('客户管理')
|
||
|
|
})
|
||
|
|
|
||
|
|
it('recursively renders three navigation levels', () => {
|
||
|
|
const items: AdminNavigationNode[] = [{
|
||
|
|
key: 'operations',
|
||
|
|
title: '运营管理',
|
||
|
|
icon: adminNavigation[0].icon,
|
||
|
|
children: [{
|
||
|
|
key: 'shipment',
|
||
|
|
title: '运输管理',
|
||
|
|
icon: adminNavigation[0].icon,
|
||
|
|
children: [{
|
||
|
|
key: 'tracking',
|
||
|
|
title: '轨迹管理',
|
||
|
|
icon: adminNavigation[0].icon,
|
||
|
|
path: '/tracking',
|
||
|
|
permission: 'tracking:list',
|
||
|
|
}],
|
||
|
|
}],
|
||
|
|
}]
|
||
|
|
const wrapper = mount(AdminSidebarMenu, {
|
||
|
|
props: { items, activePath: '/tracking', collapsed: false },
|
||
|
|
global: { stubs },
|
||
|
|
})
|
||
|
|
|
||
|
|
expect(wrapper.findAll('[data-kind="group"]')).toHaveLength(2)
|
||
|
|
expect(wrapper.get('[data-kind="item"]').attributes('data-index')).toBe('/tracking')
|
||
|
|
})
|
||
|
|
})
|