Skip to content

Commit 4f3188a

Browse files
committed
test(resume-preview): add accessibility compliance test suite (JhaSourav07#2876)
1 parent 94e7eb8 commit 4f3188a

1 file changed

Lines changed: 79 additions & 0 deletions

File tree

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
import { render, screen } from '@testing-library/react';
2+
import { describe, it, expect, vi } from 'vitest';
3+
import ResumePreviewForm from './ResumePreviewForm';
4+
import type { ReactNode, HTMLAttributes } from 'react';
5+
import '@testing-library/jest-dom';
6+
7+
vi.mock('framer-motion', () => ({
8+
motion: {
9+
div: ({ children, ...props }: HTMLAttributes<HTMLDivElement> & { children?: ReactNode }) => (
10+
<div {...props}>{children}</div>
11+
),
12+
},
13+
}));
14+
15+
const parsed = {
16+
name: 'John Doe',
17+
email: 'john@example.com',
18+
phone: '1234567890',
19+
skills: ['React'],
20+
education: [],
21+
experience: [],
22+
};
23+
24+
describe('ResumePreviewForm - Accessibility compliance', () => {
25+
const onBack = vi.fn();
26+
const onComplete = vi.fn();
27+
28+
it('checks that crucial fields have associated visible text labels', () => {
29+
render(
30+
<ResumePreviewForm
31+
githubUsername="john"
32+
parsed={parsed}
33+
fileName="resume.pdf"
34+
onBack={onBack}
35+
onComplete={onComplete}
36+
/>
37+
);
38+
39+
// Form inputs should have associated visible text labels
40+
expect(screen.getByText('Full Name')).toBeInTheDocument();
41+
expect(screen.getByText('Email')).toBeInTheDocument();
42+
expect(screen.getByText('Skills')).toBeInTheDocument();
43+
expect(screen.getByText('Education')).toBeInTheDocument();
44+
expect(screen.getByText('Experience')).toBeInTheDocument();
45+
});
46+
47+
it('checks that interactive inputs have focus-visible or outline configurations', () => {
48+
render(
49+
<ResumePreviewForm
50+
githubUsername="john"
51+
parsed={parsed}
52+
fileName="resume.pdf"
53+
onBack={onBack}
54+
onComplete={onComplete}
55+
/>
56+
);
57+
58+
const nameInput = screen.getByDisplayValue('John Doe');
59+
expect(nameInput).toHaveClass('focus:ring-2');
60+
expect(nameInput).toHaveClass('focus:ring-emerald-500');
61+
expect(nameInput).toHaveClass('outline-none');
62+
});
63+
64+
it('checks that the save button is disabled when saving to prevent multiple submissions', () => {
65+
render(
66+
<ResumePreviewForm
67+
githubUsername="john"
68+
parsed={parsed}
69+
fileName="resume.pdf"
70+
onBack={onBack}
71+
onComplete={onComplete}
72+
/>
73+
);
74+
75+
// Initially not disabled
76+
const saveButton = screen.getByRole('button', { name: /Save Profile/i });
77+
expect(saveButton).not.toBeDisabled();
78+
});
79+
});

0 commit comments

Comments
 (0)