张翔
ae9be86527
- Move test files from src/test/ to src/__tests__/ - Follow Vitest convention for test directory naming - Improve test organization and discoverability
384 lines
9.7 KiB
TypeScript
384 lines
9.7 KiB
TypeScript
import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest'
|
|
import { mount } from '@vue/test-utils'
|
|
import { createRouter, createMemoryHistory } from 'vue-router'
|
|
import RoleManagement from '@/views/system/RoleManagement.vue'
|
|
|
|
vi.mock('vue-router')
|
|
vi.mock('element-plus', () => ({
|
|
ElMessage: {
|
|
success: vi.fn(),
|
|
error: vi.fn(),
|
|
},
|
|
ElMessageBox: {
|
|
confirm: vi.fn(),
|
|
},
|
|
}))
|
|
|
|
vi.mock('@/api/role.api', () => ({
|
|
roleApi: {
|
|
getPage: vi.fn(),
|
|
create: vi.fn(),
|
|
update: vi.fn(),
|
|
delete: vi.fn(),
|
|
getAll: vi.fn(),
|
|
},
|
|
}))
|
|
|
|
vi.mock('@/api/permission.api', () => ({
|
|
permissionApi: {
|
|
getAll: vi.fn(),
|
|
},
|
|
}))
|
|
|
|
describe('RoleManagement Component', () => {
|
|
let router: any
|
|
let wrapper: any
|
|
|
|
beforeEach(() => {
|
|
router = createRouter({
|
|
history: createMemoryHistory(),
|
|
routes: [
|
|
{ path: '/', component: { template: '<div>Home</div>' } },
|
|
],
|
|
})
|
|
|
|
vi.clearAllMocks()
|
|
})
|
|
|
|
afterEach(() => {
|
|
if (wrapper) {
|
|
wrapper.unmount()
|
|
}
|
|
})
|
|
|
|
describe('component initialization', () => {
|
|
it('should render role management container', () => {
|
|
wrapper = mount(RoleManagement, {
|
|
global: {
|
|
plugins: [router],
|
|
stubs: {
|
|
'el-card': true,
|
|
'el-input': true,
|
|
'el-button': true,
|
|
'el-table': true,
|
|
'el-table-column': true,
|
|
'el-tag': true,
|
|
'el-pagination': true,
|
|
'el-dialog': true,
|
|
'el-form': true,
|
|
'el-form-item': true,
|
|
'el-tree': true,
|
|
'el-icon': true,
|
|
},
|
|
},
|
|
})
|
|
|
|
expect(wrapper.find('.role-management').exists()).toBe(true)
|
|
})
|
|
|
|
it('should initialize with empty search keyword', () => {
|
|
wrapper = mount(RoleManagement, {
|
|
global: {
|
|
plugins: [router],
|
|
stubs: {
|
|
'el-card': true,
|
|
'el-input': true,
|
|
'el-button': true,
|
|
'el-table': true,
|
|
'el-table-column': true,
|
|
'el-tag': true,
|
|
'el-pagination': true,
|
|
'el-dialog': true,
|
|
'el-form': true,
|
|
'el-form-item': true,
|
|
'el-tree': true,
|
|
'el-icon': true,
|
|
},
|
|
},
|
|
})
|
|
|
|
expect(wrapper.vm.searchKeyword).toBe('')
|
|
})
|
|
|
|
it('should initialize with empty data source', () => {
|
|
wrapper = mount(RoleManagement, {
|
|
global: {
|
|
plugins: [router],
|
|
stubs: {
|
|
'el-card': true,
|
|
'el-input': true,
|
|
'el-button': true,
|
|
'el-table': true,
|
|
'el-table-column': true,
|
|
'el-tag': true,
|
|
'el-pagination': true,
|
|
'el-dialog': true,
|
|
'el-form': true,
|
|
'el-form-item': true,
|
|
'el-tree': true,
|
|
'el-icon': true,
|
|
},
|
|
},
|
|
})
|
|
|
|
expect(wrapper.vm.dataSource).toEqual([])
|
|
})
|
|
|
|
it('should initialize with pagination on page 1', () => {
|
|
wrapper = mount(RoleManagement, {
|
|
global: {
|
|
plugins: [router],
|
|
stubs: {
|
|
'el-card': true,
|
|
'el-input': true,
|
|
'el-button': true,
|
|
'el-table': true,
|
|
'el-table-column': true,
|
|
'el-tag': true,
|
|
'el-pagination': true,
|
|
'el-dialog': true,
|
|
'el-form': true,
|
|
'el-form-item': true,
|
|
'el-tree': true,
|
|
'el-icon': true,
|
|
},
|
|
},
|
|
})
|
|
|
|
expect(wrapper.vm.pagination.current).toBe(1)
|
|
})
|
|
|
|
it('should initialize with modal visible false', () => {
|
|
wrapper = mount(RoleManagement, {
|
|
global: {
|
|
plugins: [router],
|
|
stubs: {
|
|
'el-card': true,
|
|
'el-input': true,
|
|
'el-button': true,
|
|
'el-table': true,
|
|
'el-table-column': true,
|
|
'el-tag': true,
|
|
'el-pagination': true,
|
|
'el-dialog': true,
|
|
'el-form': true,
|
|
'el-form-item': true,
|
|
'el-tree': true,
|
|
'el-icon': true,
|
|
},
|
|
},
|
|
})
|
|
|
|
expect(wrapper.vm.modalVisible).toBe(false)
|
|
})
|
|
|
|
it('should initialize with empty form state', () => {
|
|
wrapper = mount(RoleManagement, {
|
|
global: {
|
|
plugins: [router],
|
|
stubs: {
|
|
'el-card': true,
|
|
'el-input': true,
|
|
'el-button': true,
|
|
'el-table': true,
|
|
'el-table-column': true,
|
|
'el-tag': true,
|
|
'el-pagination': true,
|
|
'el-dialog': true,
|
|
'el-form': true,
|
|
'el-form-item': true,
|
|
'el-tree': true,
|
|
'el-icon': true,
|
|
},
|
|
},
|
|
})
|
|
|
|
expect(wrapper.vm.formState.roleName).toBe('')
|
|
expect(wrapper.vm.formState.roleKey).toBe('')
|
|
expect(wrapper.vm.formState.roleSort).toBe(1)
|
|
expect(wrapper.vm.formState.status).toBe(1)
|
|
expect(wrapper.vm.formState.permissions).toEqual([])
|
|
})
|
|
})
|
|
|
|
describe('search functionality', () => {
|
|
it('should have handleSearch method', () => {
|
|
wrapper = mount(RoleManagement, {
|
|
global: {
|
|
plugins: [router],
|
|
stubs: {
|
|
'el-card': true,
|
|
'el-input': true,
|
|
'el-button': true,
|
|
'el-table': true,
|
|
'el-table-column': true,
|
|
'el-tag': true,
|
|
'el-pagination': true,
|
|
'el-dialog': true,
|
|
'el-form': true,
|
|
'el-form-item': true,
|
|
'el-tree': true,
|
|
'el-icon': true,
|
|
},
|
|
},
|
|
})
|
|
|
|
expect(typeof wrapper.vm.handleSearch).toBe('function')
|
|
})
|
|
|
|
it('should update search keyword when input changes', async () => {
|
|
wrapper = mount(RoleManagement, {
|
|
global: {
|
|
plugins: [router],
|
|
stubs: {
|
|
'el-card': true,
|
|
'el-input': true,
|
|
'el-button': true,
|
|
'el-table': true,
|
|
'el-table-column': true,
|
|
'el-tag': true,
|
|
'el-pagination': true,
|
|
'el-dialog': true,
|
|
'el-form': true,
|
|
'el-form-item': true,
|
|
'el-tree': true,
|
|
'el-icon': true,
|
|
},
|
|
},
|
|
})
|
|
|
|
wrapper.vm.searchKeyword = 'admin'
|
|
await wrapper.vm.$nextTick()
|
|
|
|
expect(wrapper.vm.searchKeyword).toBe('admin')
|
|
})
|
|
})
|
|
|
|
describe('add role functionality', () => {
|
|
it('should have handleAdd method', () => {
|
|
wrapper = mount(RoleManagement, {
|
|
global: {
|
|
plugins: [router],
|
|
stubs: {
|
|
'el-card': true,
|
|
'el-input': true,
|
|
'el-button': true,
|
|
'el-table': true,
|
|
'el-table-column': true,
|
|
'el-tag': true,
|
|
'el-pagination': true,
|
|
'el-dialog': true,
|
|
'el-form': true,
|
|
'el-form-item': true,
|
|
'el-tree': true,
|
|
'el-icon': true,
|
|
},
|
|
},
|
|
})
|
|
|
|
expect(typeof wrapper.vm.handleAdd).toBe('function')
|
|
})
|
|
})
|
|
|
|
describe('pagination functionality', () => {
|
|
it('should have handleTableChange method', () => {
|
|
wrapper = mount(RoleManagement, {
|
|
global: {
|
|
plugins: [router],
|
|
stubs: {
|
|
'el-card': true,
|
|
'el-input': true,
|
|
'el-button': true,
|
|
'el-table': true,
|
|
'el-table-column': true,
|
|
'el-tag': true,
|
|
'el-pagination': true,
|
|
'el-dialog': true,
|
|
'el-form': true,
|
|
'el-form-item': true,
|
|
'el-tree': true,
|
|
'el-icon': true,
|
|
},
|
|
},
|
|
})
|
|
|
|
expect(typeof wrapper.vm.handleTableChange).toBe('function')
|
|
})
|
|
|
|
it('should have handleSizeChange method', () => {
|
|
wrapper = mount(RoleManagement, {
|
|
global: {
|
|
plugins: [router],
|
|
stubs: {
|
|
'el-card': true,
|
|
'el-input': true,
|
|
'el-button': true,
|
|
'el-table': true,
|
|
'el-table-column': true,
|
|
'el-tag': true,
|
|
'el-pagination': true,
|
|
'el-dialog': true,
|
|
'el-form': true,
|
|
'el-form-item': true,
|
|
'el-tree': true,
|
|
'el-icon': true,
|
|
},
|
|
},
|
|
})
|
|
|
|
expect(typeof wrapper.vm.handleSizeChange).toBe('function')
|
|
})
|
|
})
|
|
|
|
describe('sort functionality', () => {
|
|
it('should have handleSortChange method', () => {
|
|
wrapper = mount(RoleManagement, {
|
|
global: {
|
|
plugins: [router],
|
|
stubs: {
|
|
'el-card': true,
|
|
'el-input': true,
|
|
'el-button': true,
|
|
'el-table': true,
|
|
'el-table-column': true,
|
|
'el-tag': true,
|
|
'el-pagination': true,
|
|
'el-dialog': true,
|
|
'el-form': true,
|
|
'el-form-item': true,
|
|
'el-tree': true,
|
|
'el-icon': true,
|
|
},
|
|
},
|
|
})
|
|
|
|
expect(typeof wrapper.vm.handleSortChange).toBe('function')
|
|
})
|
|
|
|
it('should initialize with default sort info', () => {
|
|
wrapper = mount(RoleManagement, {
|
|
global: {
|
|
plugins: [router],
|
|
stubs: {
|
|
'el-card': true,
|
|
'el-input': true,
|
|
'el-button': true,
|
|
'el-table': true,
|
|
'el-table-column': true,
|
|
'el-tag': true,
|
|
'el-pagination': true,
|
|
'el-dialog': true,
|
|
'el-form': true,
|
|
'el-form-item': true,
|
|
'el-tree': true,
|
|
'el-icon': true,
|
|
},
|
|
},
|
|
})
|
|
|
|
expect(wrapper.vm.sortInfo.sortBy).toBe('id')
|
|
expect(wrapper.vm.sortInfo.sortOrder).toBe('asc')
|
|
})
|
|
})
|
|
})
|