303 lines
15 KiB
TypeScript
303 lines
15 KiB
TypeScript
/**
|
|
* QA-LIVE-DATA: Tiefe Begehung mit echten Import-Daten (325 Tiere, 865 Würfe, 138 Fotos).
|
|
* Läuft ausschließlich im LIVE-Modus (E2E_BASE_URL gesetzt).
|
|
*
|
|
* Bekannte Datengrundlage (Stand Re-Import #2.5):
|
|
* - Vance von den Kleinen Chaoten id=afdaff89-0274-4778-8f2f-3957a81bf58e (Resident, Stammbaum)
|
|
* - Girasol of Topolino id=bf20f105-2ea9-475f-89b7-d50e59fb7d3b (9 Fotos)
|
|
* - Litter 2026-02-10 id=a1db02cf-48ff-4f3a-8eab-33f2360c27f0 (beide Eltern gesetzt)
|
|
* - 204 Residents, 121 Externe, 15 namenlose Einträge
|
|
*/
|
|
import { de, expect, gotoSection, openFilterPanel, skipUnlessLive, test } from './fixtures'
|
|
|
|
const t = de.pages.gerbils
|
|
const tl = de.pages.litters
|
|
const td = t.detail
|
|
|
|
// ── 1. RENNMÄUSE-LISTE ───────────────────────────────────────────────────────
|
|
|
|
test('Live-Data: Tiere-Liste lädt 325 Einträge (Bestand-Default-Filter inklusive externe)', async ({
|
|
page,
|
|
}) => {
|
|
skipUnlessLive()
|
|
await gotoSection(page, de.nav.gerbils)
|
|
await expect(page.getByRole('heading', { name: t.title, exact: true })).toBeVisible()
|
|
const rows = page.locator('.gerbil-row')
|
|
await expect(rows.first()).toBeVisible()
|
|
const count = await rows.count()
|
|
// Alle 325 oder zumindest Paginierung der ersten Seite (>=20)
|
|
expect(count).toBeGreaterThanOrEqual(20)
|
|
// Count-Label sichtbar ("204 Tiere" für Bestand-Default-Filter oder "325 Tiere")
|
|
await expect(page.locator('p.muted').filter({ hasText: t.countLabel })).toBeVisible()
|
|
})
|
|
|
|
test('Live-Data: Bestand-Filter sichtbar + umschaltbar (Resident vs. Alle)', async ({ page }) => {
|
|
skipUnlessLive()
|
|
await gotoSection(page, de.nav.gerbils)
|
|
await expect(page.getByRole('heading', { name: t.title, exact: true })).toBeVisible()
|
|
await openFilterPanel(page)
|
|
// Filter-Panel oder mindestens der "Nur Bestand"-Toggle ist sichtbar
|
|
const filterSection = page.locator('.filter-panel, [aria-label*="Filter"], .filter-panel__content')
|
|
await expect(filterSection.first()).toBeVisible({ timeout: 5_000 })
|
|
})
|
|
|
|
test('Live-Data: Suche nach "Vance" findet mindestens einen Treffer', async ({ page }) => {
|
|
skipUnlessLive()
|
|
await gotoSection(page, de.nav.gerbils)
|
|
await expect(page.getByRole('heading', { name: t.title, exact: true })).toBeVisible()
|
|
await page.getByPlaceholder(t.searchPlaceholder).first().fill('Vance')
|
|
const rows = page.locator('.gerbil-row')
|
|
await expect(rows.first()).toBeVisible({ timeout: 10_000 })
|
|
expect(await rows.count()).toBeGreaterThanOrEqual(1)
|
|
// Name "Vance" soll in einem Ergebnis auftauchen
|
|
await expect(page.locator('.gerbil-row').filter({ hasText: 'Vance' }).first()).toBeVisible()
|
|
})
|
|
|
|
test('Live-Data: Suche nach "von den" (Namensmuster) liefert Treffer', async ({ page }) => {
|
|
skipUnlessLive()
|
|
await gotoSection(page, de.nav.gerbils)
|
|
await expect(page.getByRole('heading', { name: t.title, exact: true })).toBeVisible()
|
|
await page.getByPlaceholder(t.searchPlaceholder).first().fill('von den')
|
|
const rows = page.locator('.gerbil-row')
|
|
await expect(rows.first()).toBeVisible({ timeout: 10_000 })
|
|
expect(await rows.count()).toBeGreaterThanOrEqual(5)
|
|
})
|
|
|
|
test('Live-Data: Genotyp-Tabelle scrollt horizontal (kein Page-Overflow bei 390px)', async ({
|
|
page,
|
|
}) => {
|
|
skipUnlessLive()
|
|
await gotoSection(page, de.nav.gerbils)
|
|
await expect(page.locator('.gerbil-row').first()).toBeVisible()
|
|
// Kein horizontaler Scroll auf body/html
|
|
const bodyOverflow = await page.evaluate(() => {
|
|
const body = document.body
|
|
const html = document.documentElement
|
|
return {
|
|
bodyScrollWidth: body.scrollWidth,
|
|
htmlScrollWidth: html.scrollWidth,
|
|
viewportWidth: window.innerWidth,
|
|
}
|
|
})
|
|
expect(bodyOverflow.bodyScrollWidth).toBeLessThanOrEqual(bodyOverflow.viewportWidth + 2)
|
|
expect(bodyOverflow.htmlScrollWidth).toBeLessThanOrEqual(bodyOverflow.viewportWidth + 2)
|
|
})
|
|
|
|
// ── 2. TIER-DETAIL ────────────────────────────────────────────────────────────
|
|
|
|
test('Live-Data: Girasol of Topolino Detail zeigt Fotos-Tab mit mindestens 9 Fotos', async ({
|
|
page,
|
|
}) => {
|
|
skipUnlessLive()
|
|
await page.goto('/rennmaeuse/bf20f105-2ea9-475f-89b7-d50e59fb7d3b')
|
|
await expect(page.getByRole('heading', { name: 'Girasol of Topolino' })).toBeVisible()
|
|
// Fotos-Tab anklicken
|
|
await page.getByRole('tab', { name: td.tabs.photos }).click()
|
|
// Mindestens ein Foto-Img sichtbar (9 Fotos importiert)
|
|
const photos = page.locator('img.photo-thumb, img[src*="/photos/files/"], .photo-item img, .photo-list img')
|
|
await expect(photos.first()).toBeVisible({ timeout: 8_000 })
|
|
expect(await photos.count()).toBeGreaterThanOrEqual(1)
|
|
})
|
|
|
|
test('Live-Data: Vance von den Kleinen Chaoten Detail rendert korrekt', async ({ page }) => {
|
|
skipUnlessLive()
|
|
await page.goto('/rennmaeuse/afdaff89-0274-4778-8f2f-3957a81bf58e')
|
|
await expect(page.getByRole('heading', { name: 'Vance von den Kleinen Chaoten' })).toBeVisible()
|
|
// Gesundheits-Tab (leer OK, soll aber nicht crashen)
|
|
await page.getByRole('tab', { name: td.tabs.health }).click()
|
|
await expect(page).not.toHaveURL('/error')
|
|
// Gewicht-Tab
|
|
await page.getByRole('tab', { name: td.tabs.weight }).click()
|
|
await expect(page).not.toHaveURL('/error')
|
|
})
|
|
|
|
test('Live-Data: Stammbaum-Link von Tier-Detail navigiert zu StammbaumPage', async ({ page }) => {
|
|
skipUnlessLive()
|
|
await page.goto('/rennmaeuse/afdaff89-0274-4778-8f2f-3957a81bf58e')
|
|
await expect(page.getByRole('heading', { name: 'Vance von den Kleinen Chaoten' })).toBeVisible()
|
|
// Stammbaum-Link suchen
|
|
const stammbaumLink = page.getByRole('link', { name: /Stammbaum/i }).first()
|
|
if (await stammbaumLink.isVisible()) {
|
|
await stammbaumLink.click()
|
|
await expect(page).toHaveURL(/stammbaum/)
|
|
} else {
|
|
// Direkt navigieren
|
|
await page.goto('/rennmaeuse/afdaff89-0274-4778-8f2f-3957a81bf58e/stammbaum')
|
|
}
|
|
// Stammbaum-SVG oder rd3t-Knoten sichtbar
|
|
await expect(page.locator('[data-testid="rd3t-svg"], svg.rd3t-svg, .stammbaum-page, svg').first()).toBeVisible({ timeout: 10_000 })
|
|
})
|
|
|
|
// ── 3. STAMMBAUM-SEITE ───────────────────────────────────────────────────────
|
|
|
|
test('Live-Data: Stammbaum rendert ohne Page-Overflow (390px)', async ({ page }) => {
|
|
skipUnlessLive()
|
|
await page.goto('/rennmaeuse/afdaff89-0274-4778-8f2f-3957a81bf58e/stammbaum')
|
|
// Irgendein SVG-Element muss sichtbar sein
|
|
await expect(page.locator('svg').first()).toBeVisible({ timeout: 12_000 })
|
|
const overflow = await page.evaluate(() => ({
|
|
bodyScrollWidth: document.body.scrollWidth,
|
|
viewportWidth: window.innerWidth,
|
|
}))
|
|
expect(overflow.bodyScrollWidth).toBeLessThanOrEqual(overflow.viewportWidth + 2)
|
|
})
|
|
|
|
test('Live-Data: Stammbaum hat Druck-Button', async ({ page }) => {
|
|
skipUnlessLive()
|
|
await page.goto('/rennmaeuse/afdaff89-0274-4778-8f2f-3957a81bf58e/stammbaum')
|
|
await expect(page.locator('svg').first()).toBeVisible({ timeout: 12_000 })
|
|
const printBtn = page.locator('button, a').filter({ hasText: /Drucken|Print|Ahnentafel/i })
|
|
await expect(printBtn.first()).toBeVisible()
|
|
})
|
|
|
|
// ── 4. WÜRFE-LISTE ───────────────────────────────────────────────────────────
|
|
|
|
test('Live-Data: Würfe-Liste zeigt mindestens 20 Einträge (865 Würfe importiert)', async ({
|
|
page,
|
|
}) => {
|
|
skipUnlessLive()
|
|
await gotoSection(page, de.nav.litters)
|
|
await expect(page.getByRole('heading', { name: tl.title, exact: true })).toBeVisible()
|
|
const rows = page.locator('.litter-row, .gerbil-card, li a').filter({ hasText: /Wurf/i })
|
|
await expect(rows.first()).toBeVisible()
|
|
expect(await rows.count()).toBeGreaterThanOrEqual(20)
|
|
})
|
|
|
|
test('Live-Data: Wurf-Detail mit beiden Eltern rendert "Elterntiere"', async ({ page }) => {
|
|
skipUnlessLive()
|
|
// Direkt zu einem Wurf mit beiden Eltern navigieren (2026-02-10)
|
|
await page.goto('/wuerfe/a1db02cf-48ff-4f3a-8eab-33f2360c27f0')
|
|
// Elterntiere-Section immer sichtbar
|
|
await expect(page.getByText(tl.detail.parents, { exact: true })).toBeVisible({ timeout: 8_000 })
|
|
// Vater-Link zu einem Tier
|
|
await expect(page.locator('a[href*="/rennmaeuse/"]').first()).toBeVisible({ timeout: 5_000 })
|
|
})
|
|
|
|
test('Live-Data: Wurf-Detail ohne Eltern rendert "Elterntiere" als "unbekannt"', async ({
|
|
page,
|
|
}) => {
|
|
skipUnlessLive()
|
|
// Wurf A (2010-02-18) hat weder Vater noch Mutter
|
|
await page.goto('/wuerfe/34852596-2bd7-48ad-9175-4223d3d99229')
|
|
await expect(page.getByText(tl.detail.parents, { exact: true })).toBeVisible({ timeout: 8_000 })
|
|
// "unbekannt" Platzhalter soll sichtbar sein (kein Link)
|
|
await expect(page.getByText(tl.detail.unknownParent ?? 'unbekannt')).toBeVisible()
|
|
})
|
|
|
|
// ── 5. BECKEN / KONTAKTE (leere Zustände) ────────────────────────────────────
|
|
|
|
test('Live-Data: Becken-Seite zeigt Leer-Zustand (keine Becken importiert)', async ({ page }) => {
|
|
skipUnlessLive()
|
|
await gotoSection(page, de.nav.enclosures)
|
|
await expect(page.getByRole('heading', { name: de.pages.becken.title, exact: true })).toBeVisible({ timeout: 8_000 })
|
|
// Leer-Meldung oder "Neues Becken"-Button
|
|
const emptyOrNew = page.locator('*').filter({ hasText: de.pages.becken.empty }).or(
|
|
page.getByRole('link', { name: de.pages.becken.newButton })
|
|
)
|
|
await expect(emptyOrNew.first()).toBeVisible()
|
|
})
|
|
|
|
test('Live-Data: Kontakte-Seite zeigt Leer-Zustand (keine Kontakte importiert)', async ({
|
|
page,
|
|
}) => {
|
|
skipUnlessLive()
|
|
await gotoSection(page, de.nav.contacts)
|
|
await expect(page.getByRole('heading', { name: de.pages.kontakte.title, exact: true })).toBeVisible({ timeout: 8_000 })
|
|
await expect(page.getByText(de.pages.kontakte.empty)).toBeVisible()
|
|
})
|
|
|
|
// ── 6. GENETIK / PROBEVERPAARUNG ─────────────────────────────────────────────
|
|
|
|
test('Live-Data: Genetik-Seite lädt mit echten Genotypen', async ({ page }) => {
|
|
skipUnlessLive()
|
|
await gotoSection(page, de.nav.genetics)
|
|
await expect(page.getByRole('heading', { name: de.pages.genetik.title, exact: true })).toBeVisible({ timeout: 8_000 })
|
|
// Probeverpaarung-UI sichtbar
|
|
await expect(page.getByText(de.pages.genetik.subtitle)).toBeVisible()
|
|
// Tier-Auswahl Vater/Mutter sichtbar
|
|
await expect(page.locator('select, input[type="search"], [placeholder]').first()).toBeVisible()
|
|
})
|
|
|
|
// ── 7. STATISTIK ─────────────────────────────────────────────────────────────
|
|
|
|
test('Live-Data: Statistik-Seite rendert Charts ohne Crash', async ({ page }) => {
|
|
skipUnlessLive()
|
|
await gotoSection(page, de.nav.statistics)
|
|
await expect(page.getByRole('heading', { name: de.pages.statistik.title, exact: true })).toBeVisible({ timeout: 8_000 })
|
|
// Mindestens ein Chart-Canvas oder SVG (865 Würfe = Charts vorhanden)
|
|
const chart = page.locator('canvas, svg.bar-chart, svg.line-chart, .chart-wrapper, .bar-chart, .line-chart')
|
|
await expect(chart.first()).toBeVisible({ timeout: 12_000 })
|
|
})
|
|
|
|
// ── 8. EINSTELLUNGEN ─────────────────────────────────────────────────────────
|
|
|
|
test('Live-Data: Einstellungen-Seite lädt Züchterprofil', async ({ page }) => {
|
|
skipUnlessLive()
|
|
await gotoSection(page, de.nav.settings)
|
|
await expect(page.getByRole('heading', { name: de.pages.einstellungen.title, exact: true })).toBeVisible({ timeout: 8_000 })
|
|
await expect(page.getByText(de.pages.einstellungen.zuchtprofil.title)).toBeVisible()
|
|
})
|
|
|
|
// ── 9. WEBSEITE (CMS) ────────────────────────────────────────────────────────
|
|
|
|
test('Live-Data: Webseite-Seite lädt ohne Crash', async ({ page }) => {
|
|
skipUnlessLive()
|
|
await gotoSection(page, de.nav.website)
|
|
await expect(page.getByRole('heading', { name: de.pages.webseite.title, exact: true })).toBeVisible({ timeout: 8_000 })
|
|
// Seitenliste mit Seeds vorhanden (8 Seiten aus dem Seed)
|
|
await expect(page.locator('.gerbil-card, li').first()).toBeVisible({ timeout: 5_000 })
|
|
})
|
|
|
|
// ── 10. ANFRAGEN ─────────────────────────────────────────────────────────────
|
|
|
|
test('Live-Data: Anfragen-Seite zeigt Leer-Zustand (0 Anfragen)', async ({ page }) => {
|
|
skipUnlessLive()
|
|
await gotoSection(page, de.nav.requests)
|
|
await expect(page.getByRole('heading', { name: de.pages.anfragen.title, exact: true })).toBeVisible({ timeout: 8_000 })
|
|
// Leer-Text soll sichtbar sein (keine Anfragen live)
|
|
await expect(page.getByText(de.pages.anfragen.empty)).toBeVisible()
|
|
})
|
|
|
|
// ── 11. KONSOLEN-FEHLER-MONITOR ───────────────────────────────────────────────
|
|
|
|
test('Live-Data: Keine unhandled-rejection-Fehler beim Durchlauf aller Hauptseiten', async ({
|
|
page,
|
|
}) => {
|
|
skipUnlessLive()
|
|
const errors: string[] = []
|
|
page.on('pageerror', (err) => errors.push(err.message))
|
|
page.on('console', (msg) => {
|
|
if (msg.type() === 'error') errors.push(`[console.error] ${msg.text()}`)
|
|
})
|
|
|
|
// Navigiere direkt per URL statt gotoSection — gotoSection benutzt getByRole('navigation')
|
|
// welches bei Seiten mit Pager-Navigation (>1 Page) in strict-mode fehlschlägt (Infra-Bug).
|
|
for (const path of ['/', '/rennmaeuse', '/statistik', '/genetik', '/einstellungen']) {
|
|
await page.goto(path)
|
|
await page.waitForTimeout(800)
|
|
}
|
|
// Keine unkritischen Errors (ignoriere CORS-Warnungen, die im Dev-Modus normal sind)
|
|
const criticalErrors = errors.filter(
|
|
(e) =>
|
|
!e.includes('CORS') &&
|
|
!e.includes('favicon') &&
|
|
!e.includes('DevTools') &&
|
|
!e.includes('Warning:'),
|
|
)
|
|
expect(criticalErrors).toHaveLength(0)
|
|
})
|
|
|
|
// ── 12. DESKTOP-OVERFLOW-CHECK ───────────────────────────────────────────────
|
|
// (dieses Projekt-File läuft in beiden Viewports dank playwright.config.ts)
|
|
|
|
test('Live-Data: Rennmäuse-Liste kein horizontal Overflow (Desktop 1280px)', async ({ page }) => {
|
|
skipUnlessLive()
|
|
await gotoSection(page, de.nav.gerbils)
|
|
await expect(page.locator('.gerbil-row').first()).toBeVisible()
|
|
const overflow = await page.evaluate(() => ({
|
|
scrollWidth: document.documentElement.scrollWidth,
|
|
clientWidth: document.documentElement.clientWidth,
|
|
}))
|
|
expect(overflow.scrollWidth).toBeLessThanOrEqual(overflow.clientWidth + 2)
|
|
})
|