2024-09-14 21:35:12 +08:00
|
|
|
import type { Router, RouteRecordRaw } from 'vue-router';
|
|
|
|
|
|
|
|
import { createRouter, createWebHistory } from 'vue-router';
|
2024-06-02 15:04:37 +08:00
|
|
|
|
2024-09-14 17:27:25 +08:00
|
|
|
import { describe, expect, it, vi } from 'vitest';
|
2024-09-14 21:35:12 +08:00
|
|
|
|
2024-09-14 17:27:25 +08:00
|
|
|
import { generateMenus } from '../generate-menus';
|
|
|
|
|
2024-06-02 15:04:37 +08:00
|
|
|
// Nested route setup to test child inclusion and hideChildrenInMenu functionality
|
|
|
|
|
2024-06-30 15:03:37 +08:00
|
|
|
describe('generateMenus', () => {
|
2024-06-02 21:33:31 +08:00
|
|
|
// 模拟路由数据
|
|
|
|
const mockRoutes = [
|
|
|
|
{
|
|
|
|
meta: { icon: 'home-icon', title: '首页' },
|
|
|
|
name: 'home',
|
|
|
|
path: '/home',
|
|
|
|
},
|
|
|
|
{
|
|
|
|
meta: { hideChildrenInMenu: true, icon: 'about-icon', title: '关于' },
|
|
|
|
name: 'about',
|
|
|
|
path: '/about',
|
|
|
|
children: [
|
|
|
|
{
|
|
|
|
path: 'team',
|
|
|
|
name: 'team',
|
|
|
|
meta: { icon: 'team-icon', title: '团队' },
|
|
|
|
},
|
|
|
|
],
|
|
|
|
},
|
|
|
|
] as RouteRecordRaw[];
|
|
|
|
|
|
|
|
// 模拟 Vue 路由器实例
|
|
|
|
const mockRouter = {
|
|
|
|
getRoutes: vi.fn(() => [
|
|
|
|
{ name: 'home', path: '/home' },
|
|
|
|
{ name: 'about', path: '/about' },
|
|
|
|
{ name: 'team', path: '/about/team' },
|
|
|
|
]),
|
|
|
|
};
|
|
|
|
|
2024-06-02 15:04:37 +08:00
|
|
|
it('the correct menu list should be generated according to the route', async () => {
|
|
|
|
const expectedMenus = [
|
|
|
|
{
|
|
|
|
badge: undefined,
|
|
|
|
badgeType: undefined,
|
|
|
|
badgeVariants: undefined,
|
|
|
|
icon: 'home-icon',
|
|
|
|
name: '首页',
|
2024-06-02 23:46:18 +08:00
|
|
|
order: undefined,
|
2024-06-02 15:04:37 +08:00
|
|
|
parent: undefined,
|
|
|
|
parents: undefined,
|
|
|
|
path: '/home',
|
2024-07-19 01:26:13 +08:00
|
|
|
show: true,
|
2024-06-02 15:04:37 +08:00
|
|
|
children: [],
|
|
|
|
},
|
|
|
|
{
|
|
|
|
badge: undefined,
|
|
|
|
badgeType: undefined,
|
|
|
|
badgeVariants: undefined,
|
|
|
|
icon: 'about-icon',
|
|
|
|
name: '关于',
|
2024-06-02 23:46:18 +08:00
|
|
|
order: undefined,
|
2024-06-02 15:04:37 +08:00
|
|
|
parent: undefined,
|
|
|
|
parents: undefined,
|
|
|
|
path: '/about',
|
2024-07-19 01:26:13 +08:00
|
|
|
show: true,
|
2024-06-02 15:04:37 +08:00
|
|
|
children: [],
|
|
|
|
},
|
|
|
|
];
|
|
|
|
|
2025-05-03 18:05:26 +08:00
|
|
|
const menus = generateMenus(mockRoutes, mockRouter as any);
|
2024-06-02 15:04:37 +08:00
|
|
|
expect(menus).toEqual(expectedMenus);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('includes additional meta properties in menu items', async () => {
|
|
|
|
const mockRoutesWithMeta = [
|
|
|
|
{
|
2024-06-02 23:46:18 +08:00
|
|
|
meta: { icon: 'user-icon', order: 1, title: 'Profile' },
|
2024-06-02 15:04:37 +08:00
|
|
|
name: 'profile',
|
|
|
|
path: '/profile',
|
|
|
|
},
|
|
|
|
] as RouteRecordRaw[];
|
|
|
|
|
2025-05-03 18:05:26 +08:00
|
|
|
const menus = generateMenus(mockRoutesWithMeta, mockRouter as any);
|
2024-06-02 15:04:37 +08:00
|
|
|
expect(menus).toEqual([
|
|
|
|
{
|
|
|
|
badge: undefined,
|
|
|
|
badgeType: undefined,
|
|
|
|
badgeVariants: undefined,
|
|
|
|
icon: 'user-icon',
|
|
|
|
name: 'Profile',
|
2024-06-02 23:46:18 +08:00
|
|
|
order: 1,
|
2024-06-02 15:04:37 +08:00
|
|
|
parent: undefined,
|
|
|
|
parents: undefined,
|
|
|
|
path: '/profile',
|
2024-07-19 01:26:13 +08:00
|
|
|
show: true,
|
2024-06-02 15:04:37 +08:00
|
|
|
children: [],
|
|
|
|
},
|
|
|
|
]);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('handles dynamic route parameters correctly', async () => {
|
|
|
|
const mockRoutesWithParams = [
|
|
|
|
{
|
|
|
|
meta: { icon: 'details-icon', title: 'User Details' },
|
|
|
|
name: 'userDetails',
|
|
|
|
path: '/users/:userId',
|
|
|
|
},
|
|
|
|
] as RouteRecordRaw[];
|
|
|
|
|
2025-05-03 18:05:26 +08:00
|
|
|
const menus = generateMenus(mockRoutesWithParams, mockRouter as any);
|
2024-06-02 15:04:37 +08:00
|
|
|
expect(menus).toEqual([
|
|
|
|
{
|
|
|
|
badge: undefined,
|
|
|
|
badgeType: undefined,
|
|
|
|
badgeVariants: undefined,
|
|
|
|
icon: 'details-icon',
|
|
|
|
name: 'User Details',
|
2024-06-02 23:46:18 +08:00
|
|
|
order: undefined,
|
2024-06-02 15:04:37 +08:00
|
|
|
parent: undefined,
|
|
|
|
parents: undefined,
|
|
|
|
path: '/users/:userId',
|
2024-07-19 01:26:13 +08:00
|
|
|
show: true,
|
2024-06-02 15:04:37 +08:00
|
|
|
children: [],
|
|
|
|
},
|
|
|
|
]);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('processes routes with redirects correctly', async () => {
|
|
|
|
const mockRoutesWithRedirect = [
|
|
|
|
{
|
|
|
|
name: 'redirectedRoute',
|
|
|
|
path: '/old-path',
|
|
|
|
redirect: '/new-path',
|
|
|
|
},
|
|
|
|
{
|
|
|
|
meta: { icon: 'path-icon', title: 'New Path' },
|
|
|
|
name: 'newPath',
|
|
|
|
path: '/new-path',
|
|
|
|
},
|
|
|
|
] as RouteRecordRaw[];
|
|
|
|
|
2025-05-03 18:05:26 +08:00
|
|
|
const menus = generateMenus(mockRoutesWithRedirect, mockRouter as any);
|
2024-06-02 15:04:37 +08:00
|
|
|
expect(menus).toEqual([
|
2024-06-30 15:03:37 +08:00
|
|
|
// Assuming your generateMenus function excludes redirect routes from the menu
|
2024-06-02 15:04:37 +08:00
|
|
|
{
|
|
|
|
badge: undefined,
|
|
|
|
badgeType: undefined,
|
|
|
|
badgeVariants: undefined,
|
|
|
|
icon: undefined,
|
|
|
|
name: 'redirectedRoute',
|
2024-06-02 23:46:18 +08:00
|
|
|
order: undefined,
|
2024-06-02 15:04:37 +08:00
|
|
|
parent: undefined,
|
|
|
|
parents: undefined,
|
|
|
|
path: '/old-path',
|
2024-07-19 01:26:13 +08:00
|
|
|
show: true,
|
2024-06-02 15:04:37 +08:00
|
|
|
children: [],
|
|
|
|
},
|
|
|
|
{
|
|
|
|
badge: undefined,
|
|
|
|
badgeType: undefined,
|
|
|
|
badgeVariants: undefined,
|
|
|
|
icon: 'path-icon',
|
|
|
|
name: 'New Path',
|
2024-06-02 23:46:18 +08:00
|
|
|
order: undefined,
|
2024-06-02 15:04:37 +08:00
|
|
|
parent: undefined,
|
|
|
|
parents: undefined,
|
|
|
|
path: '/new-path',
|
2024-07-19 01:26:13 +08:00
|
|
|
show: true,
|
2024-06-02 15:04:37 +08:00
|
|
|
children: [],
|
|
|
|
},
|
|
|
|
]);
|
|
|
|
});
|
2024-06-02 21:33:31 +08:00
|
|
|
|
|
|
|
const routes: any = [
|
|
|
|
{
|
2024-06-02 23:46:18 +08:00
|
|
|
meta: { order: 2, title: 'Home' },
|
2024-06-02 21:33:31 +08:00
|
|
|
name: 'home',
|
|
|
|
path: '/',
|
|
|
|
},
|
|
|
|
{
|
2024-06-02 23:46:18 +08:00
|
|
|
meta: { order: 1, title: 'About' },
|
2024-06-02 21:33:31 +08:00
|
|
|
name: 'about',
|
|
|
|
path: '/about',
|
|
|
|
},
|
|
|
|
];
|
|
|
|
|
|
|
|
const router: Router = createRouter({
|
|
|
|
history: createWebHistory(),
|
|
|
|
routes,
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should generate menu list with correct order', async () => {
|
2025-05-03 18:05:26 +08:00
|
|
|
const menus = generateMenus(routes, router);
|
2024-06-02 21:33:31 +08:00
|
|
|
const expectedMenus = [
|
|
|
|
{
|
|
|
|
badge: undefined,
|
|
|
|
badgeType: undefined,
|
|
|
|
badgeVariants: undefined,
|
|
|
|
icon: undefined,
|
|
|
|
name: 'About',
|
2024-06-02 23:46:18 +08:00
|
|
|
order: 1,
|
2024-06-02 21:33:31 +08:00
|
|
|
parent: undefined,
|
|
|
|
parents: undefined,
|
|
|
|
path: '/about',
|
2024-07-19 01:26:13 +08:00
|
|
|
show: true,
|
2024-06-02 21:33:31 +08:00
|
|
|
children: [],
|
|
|
|
},
|
|
|
|
{
|
|
|
|
badge: undefined,
|
|
|
|
badgeType: undefined,
|
|
|
|
badgeVariants: undefined,
|
|
|
|
icon: undefined,
|
|
|
|
name: 'Home',
|
2024-06-02 23:46:18 +08:00
|
|
|
order: 2,
|
2024-06-02 21:33:31 +08:00
|
|
|
parent: undefined,
|
|
|
|
parents: undefined,
|
|
|
|
path: '/',
|
2024-07-19 01:26:13 +08:00
|
|
|
show: true,
|
2024-06-02 21:33:31 +08:00
|
|
|
children: [],
|
|
|
|
},
|
|
|
|
];
|
|
|
|
|
|
|
|
expect(menus).toEqual(expectedMenus);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('should handle empty routes', async () => {
|
|
|
|
const emptyRoutes: any[] = [];
|
2025-05-03 18:05:26 +08:00
|
|
|
const menus = generateMenus(emptyRoutes, router);
|
2024-06-02 21:33:31 +08:00
|
|
|
expect(menus).toEqual([]);
|
|
|
|
});
|
2024-06-02 15:04:37 +08:00
|
|
|
});
|