sandrodachandClaude Opus 5.5
a62b204e14
MindSift CI & Docker Release / Build, Test in Container & Push (push) Successful in 2m30s
- CountBadge component (accent / muted, inline / corner, 99+, showZero); used in the nav bar, task list and list tabs, admin organizations and numeric badges of the mobile menu; old badge-count removed - Counters sit on the top right corner of tabs; "Alle Aufgaben" gets one (desktop tab and mobile menu) - Open/done task counters include tasks in shared lists, matching what "Alle Aufgaben" shows (nav counter was too low) - Theme template derives --accent-dim/--accent-border from the accent - Docs: ui-patterns counters section Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
24 lines
1.0 KiB
TypeScript
24 lines
1.0 KiB
TypeScript
import { describe, it, expect } from 'vitest';
|
|
import { render } from '@testing-library/react';
|
|
import { CountBadge } from '../CountBadge';
|
|
|
|
describe('CountBadge', () => {
|
|
it('hides itself at zero unless asked', () => {
|
|
expect(render(<CountBadge count={0} />).container.firstChild).toBeNull();
|
|
expect(render(<CountBadge count={undefined} />).container.firstChild).toBeNull();
|
|
expect(render(<CountBadge count={0} showZero />).container.textContent).toBe('0');
|
|
});
|
|
|
|
it('caps large numbers and keeps the real value for screen readers', () => {
|
|
const el = render(<CountBadge count={150} />).container.firstChild as HTMLElement;
|
|
expect(el.textContent).toBe('99+');
|
|
expect(el.getAttribute('aria-label')).toBe('150');
|
|
});
|
|
|
|
it('maps variant and position to the shared classes', () => {
|
|
const el = render(<CountBadge count={3} variant="accent" position="corner" />).container.firstChild as HTMLElement;
|
|
expect(el.className).toContain('count-badge-accent');
|
|
expect(el.className).toContain('count-badge-corner');
|
|
});
|
|
});
|