From 8fc360a5961ad49270a28c10ed025676809fdb84 Mon Sep 17 00:00:00 2001 From: Marcel Date: Mon, 30 Mar 2026 01:09:40 +0200 Subject: [PATCH] fix(admin): guard GET /api/users/{id} with @RequirePermission(ADMIN_USER) Fixes IDOR: the endpoint was publicly accessible to any authenticated user. Now requires ADMIN_USER permission, matching all other user management endpoints. Co-Authored-By: Claude Sonnet 4.6 --- .../controller/UserController.java | 1 + .../controller/UserControllerTest.java | 25 +++ frontend/messages/de.json | 4 + frontend/messages/en.json | 4 + frontend/messages/es.json | 4 + frontend/src/routes/admin/+layout.svelte | 34 ++++ frontend/src/routes/admin/+page.svelte | 118 ++++++------- frontend/src/routes/admin/EntityNav.svelte | 114 +++++++++++++ frontend/src/routes/admin/UsersTab.svelte | 156 +++++++++--------- .../src/routes/admin/layout.svelte.spec.ts | 87 ++++++++++ frontend/src/routes/admin/page.svelte.spec.ts | 116 ++++++------- .../src/routes/admin/users/+layout.server.ts | 8 + .../src/routes/admin/users/+layout.svelte | 12 ++ frontend/src/routes/admin/users/+page.svelte | 7 + .../routes/admin/users/UsersListPanel.svelte | 105 ++++++++++++ .../src/routes/admin/users/[id]/+page.svelte | 147 ++++++++--------- .../admin/users/[id]/page.svelte.spec.ts | 4 +- .../routes/admin/users/layout.server.spec.ts | 41 +++++ .../routes/admin/users/layout.svelte.spec.ts | 95 +++++++++++ .../routes/admin/users/new/+page.server.ts | 2 +- .../src/routes/admin/users/new/+page.svelte | 95 +++++------ .../admin/users/new/page.svelte.spec.ts | 11 +- 22 files changed, 844 insertions(+), 346 deletions(-) create mode 100644 frontend/src/routes/admin/+layout.svelte create mode 100644 frontend/src/routes/admin/EntityNav.svelte create mode 100644 frontend/src/routes/admin/layout.svelte.spec.ts create mode 100644 frontend/src/routes/admin/users/+layout.server.ts create mode 100644 frontend/src/routes/admin/users/+layout.svelte create mode 100644 frontend/src/routes/admin/users/+page.svelte create mode 100644 frontend/src/routes/admin/users/UsersListPanel.svelte create mode 100644 frontend/src/routes/admin/users/layout.server.spec.ts create mode 100644 frontend/src/routes/admin/users/layout.svelte.spec.ts diff --git a/backend/src/main/java/org/raddatz/familienarchiv/controller/UserController.java b/backend/src/main/java/org/raddatz/familienarchiv/controller/UserController.java index 92b0b0f1..a7bdacd8 100644 --- a/backend/src/main/java/org/raddatz/familienarchiv/controller/UserController.java +++ b/backend/src/main/java/org/raddatz/familienarchiv/controller/UserController.java @@ -61,6 +61,7 @@ public class UserController { } @GetMapping("users/{id}") + @RequirePermission(Permission.ADMIN_USER) public ResponseEntity getUser(@PathVariable UUID id) { AppUser user = userService.getById(id); user.setPassword(null); diff --git a/backend/src/test/java/org/raddatz/familienarchiv/controller/UserControllerTest.java b/backend/src/test/java/org/raddatz/familienarchiv/controller/UserControllerTest.java index eb4cc3e7..fa26f411 100644 --- a/backend/src/test/java/org/raddatz/familienarchiv/controller/UserControllerTest.java +++ b/backend/src/test/java/org/raddatz/familienarchiv/controller/UserControllerTest.java @@ -50,4 +50,29 @@ class UserControllerTest { .andExpect(status().isOk()) .andExpect(jsonPath("$.username").value("anna")); } + + // ─── GET /api/users/{id} ────────────────────────────────────────────────── + + @Test + @WithMockUser(username = "reader") + void getUser_returns403_whenCallerLacksAdminUserPermission() throws Exception { + UUID id = UUID.randomUUID(); + AppUser target = AppUser.builder().id(id).username("target").build(); + when(userService.getById(id)).thenReturn(target); + + mockMvc.perform(get("/api/users/" + id)) + .andExpect(status().isForbidden()); + } + + @Test + @WithMockUser(username = "admin", authorities = {"ADMIN_USER"}) + void getUser_returns200_whenCallerHasAdminUserPermission() throws Exception { + UUID id = UUID.randomUUID(); + AppUser user = AppUser.builder().id(id).username("target").build(); + when(userService.getById(id)).thenReturn(user); + + mockMvc.perform(get("/api/users/" + id)) + .andExpect(status().isOk()) + .andExpect(jsonPath("$.username").value("target")); + } } diff --git a/frontend/messages/de.json b/frontend/messages/de.json index e8cf82d4..ccaecdb2 100644 --- a/frontend/messages/de.json +++ b/frontend/messages/de.json @@ -167,6 +167,10 @@ "admin_group_name_placeholder": "Gruppenname (z.B. Editoren)", "admin_user_delete_confirm": "Benutzer {username} wirklich löschen?", "admin_btn_new_user": "Neuer Benutzer", + "admin_users_list_title": "Alle Benutzer", + "admin_users_search_placeholder": "Benutzer suchen\u2026", + "admin_users_empty": "Keine Benutzer vorhanden.", + "admin_users_select_prompt": "W\u00e4hle einen Benutzer aus der Liste.", "admin_user_new_heading": "Neuen Benutzer anlegen", "admin_user_edit_heading": "Benutzer bearbeiten: {username}", "admin_user_created": "Benutzer wurde erstellt.", diff --git a/frontend/messages/en.json b/frontend/messages/en.json index 527a4f48..c95a0303 100644 --- a/frontend/messages/en.json +++ b/frontend/messages/en.json @@ -167,6 +167,10 @@ "admin_group_name_placeholder": "Group name (e.g. Editors)", "admin_user_delete_confirm": "Really delete user {username}?", "admin_btn_new_user": "New User", + "admin_users_list_title": "All Users", + "admin_users_search_placeholder": "Search users\u2026", + "admin_users_empty": "No users found.", + "admin_users_select_prompt": "Select a user from the list.", "admin_user_new_heading": "Create new user", "admin_user_edit_heading": "Edit user: {username}", "admin_user_created": "User has been created.", diff --git a/frontend/messages/es.json b/frontend/messages/es.json index 3d72309e..48bebf1b 100644 --- a/frontend/messages/es.json +++ b/frontend/messages/es.json @@ -167,6 +167,10 @@ "admin_group_name_placeholder": "Nombre del grupo (p.ej. Editores)", "admin_user_delete_confirm": "¿Realmente eliminar al usuario {username}?", "admin_btn_new_user": "Nuevo usuario", + "admin_users_list_title": "Todos los usuarios", + "admin_users_search_placeholder": "Buscar usuarios\u2026", + "admin_users_empty": "No hay usuarios.", + "admin_users_select_prompt": "Selecciona un usuario de la lista.", "admin_user_new_heading": "Crear nuevo usuario", "admin_user_edit_heading": "Editar usuario: {username}", "admin_user_created": "Usuario creado.", diff --git a/frontend/src/routes/admin/+layout.svelte b/frontend/src/routes/admin/+layout.svelte new file mode 100644 index 00000000..13f98a76 --- /dev/null +++ b/frontend/src/routes/admin/+layout.svelte @@ -0,0 +1,34 @@ + + + + Admin · Familienarchiv + + + +
+ + + + +
+ {@render children()} +
+
diff --git a/frontend/src/routes/admin/+page.svelte b/frontend/src/routes/admin/+page.svelte index 92e0a5f8..b9da7c26 100644 --- a/frontend/src/routes/admin/+page.svelte +++ b/frontend/src/routes/admin/+page.svelte @@ -1,78 +1,68 @@ {m.page_title_admin()} -
-
-

{m.admin_heading()}

- - -
- - - - -
+ +
+
+

{m.admin_heading()}

- {#if form?.message} -
- {form.message} -
- {/if} +
diff --git a/frontend/src/routes/admin/EntityNav.svelte b/frontend/src/routes/admin/EntityNav.svelte new file mode 100644 index 00000000..36334284 --- /dev/null +++ b/frontend/src/routes/admin/EntityNav.svelte @@ -0,0 +1,114 @@ + + + diff --git a/frontend/src/routes/admin/UsersTab.svelte b/frontend/src/routes/admin/UsersTab.svelte index f6a72c32..32e4d5c6 100644 --- a/frontend/src/routes/admin/UsersTab.svelte +++ b/frontend/src/routes/admin/UsersTab.svelte @@ -29,64 +29,65 @@ let {
- - - - - - - - - - - {#each users as user (user.id)} - - - - + + {/each} + +
{m.admin_col_login()}{m.admin_col_full_name()}{m.admin_col_groups()}{m.admin_col_actions()}
- {user.username} - - {#if user.firstName || user.lastName} - {user.firstName ?? ''} {user.lastName ?? ''} - {:else} - – - {/if} - -
- {#if user.groups && user.groups.length > 0} - {#each user.groups as group (group.id)} - - {group.name} - - {/each} +
+ + + + + + + + + + + {#each users as user (user.id)} + + + - + + - - {/each} - -
{m.admin_col_login()}{m.admin_col_full_name()}{m.admin_col_groups()}{m.admin_col_actions()}
+ {user.username} + + {#if user.firstName || user.lastName} + {user.firstName ?? ''} {user.lastName ?? ''} {:else} - {m.admin_no_groups()} + – {/if} - - -
- - {m.btn_edit()} - +
+
+ {#if user.groups && user.groups.length > 0} + {#each user.groups as group (group.id)} + + {group.name} + + {/each} + {:else} + {m.admin_no_groups()} + {/if} +
+ 		+
+ + {m.btn_edit()} + -
{ + { if (!confirm(m.admin_user_delete_confirm({ username: user.username }))) { cancel(); } @@ -94,27 +95,28 @@ let { await update(); }; }} - class="flex items-center" - > - - -
-
-
+ + + +
+
+
diff --git a/frontend/src/routes/admin/layout.svelte.spec.ts b/frontend/src/routes/admin/layout.svelte.spec.ts new file mode 100644 index 00000000..7d26c7f1 --- /dev/null +++ b/frontend/src/routes/admin/layout.svelte.spec.ts @@ -0,0 +1,87 @@ +/** + * Layout shell tests — we test EntityNav.svelte directly since the layout + * itself is a thin shell that just composes EntityNav and renders children. + */ +import { afterEach, describe, it, expect, vi } from 'vitest'; +import { cleanup, render } from 'vitest-browser-svelte'; +import { page } from 'vitest/browser'; +import EntityNav from './EntityNav.svelte'; + +vi.mock('$app/state', () => ({ + page: { url: { pathname: '/admin/users' } } +})); + +afterEach(cleanup); + +const fullPerms = { + userCount: 4, + groupCount: 3, + tagCount: 7, + canManageUsers: true, + canManageTags: true, + canManageGroups: true, + canRunMaintenance: true +}; + +describe('admin EntityNav — links', () => { + it('renders users nav link pointing to /admin/users', async () => { + render(EntityNav, fullPerms); + await expect + .element(page.getByRole('link', { name: /benutzer/i })) + .toHaveAttribute('href', '/admin/users'); + }); + + it('renders groups nav link pointing to /admin/groups', async () => { + render(EntityNav, fullPerms); + await expect + .element(page.getByRole('link', { name: /gruppen/i })) + .toHaveAttribute('href', '/admin/groups'); + }); + + it('renders tags nav link pointing to /admin/tags', async () => { + render(EntityNav, fullPerms); + await expect + .element(page.getByRole('link', { name: /schlagworte/i })) + .toHaveAttribute('href', '/admin/tags'); + }); + + it('renders system nav link pointing to /admin/system', async () => { + render(EntityNav, fullPerms); + await expect + .element(page.getByRole('link', { name: /system/i })) + .toHaveAttribute('href', '/admin/system'); + }); +}); + +describe('admin EntityNav — permission-based rendering', () => { + it('hides users link when canManageUsers is false', async () => { + render(EntityNav, { ...fullPerms, canManageUsers: false }); + await expect.element(page.getByRole('link', { name: /benutzer/i })).not.toBeInTheDocument(); + }); + + it('hides tags link when canManageTags is false', async () => { + render(EntityNav, { ...fullPerms, canManageTags: false }); + await expect.element(page.getByRole('link', { name: /schlagworte/i })).not.toBeInTheDocument(); + }); + + it('hides system link when canRunMaintenance is false', async () => { + render(EntityNav, { ...fullPerms, canRunMaintenance: false }); + await expect.element(page.getByRole('link', { name: /system/i })).not.toBeInTheDocument(); + }); +}); + +describe('admin EntityNav — active state', () => { + it('marks users link as aria-current=page when on /admin/users', async () => { + render(EntityNav, fullPerms); + await expect + .element(page.getByRole('link', { name: /benutzer/i })) + .toHaveAttribute('aria-current', 'page'); + }); + + it('does not mark groups link as current when on /admin/users', async () => { + render(EntityNav, fullPerms); + await expect + .element(page.getByRole('link', { name: /gruppen/i })) + .not.toHaveAttribute('aria-current'); + }); +}); diff --git a/frontend/src/routes/admin/page.svelte.spec.ts b/frontend/src/routes/admin/page.svelte.spec.ts index fcbfd824..9072e164 100644 --- a/frontend/src/routes/admin/page.svelte.spec.ts +++ b/frontend/src/routes/admin/page.svelte.spec.ts @@ -1,83 +1,73 @@ +/** + * Tests for the admin root page — the mobile entity picker. + * On md+ viewports the page immediately redirects to /admin/users (tested + * in e2e). Here we verify the mobile-only list of entity links. + */ import { afterEach, describe, expect, it, vi } from 'vitest'; import { cleanup, render } from 'vitest-browser-svelte'; import { page } from 'vitest/browser'; import Page from './+page.svelte'; -vi.mock('$app/forms', () => ({ enhance: () => () => {} })); +vi.mock('$app/navigation', () => ({ goto: vi.fn() })); -const makeGroup = (overrides = {}) => ({ - id: 'g1', - name: 'Editoren', - permissions: ['WRITE_ALL'], - ...overrides -}); - -const makeUser = (overrides = {}) => ({ - id: 'u1', - username: 'max', - firstName: 'Max', - lastName: 'Mustermann', - email: 'max@example.com', - birthDate: undefined, - contact: undefined, - enabled: true, - groups: [makeGroup()], - createdAt: '2024-01-01T00:00:00Z', - ...overrides -}); - -const baseData = { - user: undefined, - canWrite: true, - canAnnotate: false, - users: [makeUser()], - groups: [makeGroup()], - tags: [] +const fullData = { + userCount: 4, + groupCount: 3, + tagCount: 7, + canManageUsers: true, + canManageTags: true, + canManageGroups: true, + canRunMaintenance: true }; afterEach(cleanup); -// ─── Users tab ──────────────────────────────────────────────────────────────── - -describe('Admin page – users tab', () => { - it('shows the username in the table', async () => { - render(Page, { data: baseData, form: null }); - await expect.element(page.getByRole('cell', { name: 'max', exact: true })).toBeInTheDocument(); +describe('Admin root page – entity picker', () => { + it('renders the admin heading', async () => { + render(Page, { data: fullData }); + await expect.element(page.getByRole('heading')).toBeInTheDocument(); }); - it('shows the full name in the table', async () => { - render(Page, { data: baseData, form: null }); - await expect.element(page.getByText(/Max Mustermann/)).toBeInTheDocument(); - }); - - it('shows a dash when user has no name set', async () => { - const data = { ...baseData, users: [makeUser({ firstName: undefined, lastName: undefined })] }; - render(Page, { data, form: null }); - await expect.element(page.getByText('–')).toBeInTheDocument(); - }); - - it('shows group badges for the user', async () => { - render(Page, { data: baseData, form: null }); - await expect.element(page.getByText('Editoren')).toBeInTheDocument(); - }); - - it('edit link points to /admin/users/[id]', async () => { - render(Page, { data: baseData, form: null }); + it('renders users link pointing to /admin/users', async () => { + render(Page, { data: fullData }); await expect - .element(page.getByRole('link', { name: /Bearbeiten/i })) - .toHaveAttribute('href', '/admin/users/u1'); + .element(page.getByRole('link', { name: /benutzer/i })) + .toHaveAttribute('href', '/admin/users'); }); - it('new user button links to /admin/users/new', async () => { - render(Page, { data: baseData, form: null }); + it('renders groups link pointing to /admin/groups', async () => { + render(Page, { data: fullData }); await expect - .element(page.getByRole('link', { name: /Neuer Benutzer/i })) - .toHaveAttribute('href', '/admin/users/new'); + .element(page.getByRole('link', { name: /gruppen/i })) + .toHaveAttribute('href', '/admin/groups'); }); - it('shows "no groups" label when user has no groups', async () => { - const data = { ...baseData, users: [makeUser({ groups: [] })] }; - render(Page, { data, form: null }); - await expect.element(page.getByText(/Keine Gruppen/i)).toBeInTheDocument(); + it('renders tags link pointing to /admin/tags', async () => { + render(Page, { data: fullData }); + await expect + .element(page.getByRole('link', { name: /schlagworte/i })) + .toHaveAttribute('href', '/admin/tags'); + }); + + it('renders system link pointing to /admin/system', async () => { + render(Page, { data: fullData }); + await expect + .element(page.getByRole('link', { name: /system/i })) + .toHaveAttribute('href', '/admin/system'); + }); + + it('hides users link when canManageUsers is false', async () => { + render(Page, { data: { ...fullData, canManageUsers: false } }); + await expect.element(page.getByRole('link', { name: /benutzer/i })).not.toBeInTheDocument(); + }); + + it('hides system link when canRunMaintenance is false', async () => { + render(Page, { data: { ...fullData, canRunMaintenance: false } }); + await expect.element(page.getByRole('link', { name: /system/i })).not.toBeInTheDocument(); + }); + + it('shows user count', async () => { + render(Page, { data: fullData }); + await expect.element(page.getByText('4')).toBeInTheDocument(); }); }); diff --git a/frontend/src/routes/admin/users/+layout.server.ts b/frontend/src/routes/admin/users/+layout.server.ts new file mode 100644 index 00000000..97be1fe5 --- /dev/null +++ b/frontend/src/routes/admin/users/+layout.server.ts @@ -0,0 +1,8 @@ +import { createApiClient } from '$lib/api.server'; +import type { LayoutServerLoad } from './$types'; + +export const load: LayoutServerLoad = async ({ fetch }) => { + const api = createApiClient(fetch); + const result = await api.GET('/api/users'); + return { users: result.data ?? [] }; +}; diff --git a/frontend/src/routes/admin/users/+layout.svelte b/frontend/src/routes/admin/users/+layout.svelte new file mode 100644 index 00000000..ade6a954 --- /dev/null +++ b/frontend/src/routes/admin/users/+layout.svelte @@ -0,0 +1,12 @@ + + + + + +
+ {@render children()} +
diff --git a/frontend/src/routes/admin/users/+page.svelte b/frontend/src/routes/admin/users/+page.svelte new file mode 100644 index 00000000..6759323e --- /dev/null +++ b/frontend/src/routes/admin/users/+page.svelte @@ -0,0 +1,7 @@ + + +
+

{m.admin_users_select_prompt()}

+
diff --git a/frontend/src/routes/admin/users/UsersListPanel.svelte b/frontend/src/routes/admin/users/UsersListPanel.svelte new file mode 100644 index 00000000..51758b2f --- /dev/null +++ b/frontend/src/routes/admin/users/UsersListPanel.svelte @@ -0,0 +1,105 @@ + + +
+ +
+ + {m.admin_users_list_title()} + + + + {m.admin_btn_new_user()} + +
+ + +
+ +
+ + +
+ {#if filtered.length === 0} +

+ {m.admin_users_empty()} +

+ {:else} + {#each filtered as user (user.id)} + {@const isActive = page.url.pathname.startsWith('/admin/users/' + user.id)} + {@const fullName = + [user.firstName, user.lastName].filter(Boolean).join(' ') || null} + +
{user.username}
+ {#if fullName} +
{fullName}
+ {/if} + {#if user.groups.length > 0} +
+ {#each user.groups as group (group.id)} + + {group.name} + + {/each} +
+ {/if} + + {/each} + {/if} +
+
diff --git a/frontend/src/routes/admin/users/[id]/+page.svelte b/frontend/src/routes/admin/users/[id]/+page.svelte index 2ebe7691..e2201990 100644 --- a/frontend/src/routes/admin/users/[id]/+page.svelte +++ b/frontend/src/routes/admin/users/[id]/+page.svelte @@ -10,85 +10,74 @@ let { data, form } = $props(); const selectedGroupIds = $derived(data.editUser.groups?.map((g: { id: string }) => g.id) ?? []); -
- - + +
+

+ {m.admin_user_edit_heading({ username: data.editUser.username })} +

+
+ + +
+ {#if form?.success} +
+ {m.admin_user_updated()} +
+ {/if} + {#if form?.error} +
+ {form.error} +
+ {/if} + +
+ +
+

+ {m.profile_section_personal()} +

+ +
+ + +
+

+ {m.admin_col_groups()} +

+ +
+ + +
+

+ {m.admin_label_new_password_optional()} +

+ +
+
+
+ + +
+ - - - {m.btn_back_to_overview()} - - -

- {m.admin_user_edit_heading({ username: data.editUser.username })} -

- - {#if form?.success} -
- {m.admin_user_updated()} -
- {/if} - {#if form?.error} -
- {form.error} -
- {/if} - -
- -
-

- {m.profile_section_personal()} -

- -
- - -
-

- {m.admin_col_groups()} -

- -
- - -
-

- {m.admin_label_new_password_optional()} -

- -
- - -
+ -
-
+ {m.btn_save()} + +
diff --git a/frontend/src/routes/admin/users/[id]/page.svelte.spec.ts b/frontend/src/routes/admin/users/[id]/page.svelte.spec.ts index acc3d6fd..43fca9b1 100644 --- a/frontend/src/routes/admin/users/[id]/page.svelte.spec.ts +++ b/frontend/src/routes/admin/users/[id]/page.svelte.spec.ts @@ -110,11 +110,11 @@ describe('Admin edit user page – rendering', () => { }); }); - it('cancel link points to /admin', async () => { + it('cancel link points to /admin/users', async () => { render(Page, { data: baseData, form: null }); await expect .element(page.getByRole('link', { name: /Abbrechen/i })) - .toHaveAttribute('href', '/admin'); + .toHaveAttribute('href', '/admin/users'); }); it('renders the save button', async () => { diff --git a/frontend/src/routes/admin/users/layout.server.spec.ts b/frontend/src/routes/admin/users/layout.server.spec.ts new file mode 100644 index 00000000..32433eb4 --- /dev/null +++ b/frontend/src/routes/admin/users/layout.server.spec.ts @@ -0,0 +1,41 @@ +import { describe, expect, it, vi, beforeEach } from 'vitest'; +import { load } from './+layout.server'; + +vi.mock('$lib/api.server', () => ({ createApiClient: vi.fn() })); + +import { createApiClient } from '$lib/api.server'; + +function mockApi(users: unknown[]) { + vi.mocked(createApiClient).mockReturnValue({ + GET: vi.fn().mockResolvedValueOnce({ response: { ok: true }, data: users }) + } as ReturnType); +} + +beforeEach(() => vi.clearAllMocks()); + +describe('admin/users layout load', () => { + it('returns the users list', async () => { + mockApi([ + { id: 'u1', username: 'alice' }, + { id: 'u2', username: 'bob' } + ]); + const result = await load({ fetch: vi.fn() as unknown as typeof fetch }); + expect(result.users).toHaveLength(2); + expect(result.users[0].username).toBe('alice'); + }); + + it('returns an empty array when the API returns nothing', async () => { + mockApi([]); + const result = await load({ fetch: vi.fn() as unknown as typeof fetch }); + expect(result.users).toEqual([]); + }); + + it('calls GET /api/users', async () => { + const mockGet = vi.fn().mockResolvedValue({ response: { ok: true }, data: [] }); + vi.mocked(createApiClient).mockReturnValue({ GET: mockGet } as ReturnType< + typeof createApiClient + >); + await load({ fetch: vi.fn() as unknown as typeof fetch }); + expect(mockGet).toHaveBeenCalledWith('/api/users'); + }); +}); diff --git a/frontend/src/routes/admin/users/layout.svelte.spec.ts b/frontend/src/routes/admin/users/layout.svelte.spec.ts new file mode 100644 index 00000000..4d736f2c --- /dev/null +++ b/frontend/src/routes/admin/users/layout.svelte.spec.ts @@ -0,0 +1,95 @@ +import { afterEach, describe, it, expect, vi } from 'vitest'; +import { cleanup, render } from 'vitest-browser-svelte'; +import { page } from 'vitest/browser'; +import UsersListPanel from './UsersListPanel.svelte'; + +vi.mock('$app/state', () => ({ + page: { url: { pathname: '/admin/users/u1' } } +})); + +afterEach(cleanup); + +const users = [ + { + id: 'u1', + username: 'reader', + firstName: 'Lea', + lastName: 'Leserin', + groups: [{ id: 'g1', name: 'Leser', permissions: ['READ_ALL'] }] + }, + { + id: 'u2', + username: 'admin', + firstName: null, + lastName: null, + groups: [{ id: 'g2', name: 'Admins', permissions: ['ADMIN'] }] + } +]; + +describe('UsersListPanel — header', () => { + it('renders the panel title', async () => { + render(UsersListPanel, { users }); + await expect.element(page.getByText(/Alle Benutzer/i)).toBeInTheDocument(); + }); + + it('renders a new-user link pointing to /admin/users/new', async () => { + render(UsersListPanel, { users }); + await expect + .element(page.getByRole('link', { name: /neuer benutzer/i })) + .toHaveAttribute('href', '/admin/users/new'); + }); + + it('renders a search input', async () => { + render(UsersListPanel, { users }); + await expect.element(page.getByRole('searchbox')).toBeInTheDocument(); + }); +}); + +describe('UsersListPanel — user items', () => { + it('renders each username', async () => { + render(UsersListPanel, { users }); + await expect.element(page.getByRole('link', { name: /reader/i })).toBeInTheDocument(); + await expect.element(page.getByRole('link', { name: /admin/i })).toBeInTheDocument(); + }); + + it('each user links to /admin/users/[id]', async () => { + const { container } = render(UsersListPanel, { users }); + const links = container.querySelectorAll('a[href^="/admin/users/u"]'); + expect(links.length).toBe(2); + expect(links[0].getAttribute('href')).toBe('/admin/users/u1'); + expect(links[1].getAttribute('href')).toBe('/admin/users/u2'); + }); + + it('shows full name as subtitle when available', async () => { + render(UsersListPanel, { users }); + await expect.element(page.getByText('Lea Leserin')).toBeInTheDocument(); + }); + + it('shows group name chip', async () => { + render(UsersListPanel, { users }); + await expect.element(page.getByText('Leser', { exact: true })).toBeInTheDocument(); + }); +}); + +describe('UsersListPanel — active state', () => { + it('marks the active user link with aria-current=page', async () => { + render(UsersListPanel, { users }); + await expect + .element(page.getByRole('link', { name: /reader/i })) + .toHaveAttribute('aria-current', 'page'); + }); + + it('does not mark the inactive user link with aria-current', async () => { + render(UsersListPanel, { users }); + await expect + .element(page.getByRole('link', { name: /admin/i })) + .not.toHaveAttribute('aria-current'); + }); +}); + +describe('UsersListPanel — empty state', () => { + it('shows empty state message when users array is empty', async () => { + render(UsersListPanel, { users: [] }); + await expect.element(page.getByText(/keine benutzer/i)).toBeInTheDocument(); + }); +}); diff --git a/frontend/src/routes/admin/users/new/+page.server.ts b/frontend/src/routes/admin/users/new/+page.server.ts index 256e4f89..17af6aee 100644 --- a/frontend/src/routes/admin/users/new/+page.server.ts +++ b/frontend/src/routes/admin/users/new/+page.server.ts @@ -40,6 +40,6 @@ export const actions: Actions = { return fail(result.response.status, { error: getErrorMessage(code) }); } - throw redirect(303, '/admin'); + throw redirect(303, '/admin/users'); } }; diff --git a/frontend/src/routes/admin/users/new/+page.svelte b/frontend/src/routes/admin/users/new/+page.svelte index 4af6d8ba..cfb63278 100644 --- a/frontend/src/routes/admin/users/new/+page.svelte +++ b/frontend/src/routes/admin/users/new/+page.svelte @@ -8,64 +8,57 @@ import AccountSection from './AccountSection.svelte'; let { data, form } = $props(); -
- - - - - {m.btn_back_to_overview()} - +
+ +
+

{m.admin_user_new_heading()}

+
-

{m.admin_user_new_heading()}

+ +
+ {#if form?.error} +
+ {form.error} +
+ {/if} - {#if form?.error} -
- {form.error} -
- {/if} - -
-
- + +
+ +
-

- {m.profile_section_personal()} -

- +
+

+ {m.profile_section_personal()} +

+ +
-

- {m.admin_col_groups()} -

- - - -
- - {m.btn_cancel()} - - +
+

+ {m.admin_col_groups()} +

+
+ + +
+ + {m.btn_cancel()} + + +
diff --git a/frontend/src/routes/admin/users/new/page.svelte.spec.ts b/frontend/src/routes/admin/users/new/page.svelte.spec.ts index d80f5c6f..6ac42717 100644 --- a/frontend/src/routes/admin/users/new/page.svelte.spec.ts +++ b/frontend/src/routes/admin/users/new/page.svelte.spec.ts @@ -33,18 +33,11 @@ describe('Admin new user page – rendering', () => { await expect.element(page.getByText('Admins')).toBeInTheDocument(); }); - it('cancel link points to /admin', async () => { + it('cancel link points to /admin/users', async () => { render(Page, { data: baseData, form: null }); await expect .element(page.getByRole('link', { name: /Abbrechen/i })) - .toHaveAttribute('href', '/admin'); - }); - - it('back link points to /admin', async () => { - render(Page, { data: baseData, form: null }); - await expect - .element(page.getByRole('link', { name: /Zurück/i })) - .toHaveAttribute('href', '/admin'); + .toHaveAttribute('href', '/admin/users'); }); it('renders the create button', async () => {