React patterns — always apply error boundaries, loading states, accessible markup, proper hooks, controlled forms, stable keys, and correct memoization
87
80%
Does it follow best practices?
Impact
99%
1.83xAverage score across 5 eval scenarios
Passed
No known issues
{
"context": "Tests whether the agent proactively applies correct useEffect patterns (cleanup, functional updaters, no derived state in useEffect) and accessibility when building a polling component. The task says nothing about cleanup, stale closures, functional updaters, or role=alert.",
"type": "weighted_checklist",
"checklist": [
{
"name": "Interval cleanup in useEffect",
"description": "The useEffect that sets up the polling interval returns a cleanup function that calls clearInterval to stop polling on unmount or when dependencies change. The agent was NOT asked about cleanup.",
"max_score": 16
},
{
"name": "Functional updater for state in interval",
"description": "State updates inside the setInterval callback use the functional updater form (setNotifications(prev => ...)) rather than directly referencing the state variable, to avoid stale closure bugs. The agent was NOT asked about stale closures.",
"max_score": 14
},
{
"name": "Unread count not in useEffect",
"description": "The unread notification count is computed during render (inline or with useMemo), NOT via useEffect updating a separate state variable. The agent was NOT asked about derived state patterns.",
"max_score": 14
},
{
"name": "No object in useEffect deps",
"description": "The useEffect dependency array does not contain objects or functions that would cause it to fire every render.",
"max_score": 10
},
{
"name": "Stable keys on notification items",
"description": "Notification items rendered in .map() use notification.id as the key prop, NOT the array index.",
"max_score": 10
},
{
"name": "Error handling with role=alert",
"description": "If polling or the simulated fetch can fail, an error state is rendered with role=\"alert\". Even if the simulation cannot fail, error handling patterns should be present. The agent was NOT asked about error handling or accessibility.",
"max_score": 10
},
{
"name": "aria-live on unread count",
"description": "The unread count region uses aria-live=\"polite\" so screen readers announce when the count changes. The agent was NOT asked about accessibility.",
"max_score": 10
},
{
"name": "TypeScript interfaces for props",
"description": "Component props and notification data types are defined with TypeScript interfaces. No use of 'any'.",
"max_score": 6
},
{
"name": "Loading state on initial render",
"description": "A loading indicator is shown before the first poll completes or initial data is available.",
"max_score": 6
},
{
"name": "Props destructured in signature",
"description": "Function components destructure their props in the function parameter.",
"max_score": 4
}
]
}