frontend/src/routes/geschichten/page.svelte.spec.ts

@@ -350,3 +350,46 @@ describe('geschichten page — multi-person filter chips', () => {
 		expect(addEl.className).toContain('h-11');
 	});
 });
+
+// ─── Entwürfe section ─────────────────────────────────────────────────────────
+
+describe('geschichten page — Entwürfe section', () => {
+	const draft = () =>
+		({
+			id: 'draft-1',
+			title: 'Mein Entwurf',
+			body: '<p>test</p>',
+			type: 'STORY',
+			status: 'DRAFT',
+			author: { firstName: 'Max', lastName: 'Muster' },
+			publishedAt: null
+		}) as unknown as PageData['geschichten'][0];
+
+	it('Entwürfe section is hidden when drafts array is empty', async () => {
+		render(Page, { data: makeData({ drafts: [] }) });
+		const heading = Array.from(document.querySelectorAll('h2')).find(
+			(h) => h.textContent?.includes('Entwürfe') || h.textContent?.includes('Drafts')
+		);
+		expect(heading).toBeUndefined();
+	});
+
+	it('Entwürfe section is visible when drafts are present', async () => {
+		render(Page, { data: makeData({ drafts: [draft()] as PageData['geschichten'] }) });
+		const heading = Array.from(document.querySelectorAll('h2')).find(
+			(h) => h.textContent?.includes('Entwürfe') || h.textContent?.includes('Drafts')
+		);
+		expect(heading).not.toBeUndefined();
+	});
+
+	it('renders a row for each draft story', async () => {
+		render(Page, { data: makeData({ drafts: [draft()] as PageData['geschichten'] }) });
+		const link = document.querySelector('a[href="/geschichten/draft-1"]');
+		expect(link).not.toBeNull();
+	});
+
+	it('draft row shows the draft badge', async () => {
+		render(Page, { data: makeData({ drafts: [draft()] as PageData['geschichten'] }) });
+		const badge = document.querySelector('[data-testid="draft-badge"]');
+		expect(badge).not.toBeNull();
+	});
+});