diff --git a/gerbil-manager-web/e2e/tiere.spec.ts b/gerbil-manager-web/e2e/tiere.spec.ts index 1ede14f..f76002a 100644 --- a/gerbil-manager-web/e2e/tiere.spec.ts +++ b/gerbil-manager-web/e2e/tiere.spec.ts @@ -203,6 +203,24 @@ test('Tier bearbeiten — isDeaf Tristate round-trip (FORM-FIELDS-1)', async ({ await expect(page.getByLabel(t.fields.isDeaf)).toHaveValue('true') }) +test('Detailseite: Zuchtpartner-Liste trennt mit Komma HINTEN am Namen (KV-COMMA)', async ({ + page, +}) => { + skipUnlessMock() + // Anton ist Vater von Wurf B (Mutter Greta) und Wurf C (Mutter Frieda) → 2 Zuchtpartner. + // .ak-kv-value ist ein Flex-Container mit wrap: ein vorangestelltes „, " landete beim + // Umbruch am Zeilenanfang („, Frieda"). Das Komma muss am vorherigen Namen kleben. + await page.goto('/rennmaeuse/anton') + const row = page.locator('.ak-kv', { + has: page.locator('.ak-kv-label', { hasText: de.pages.gerbils.detail.zuchtpartner }), + }) + await expect(row).toBeVisible() + const value = row.locator('.ak-kv-value') + const text = (await value.innerText()).replace(/\s+/g, ' ').trim() + expect(text).not.toMatch(/^,/) + expect(text).toBe('Greta, Frieda') +}) + /** QOL-ELTERN: Vater/Mutter im Abstammungs-Block des Tier-Formulars setzen. */ async function pickParent(page: Page, legend: string, name: string) { const group = page.getByRole('group', { name: legend }) diff --git a/gerbil-manager-web/src/pages/GerbilDetailPage.tsx b/gerbil-manager-web/src/pages/GerbilDetailPage.tsx index cc0e4e0..d00fa7a 100644 --- a/gerbil-manager-web/src/pages/GerbilDetailPage.tsx +++ b/gerbil-manager-web/src/pages/GerbilDetailPage.tsx @@ -554,10 +554,13 @@ export default function GerbilDetailPage() { )} {g.isResident !== false && (partners.data?.items.length ?? 0) > 0 && ( - {(partners.data?.items ?? []).map((p, i) => ( + {/* Trennkomma HINTEN an den Namen, nicht vorne an den nächsten: .ak-kv-value + ist ein Flex-Container mit wrap, jeder Eintrag also ein eigenes Flex-Item. + Vorangestellt landete das Komma beim Umbruch am ZEILENANFANG („, Zora"). */} + {(partners.data?.items ?? []).map((p, i, all) => ( - {i > 0 && ', '} {p.name || de.pages.gerbils.nameless} + {i < all.length - 1 && ','} ))} @@ -612,12 +615,12 @@ export default function GerbilDetailPage() { {(offspring.data?.items.length ?? 0) > 0 && (

{t.detail.nonResidentOffspringLabel}{' '} - {(offspring.data?.items ?? []).map((child, i) => ( + {(offspring.data?.items ?? []).map((child, i, all) => ( - {i > 0 && ', '} {child.name || de.pages.gerbils.nameless} + {i < all.length - 1 && ','} ))}

diff --git a/gerbil-manager-web/src/pages/WuerfeListPage.tsx b/gerbil-manager-web/src/pages/WuerfeListPage.tsx index d9ee34c..f67b175 100644 --- a/gerbil-manager-web/src/pages/WuerfeListPage.tsx +++ b/gerbil-manager-web/src/pages/WuerfeListPage.tsx @@ -61,7 +61,10 @@ export default function WuerfeListPage() { // Parent names (shared by both tabs) — keep the full gerbil so the Zucht suffix applies. const gerbilName = useGerbilName() - const gerbils = useApi(() => listGerbils({ page: 1, pageSize: 1000, orderBy: 'name' }), []) + // Alle Tiere laden (nicht nur die ersten 1000): sonst finden Würfe, deren Eltern + // alphabetisch hinter dem Fenster liegen, ihren Namen nicht und die Karte zeigt + // fälschlich „Unbekannt" (Prod hat >2400 Tiere). + const gerbils = useApi(() => listGerbils({ page: 1, pageSize: 10000, orderBy: 'name' }), []) const gerbilById = useMemo(() => { const map = new Map() for (const g of gerbils.data?.items ?? []) map.set(g.id, g)