From 8be1c0e55a21f5d7df130251077063979d3f34e0 Mon Sep 17 00:00:00 2001
From: Marcel <marcel@familienarchiv>
Date: Sun, 10 May 2026 06:30:14 +0200
Subject: [PATCH] test(admin): expand TagTreeNode coverage

Color dot hidden at depth>0 and when color is null, document count
badge omitted at 0, toggle click mutates collapseMap.

4 new tests covering ~6 branches.

Refs #496.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 .../admin/tags/TagTreeNode.svelte.test.ts     | 46 +++++++++++++++++++
 1 file changed, 46 insertions(+)

diff --git a/frontend/src/routes/admin/tags/TagTreeNode.svelte.test.ts b/frontend/src/routes/admin/tags/TagTreeNode.svelte.test.ts
index 9c597820..d200e596 100644
--- a/frontend/src/routes/admin/tags/TagTreeNode.svelte.test.ts
+++ b/frontend/src/routes/admin/tags/TagTreeNode.svelte.test.ts
@@ -122,4 +122,50 @@ describe('TagTreeNode', () => {
 			.element(browserPage.getByRole('button', { name: /einklappen|ausklappen/i }))
 			.toBeVisible();
 	});
+
+	it('hides the color dot when depth > 0 (only top-level shows colors)', async () => {
+		mockPage.url = new URL('http://localhost/admin/tags');
+		const Node = await loadComponent();
+		render(Node, { props: { node: leafNode(), depth: 1, collapseMap: new SvelteMap() } });
+
+		const dot = document.querySelector('[data-testid="tag-list-color-dot"]');
+		expect(dot).toBeNull();
+	});
+
+	it('hides the color dot when node.color is null', async () => {
+		mockPage.url = new URL('http://localhost/admin/tags');
+		const Node = await loadComponent();
+		render(Node, {
+			props: { node: leafNode({ color: null }), depth: 0, collapseMap: new SvelteMap() }
+		});
+
+		const dot = document.querySelector('[data-testid="tag-list-color-dot"]');
+		expect(dot).toBeNull();
+	});
+
+	it('omits the document count badge when documentCount is 0', async () => {
+		mockPage.url = new URL('http://localhost/admin/tags');
+		const Node = await loadComponent();
+		render(Node, {
+			props: { node: leafNode({ documentCount: 0 }), depth: 0, collapseMap: new SvelteMap() }
+		});
+
+		const link = document.querySelector('a[href="/admin/tags/t1"]');
+		expect(link?.textContent).not.toMatch(/\(\d+\)/);
+	});
+
+	it('toggles the collapse state when the toggle button is clicked', async () => {
+		mockPage.url = new URL('http://localhost/admin/tags');
+		const Node = await loadComponent();
+		const map = new SvelteMap<string, boolean>();
+		render(Node, { props: { node: parentNode(), depth: 0, collapseMap: map } });
+
+		const toggle = Array.from(document.querySelectorAll('button')).find((b) =>
+			/einklappen|ausklappen/i.test(b.getAttribute('aria-label') ?? '')
+		) as HTMLButtonElement;
+		toggle?.click();
+		await new Promise((r) => setTimeout(r, 30));
+		// Map should have been mutated to opposite of current isCollapsed (false → true)
+		expect(map.get('tp1')).toBe(true);
+	});
 });