diff --git a/frontend/src/__tests__/pages/records-request-checklist.test.tsx b/frontend/src/__tests__/pages/records-request-checklist.test.tsx new file mode 100644 index 000000000..992f669e4 --- /dev/null +++ b/frontend/src/__tests__/pages/records-request-checklist.test.tsx @@ -0,0 +1,37 @@ +import { StrictMode, type ReactNode } from 'react'; +import { render, screen } from '@testing-library/react'; +import { describe, expect, it, vi } from 'vitest'; + +import { RecordsRequestChecklistClient } from '@/app/tools/records-request-checklist/components/RecordsRequestChecklistClient'; + +vi.mock('@/app/actions/submit-assessment', () => ({ submitAssessment: vi.fn() })); + +// Exercise the results render path without entering any assessment or lead data. +vi.mock('@/components/fsma/FSMAToolShell', () => ({ + FSMAToolShell: ({ renderResults }: { renderResults: (answers: Record) => ReactNode }) => ( + <>{renderResults({})} + ), +})); + +vi.mock('framer-motion', () => ({ + useReducedMotion: () => true, + motion: { + div: ({ children }: { children?: ReactNode }) =>
{children}
, + }, +})); + +describe('records request checklist results', () => { + it('renders and rerenders results without render-time state updates', () => { + const errors = vi.spyOn(console, 'error').mockImplementation((message) => { + throw new Error(String(message)); + }); + try { + const view = render(); + expect(screen.getByRole('heading', { name: 'What You Reported' })).toBeInTheDocument(); + expect(() => view.rerender()).not.toThrow(); + expect(errors).not.toHaveBeenCalled(); + } finally { + errors.mockRestore(); + } + }); +}); diff --git a/frontend/src/app/tools/records-request-checklist/components/RecordsRequestChecklistClient.tsx b/frontend/src/app/tools/records-request-checklist/components/RecordsRequestChecklistClient.tsx index cdf6b4374..3f4cc3c7c 100644 --- a/frontend/src/app/tools/records-request-checklist/components/RecordsRequestChecklistClient.tsx +++ b/frontend/src/app/tools/records-request-checklist/components/RecordsRequestChecklistClient.tsx @@ -134,8 +134,6 @@ export function RecordsRequestChecklistClient() { const [leadSubmitted, setLeadSubmitted] = useState(false); const [submitting, setSubmitting] = useState(false); const [submitError, setSubmitError] = useState(''); - const [lastScore, setLastScore] = useState<{ score: number; grade: string }>({ score: 0, grade: 'F' }); - const [lastAnswers, setLastAnswers] = useState>({}); function calcScore(answers: Record) { let totalScore = 0; @@ -152,10 +150,11 @@ export function RecordsRequestChecklistClient() { return { score: totalScore, grade }; } - const handleLeadSubmit = async (e: React.FormEvent) => { + const handleLeadSubmit = async (e: React.FormEvent, answers: Record) => { e.preventDefault(); setSubmitting(true); setSubmitError(''); + const { score, grade } = calcScore(answers); const formData = new FormData(e.currentTarget); const attribution = getConversionAttribution(); const data: AssessmentFormData = { @@ -170,9 +169,9 @@ export function RecordsRequestChecklistClient() { utmCampaign: attribution.utm_campaign, referrer: getReferrerHostname(), toolInputs: { - score: lastScore.score, - grade: lastScore.grade, - answers: lastAnswers + score, + grade, + answers } }; try { @@ -196,9 +195,7 @@ export function RecordsRequestChecklistClient() { }; const renderResults = (answers: Record) => { - const { score, grade } = calcScore(answers); - setLastScore({ score, grade }); - setLastAnswers(answers); + const { score } = calcScore(answers); return (

Want to Discuss Your Checklist?

-
+ handleLeadSubmit(e, answers)} className="mx-auto max-w-md space-y-4">