test(frontend): add specs for Tabs, AlertBanner, BackLink, useHashTab
4 new spec files adding 21 tests (7+6+4+4). Each component spec includes brutalism invariant assertions (no rounded-md, no transition-*, no shadow-*). Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
39
frontend/tests/components/BackLink.test.tsx
Normal file
39
frontend/tests/components/BackLink.test.tsx
Normal file
@@ -0,0 +1,39 @@
|
||||
import { describe, it, expect } from 'vitest';
|
||||
import { render, screen } from '@testing-library/react';
|
||||
import { MemoryRouter } from 'react-router-dom';
|
||||
import { BackLink } from '@/components/BackLink';
|
||||
|
||||
function renderBackLink(to: string, label: string) {
|
||||
return render(
|
||||
<MemoryRouter>
|
||||
<BackLink to={to}>{label}</BackLink>
|
||||
</MemoryRouter>,
|
||||
);
|
||||
}
|
||||
|
||||
describe('BackLink', () => {
|
||||
it('renders children as link text', () => {
|
||||
renderBackLink('/engagements', 'Back to engagements');
|
||||
expect(screen.getByText('Back to engagements')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('renders as an anchor with the correct href', () => {
|
||||
renderBackLink('/engagements', 'Back to engagements');
|
||||
const link = screen.getByRole('link');
|
||||
expect(link).toHaveAttribute('href', '/engagements');
|
||||
});
|
||||
|
||||
it('has no rounded-md, transition-*, or shadow-* (brutalism)', () => {
|
||||
renderBackLink('/engagements', 'Back');
|
||||
const link = screen.getByRole('link');
|
||||
expect(link).not.toHaveClass('rounded-md');
|
||||
expect(link.className).not.toMatch(/transition-/);
|
||||
expect(link.className).not.toMatch(/shadow-/);
|
||||
});
|
||||
|
||||
it('contains the ArrowLeft icon (svg element)', () => {
|
||||
const { container } = renderBackLink('/engagements', 'Back');
|
||||
const svg = container.querySelector('svg');
|
||||
expect(svg).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user