test(geschichte): cover GeschichtenCard branches

Empty list early return, populated section, write-action link gated on
canWrite, visible-cap of 3, footer show-all link visibility based on
overflow, author name vs email fallback.

9 tests covering ~25 of GeschichtenCard's branches.

Refs #496.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-05-10 02:02:18 +02:00
parent 531d7fb1b9
commit 7d70add709

View File

@@ -0,0 +1,109 @@
import { describe, it, expect, afterEach } from 'vitest';
import { cleanup, render } from 'vitest-browser-svelte';
import { page } from 'vitest/browser';
import GeschichtenCard from './GeschichtenCard.svelte';
afterEach(cleanup);
const makeGeschichte = (overrides: Record<string, unknown> = {}) => ({
id: 'g1',
title: 'Reise nach Berlin',
body: '<p>Brief text</p>',
publishedAt: '2026-04-15T10:00:00Z',
author: { firstName: 'Anna', lastName: 'Schmidt', email: 'a@b' } as unknown,
...overrides
});
const baseProps = (overrides: Record<string, unknown> = {}) => ({
geschichten: [] as ReturnType<typeof makeGeschichte>[],
personId: 'p-1',
personName: 'Anna Schmidt',
canWrite: false,
...overrides
});
describe('GeschichtenCard', () => {
it('renders nothing when geschichten is empty', async () => {
render(GeschichtenCard, { props: baseProps() });
expect(document.querySelector('section')).toBeNull();
});
it('renders the section when at least one geschichte is present', async () => {
render(GeschichtenCard, { props: baseProps({ geschichten: [makeGeschichte()] }) });
await expect.element(page.getByRole('heading', { name: /geschichten/i })).toBeVisible();
});
it('shows the write-action link when canWrite is true', async () => {
render(GeschichtenCard, {
props: baseProps({ geschichten: [makeGeschichte()], canWrite: true })
});
await expect
.element(page.getByRole('link', { name: /geschichte schreiben/i }))
.toHaveAttribute('href', '/geschichten/new?personId=p-1');
});
it('hides the write-action link when canWrite is false', async () => {
render(GeschichtenCard, { props: baseProps({ geschichten: [makeGeschichte()] }) });
await expect
.element(page.getByRole('link', { name: /geschichte schreiben/i }))
.not.toBeInTheDocument();
});
it('limits visible geschichten to 3', async () => {
const geschichten = Array.from({ length: 5 }, (_, i) =>
makeGeschichte({ id: `g${i}`, title: `Geschichte ${i + 1}` })
);
render(GeschichtenCard, { props: baseProps({ geschichten }) });
await expect.element(page.getByText('Geschichte 1')).toBeVisible();
await expect.element(page.getByText('Geschichte 3')).toBeVisible();
await expect.element(page.getByText('Geschichte 4')).not.toBeInTheDocument();
});
it('renders the show-all link in the footer when there are 3 or more', async () => {
const geschichten = Array.from({ length: 3 }, (_, i) =>
makeGeschichte({ id: `g${i}`, title: `g${i}` })
);
render(GeschichtenCard, { props: baseProps({ geschichten }) });
await expect
.element(page.getByRole('link', { name: /alle geschichten zu anna schmidt/i }))
.toHaveAttribute('href', '/geschichten?personId=p-1');
});
it('hides the show-all footer when fewer than 3 geschichten', async () => {
render(GeschichtenCard, {
props: baseProps({
geschichten: [makeGeschichte({ id: 'g1' }), makeGeschichte({ id: 'g2', title: 'Two' })]
})
});
await expect
.element(page.getByRole('link', { name: /alle geschichten zu/i }))
.not.toBeInTheDocument();
});
it('renders the author full name when both first and last names are set', async () => {
render(GeschichtenCard, { props: baseProps({ geschichten: [makeGeschichte()] }) });
await expect.element(page.getByText(/Anna Schmidt/)).toBeVisible();
});
it('falls back to author email when no name', async () => {
render(GeschichtenCard, {
props: baseProps({
geschichten: [
makeGeschichte({
author: { firstName: undefined, lastName: undefined, email: 'fallback@x' }
})
]
})
});
await expect.element(page.getByText(/fallback@x/)).toBeVisible();
});
});