72cd6f5bbc
Uses the same heroicon as DocumentThumbnail so the "no thumbnail yet" signal reads identically across the app: one shape, one meaning. The parchment SVG still lives on in the fully-empty state (no resume doc at all), where it represents a different thing — we removed it only from the "document exists, thumbnail not generated yet" branch (#309). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
80 lines
3.0 KiB
TypeScript
80 lines
3.0 KiB
TypeScript
import { describe, it, expect, afterEach } from 'vitest';
|
|
import { cleanup, render } from 'vitest-browser-svelte';
|
|
import { page } from 'vitest/browser';
|
|
|
|
import DashboardResumeStrip from './DashboardResumeStrip.svelte';
|
|
import type { components } from '$lib/generated/api';
|
|
|
|
type DashboardResumeDTO = components['schemas']['DashboardResumeDTO'];
|
|
|
|
afterEach(() => {
|
|
cleanup();
|
|
});
|
|
|
|
const mockResume: DashboardResumeDTO = {
|
|
documentId: 'doc-123',
|
|
title: 'Geburtsurkunde 1920',
|
|
caption: 'Max Mustermann · 1920-01-01',
|
|
excerpt: 'Hiermit wird beurkundet…',
|
|
totalBlocks: 4,
|
|
pct: 75,
|
|
collaborators: []
|
|
};
|
|
|
|
const mockResumeWithThumbnail: DashboardResumeDTO = {
|
|
...mockResume,
|
|
thumbnailUrl: '/api/documents/doc-123/thumbnail?v=2026-04-23T09%3A00'
|
|
};
|
|
|
|
describe('DashboardResumeStrip', () => {
|
|
it('renders empty state heading when resumeDoc is null', async () => {
|
|
render(DashboardResumeStrip, { resumeDoc: null });
|
|
const heading = page.getByRole('heading', { name: /Noch kein Dokument begonnen/i });
|
|
await expect.element(heading).toBeInTheDocument();
|
|
});
|
|
|
|
it('renders progressbar with correct aria-valuenow when resumeDoc is provided', async () => {
|
|
render(DashboardResumeStrip, { resumeDoc: mockResume });
|
|
const bar = page.getByRole('progressbar');
|
|
await expect.element(bar).toBeInTheDocument();
|
|
await expect.element(bar).toHaveAttribute('aria-valuenow', '75');
|
|
});
|
|
|
|
it('shows document title when resumeDoc is provided', async () => {
|
|
render(DashboardResumeStrip, { resumeDoc: mockResume });
|
|
const title = page.getByRole('heading', { name: /Geburtsurkunde 1920/i });
|
|
await expect.element(title).toBeInTheDocument();
|
|
});
|
|
|
|
it('links to the document for the CTA', async () => {
|
|
render(DashboardResumeStrip, { resumeDoc: mockResume });
|
|
const link = page.getByRole('link', { name: /Weitertranskribieren/i });
|
|
await expect.element(link).toHaveAttribute('href', '/documents/doc-123');
|
|
});
|
|
|
|
it('shows block count label', async () => {
|
|
render(DashboardResumeStrip, { resumeDoc: mockResume });
|
|
const label = page.getByText(/4 Abschnitte/i);
|
|
await expect.element(label).toBeInTheDocument();
|
|
});
|
|
|
|
it('renders thumbnail img with expected attrs when thumbnailUrl is set', async () => {
|
|
render(DashboardResumeStrip, { resumeDoc: mockResumeWithThumbnail });
|
|
const img = page.getByTestId('resume-thumbnail-img');
|
|
await expect.element(img).toBeInTheDocument();
|
|
await expect
|
|
.element(img)
|
|
.toHaveAttribute('src', '/api/documents/doc-123/thumbnail?v=2026-04-23T09%3A00');
|
|
await expect.element(img).toHaveAttribute('alt', '');
|
|
await expect.element(img).toHaveAttribute('loading', 'lazy');
|
|
await expect.element(img).toHaveAttribute('decoding', 'async');
|
|
});
|
|
|
|
it('renders fallback icon when thumbnailUrl is null', async () => {
|
|
render(DashboardResumeStrip, { resumeDoc: mockResume });
|
|
const fallback = page.getByTestId('resume-thumbnail-fallback');
|
|
await expect.element(fallback).toBeInTheDocument();
|
|
await expect.element(page.getByTestId('resume-thumbnail-img')).not.toBeInTheDocument();
|
|
});
|
|
});
|