99 lines
3.2 KiB
TypeScript
99 lines
3.2 KiB
TypeScript
import { describe, it, expect, vi, afterEach } from 'vitest';
|
|
import { cleanup, render } from 'vitest-browser-svelte';
|
|
import { page } from 'vitest/browser';
|
|
|
|
vi.mock('$app/navigation', () => ({
|
|
beforeNavigate: () => {},
|
|
afterNavigate: () => {},
|
|
goto: vi.fn(),
|
|
invalidate: vi.fn(),
|
|
invalidateAll: vi.fn(),
|
|
preloadCode: vi.fn(),
|
|
preloadData: vi.fn(),
|
|
pushState: vi.fn(),
|
|
replaceState: vi.fn(),
|
|
disableScrollHandling: vi.fn(),
|
|
onNavigate: () => () => {}
|
|
}));
|
|
|
|
const { default: AdminUserNewPage } = await import('./+page.svelte');
|
|
|
|
afterEach(cleanup);
|
|
|
|
const baseData = (overrides: Record<string, unknown> = {}) => ({
|
|
groups: [
|
|
{ id: 'g1', name: 'Familie' },
|
|
{ id: 'g2', name: 'Admins' }
|
|
],
|
|
...overrides
|
|
});
|
|
|
|
describe('admin/users/new page', () => {
|
|
it('renders the new-user heading', async () => {
|
|
render(AdminUserNewPage, { props: { data: baseData(), form: undefined } });
|
|
|
|
await expect
|
|
.element(page.getByRole('heading', { name: /neuen benutzer anlegen/i }))
|
|
.toBeVisible();
|
|
});
|
|
|
|
it('renders the three card sections', async () => {
|
|
render(AdminUserNewPage, { props: { data: baseData(), form: undefined } });
|
|
|
|
await expect.element(page.getByRole('heading', { name: /persönliche daten/i })).toBeVisible();
|
|
await expect.element(page.getByRole('heading', { name: /^gruppen$/i })).toBeVisible();
|
|
});
|
|
|
|
it('renders all available groups in the picker', async () => {
|
|
render(AdminUserNewPage, { props: { data: baseData(), form: undefined } });
|
|
|
|
const checkboxes = document.querySelectorAll('input[name="groupIds"]');
|
|
expect(checkboxes.length).toBe(2);
|
|
});
|
|
|
|
it('shows the form-error banner when form.error is set', async () => {
|
|
render(AdminUserNewPage, {
|
|
props: { data: baseData(), form: { error: 'E-Mail bereits vergeben' } }
|
|
});
|
|
|
|
await expect.element(page.getByText('E-Mail bereits vergeben')).toBeVisible();
|
|
});
|
|
|
|
it('renders cancel link to /admin/users', async () => {
|
|
render(AdminUserNewPage, { props: { data: baseData(), form: undefined } });
|
|
|
|
const cancel = document.querySelectorAll('a[href="/admin/users"]');
|
|
expect(cancel.length).toBeGreaterThan(0);
|
|
});
|
|
|
|
it('renders the create submit button', async () => {
|
|
render(AdminUserNewPage, { props: { data: baseData(), form: undefined } });
|
|
|
|
await expect.element(page.getByRole('button', { name: /erstellen/i })).toBeVisible();
|
|
});
|
|
|
|
it('does not show the unsaved-warning banner before any input', async () => {
|
|
render(AdminUserNewPage, { props: { data: baseData(), form: undefined } });
|
|
|
|
const banner = document.querySelector('.bg-amber-50');
|
|
expect(banner).toBeNull();
|
|
});
|
|
|
|
it('keeps the form mounted after an input event (oninput handler does not unmount)', async () => {
|
|
render(AdminUserNewPage, { props: { data: baseData(), form: undefined } });
|
|
|
|
const form = document.querySelector('form#new-user-form') as HTMLFormElement;
|
|
expect(form).not.toBeNull();
|
|
form.dispatchEvent(new Event('input', { bubbles: true }));
|
|
|
|
expect(document.querySelector('form#new-user-form')).not.toBeNull();
|
|
});
|
|
|
|
it('hides the form-error banner when form.error is undefined', async () => {
|
|
render(AdminUserNewPage, { props: { data: baseData(), form: undefined } });
|
|
|
|
const banner = document.querySelector('.bg-red-50');
|
|
expect(banner).toBeNull();
|
|
});
|
|
});
|