marcel/familienarchiv
1
0
Fork 0
Code Issues 119 Pull Requests 2 Actions Packages Projects Releases Wiki Activity

test(journeyitemcard): use getBoundingClientRect for 44px touch-target assertion

Browse Source 
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 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-06-08 23:25:12 +02:00
parent f9cdc02a77
commit 3572de487a
1 changed files with 3 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
frontend/src/lib/geschichte/JourneyItemCard.svelte.spec.ts
View File

@@ -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 () => {