Testing Library patterns for React component testing — queries, user events,
99
99%
Does it follow best practices?
Impact
100%
1.03xAverage score across 8 eval scenarios
Passed
No known issues
{
"context": "Tests whether the agent follows the correct query priority hierarchy — preferring accessible queries (getByRole, getByLabelText) over text queries over getByTestId — and avoids brittle CSS selectors, component-name selectors, and container.innerHTML assertions.",
"type": "weighted_checklist",
"checklist": [
{
"name": "getByRole preferred",
"description": "At least two distinct elements are queried using getByRole (e.g. heading, list, listitem, button, navigation)",
"max_score": 14
},
{
"name": "getByLabelText for form fields",
"description": "Any form input elements present in the component are queried using getByLabelText rather than getByTestId or querySelector",
"max_score": 10
},
{
"name": "No querySelector usage",
"description": "Does NOT use container.querySelector (or document.querySelector) to find elements in any assertion",
"max_score": 14
},
{
"name": "No wrapper.find component selectors",
"description": "Does NOT use Enzyme-style wrapper.find('ComponentName') or any component-name-based query",
"max_score": 10
},
{
"name": "No container.innerHTML assertion",
"description": "Does NOT assert on container.innerHTML or element.innerHTML to verify content",
"max_score": 10
},
{
"name": "getByTestId only as last resort",
"description": "Either does NOT use getByTestId at all, OR uses getByTestId only for elements that have no accessible role, label, or meaningful visible text",
"max_score": 10
},
{
"name": "No implementation detail assertions",
"description": "Does NOT assert on internal component state, prop values, or CSS class names",
"max_score": 10
},
{
"name": "jest-dom matchers used",
"description": "Uses jest-dom matchers (e.g. toBeInTheDocument, toHaveTextContent, toBeVisible) rather than raw DOM property checks",
"max_score": 10
},
{
"name": "Regex matchers for text",
"description": "At least one query uses a regex (e.g. /text/i) for case-insensitive or partial text matching",
"max_score": 6
},
{
"name": "render and screen imports",
"description": "Imports render and screen from '@testing-library/react'",
"max_score": 6
}
]
}evals
scenario-1
scenario-2
scenario-3
scenario-4
scenario-5
scenario-6
scenario-7
scenario-8
skills
testing-library-patterns
verifiers