rbac-permission-interface-impl

frontend/src/pages/users/__tests__/user-form.spec.ts

@@ -1,6 +1,7 @@
 import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
 import { mount, flushPromises } from '@vue/test-utils'
 import { nextTick } from 'vue'
+import { message } from 'ant-design-vue'
 import UserFormModal from '@/components/UserFormModal.vue'
 
 Object.defineProperty(window, 'matchMedia', {
@@ -19,6 +20,7 @@ Object.defineProperty(window, 'matchMedia', {
 
 vi.mock('@/utils/request', () => ({
   api: {
+    get: vi.fn(),
     post: vi.fn(),
     put: vi.fn(),
   },
@@ -82,10 +84,10 @@ describe('UserFormModal', () => {
       expect(labels).toContain('密码')
     })
 
-    it('shows all four form fields', async () => {
+    it('shows all five form fields', async () => {
       await mountModal()
       const formItems = queryBody('.ant-form-item')
-      expect(formItems).toHaveLength(4) // username, password, email, status
+      expect(formItems).toHaveLength(5) // username, password, email, status, role
     })
 
     it('emits update:open false on cancel', async () => {
@@ -113,10 +115,10 @@ describe('UserFormModal', () => {
       expect(labels).not.toContain('密码')
     })
 
-    it('shows three form fields (no password)', async () => {
+    it('shows four form fields (no password)', async () => {
       await mountModal({ mode: 'edit', userData: mockUserData })
       const formItems = queryBody('.ant-form-item')
-      expect(formItems).toHaveLength(3) // username, email, status
+      expect(formItems).toHaveLength(4) // username, email, status, role
     })
 
     it('prefills form with user data', async () => {
@@ -133,6 +135,64 @@ describe('UserFormModal', () => {
     })
   })
 
+  describe('edge cases', () => {
+    it('shows warning when role list fetch fails', async () => {
+      const { api } = await import('@/utils/request')
+      vi.mocked(api.get).mockRejectedValueOnce(new Error('Network error'))
+      const warnSpy = vi.spyOn(message, 'warning').mockImplementation(() => ({}) as never)
+
+      // open=false then switch to true triggers fetchRoles
+      const w = await mountModal({ open: false })
+      await w.setProps({ open: true })
+      await flushPromises()
+      await nextTick()
+
+      expect(warnSpy).toHaveBeenCalledWith('获取角色列表失败，角色选择不可用')
+      warnSpy.mockRestore()
+    })
+
+    it('shows warning when user created but role assignment fails', async () => {
+      const { api } = await import('@/utils/request')
+      // fetchRoles succeeds
+      vi.mocked(api.get).mockResolvedValueOnce([{ id: 1, name: 'administrator' }])
+      // user create succeeds
+      vi.mocked(api.post).mockResolvedValueOnce({ id: 99 })
+      // role assignment fails
+      vi.mocked(api.put).mockRejectedValueOnce(new Error('Role assign failed'))
+
+      const warnSpy = vi.spyOn(message, 'warning').mockImplementation(() => ({}) as never)
+      const successSpy = vi.spyOn(message, 'success').mockImplementation(() => ({}) as never)
+
+      const w = await mountModal({ open: false })
+      await w.setProps({ open: true })
+      await flushPromises()
+      await nextTick()
+
+      // Set role_id via component internals
+      const vm = w.vm as unknown as { formState: { username: string; password: string; email: string; role_id: number | undefined } }
+      vm.formState.username = 'newuser'
+      vm.formState.password = 'pass123456'
+      vm.formState.email = 'new@test.com'
+      vm.formState.role_id = 1
+      await nextTick()
+
+      // Submit
+      const okBtn = document.body.querySelector('.ant-modal-footer .ant-btn-primary') as HTMLElement
+      okBtn?.click()
+      await flushPromises()
+      await nextTick()
+      await flushPromises()
+
+      // Role assignment warning shown but overall success emitted
+      expect(warnSpy).toHaveBeenCalledWith('用户已保存，但角色分配失败，请稍后在用户列表中重试')
+      expect(successSpy).toHaveBeenCalledWith('操作成功')
+      expect(w.emitted('success')).toBeTruthy()
+
+      warnSpy.mockRestore()
+      successSpy.mockRestore()
+    })
+  })
+
   describe('form submission', () => {
     it('calls api.post for create mode', async () => {
       const { api } = await import('@/utils/request')