marcel/familienarchiv
1
0
Fork 0
Code Issues 105 Pull Requests Actions Packages Projects Releases Wiki Activity

feat(person): render precise life dates on cards, hover card, and mention dropdown

Browse Source 
Cards compose aria-hidden * / † glyphs in markup so screen readers only
announce the dates; PersonSummaryDTO list card stays year-shaped by
design (ADR-039). MentionDropdown subtitle wraps instead of truncating
so DAY-precision ranges fit at 320px.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-06-12 18:14:20 +02:00
parent c41c69d0d1
commit 4dcf8e2242
10 changed files with 254 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

75
frontend/src/routes/persons/[id]/PersonCard.svelte.test.ts
View File

@@ -82,15 +82,84 @@ describe('PersonCard', () => {
await expect.element(page.getByText(/Annerl/)).toBeVisible();
});
it('renders the life-date range when birthYear or deathYear are present', async () => {
it('renders DAY-precision life dates as full localized dates', async () => {
render(PersonCard, {
props: {
person: { ...basePerson, birthYear: 1899, deathYear: 1972 },
person: {
...basePerson,
birthDate: '1901-03-14',
birthDatePrecision: 'DAY' as const,
deathDate: '1944-11-02',
deathDatePrecision: 'DAY' as const
},
canWrite: false
}
});
await expect.element(page.getByText(/1899/)).toBeVisible();
await expect.element(page.getByText(/14\. März 1901/)).toBeVisible();
await expect.element(page.getByText(/2\. November 1944/)).toBeVisible();
});
it('wraps the * and † glyphs in aria-hidden spans', async () => {
const { container } = render(PersonCard, {
props: {
person: {
...basePerson,
birthDate: '1901-03-14',
birthDatePrecision: 'DAY' as const,
deathDate: '1944-11-02',
deathDatePrecision: 'DAY' as const
},
canWrite: false
}
});
const hidden = [...container.querySelectorAll('span[aria-hidden="true"]')].map((el) =>
el.textContent?.trim()
);
expect(hidden).toContain('*');
expect(hidden).toContain('†');
});
it('renders birth-only without dash or dagger', async () => {
const { container } = render(PersonCard, {
props: {
person: {
...basePerson,
birthDate: '1901-03-14',
birthDatePrecision: 'DAY' as const
},
canWrite: false
}
});
await expect.element(page.getByText(/14\. März 1901/)).toBeVisible();
expect(container.textContent).not.toContain('–');
expect(container.textContent).not.toContain('†');
});
it('renders APPROX-precision legacy dates with the ca. prefix', async () => {
render(PersonCard, {
props: {
person: {
...basePerson,
birthDate: '1882-01-01',
birthDatePrecision: 'APPROX' as const
},
canWrite: false
}
});
await expect.element(page.getByText(/ca\. 1882/)).toBeVisible();
});
it('renders no life-date line when both dates are missing', async () => {
const { container } = render(PersonCard, {
props: { person: basePerson, canWrite: false }
});
expect(container.textContent).not.toContain('*');
expect(container.textContent).not.toContain('†');
});
it('renders the notes section when notes are provided', async () => {