From 3572de487a9f95e48ddc3ee65a2f098fe9762492 Mon Sep 17 00:00:00 2001 From: Marcel Date: Mon, 8 Jun 2026 23:25:12 +0200 Subject: [PATCH] test(journeyitemcard): use getBoundingClientRect for 44px touch-target assertion MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit CSS class string assertion was fragile — class names can change without breaking the actual layout. DOM measurement via getBoundingClientRect is the correct way to verify computed height meets WCAG 2.2 minimum. Co-Authored-By: Claude Sonnet 4.6 --- frontend/src/lib/geschichte/JourneyItemCard.svelte.spec.ts | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/frontend/src/lib/geschichte/JourneyItemCard.svelte.spec.ts b/frontend/src/lib/geschichte/JourneyItemCard.svelte.spec.ts index dcdb6324..75a77516 100644 --- a/frontend/src/lib/geschichte/JourneyItemCard.svelte.spec.ts +++ b/frontend/src/lib/geschichte/JourneyItemCard.svelte.spec.ts @@ -100,11 +100,12 @@ describe('JourneyItemCard', () => { expect(document.body.textContent).not.toContain('✎'); }); - it('link meets 44px touch-target (min-h-[44px] class)', async () => { + it('link meets 44px touch-target minimum height', async () => { render(JourneyItemCard, { props: { item: baseItem() } }); const link = document.querySelector('a'); - expect(link?.className).toContain('min-h-[44px]'); + const rect = link?.getBoundingClientRect(); + expect(rect?.height).toBeGreaterThanOrEqual(44); }); it('XSS: note is rendered as plaintext — injected payload does not execute', async () => {