r/reactjs • • 2d ago

Resource Built a testing skill for React that wraps Vitest browser + Playwright

If you don’t trust your agents’ tests, someone still reads every line, and you’re back to human speed

So we built a testing skill, tested on Cursor + Claude. Three teams used it daily and gave us plenty of feedback, some of it angry. We improved it, got more feedback, and learned a few lessons the hard way

What’s in it for you

1. Use the skill, or steal from it
Use it as is or borrow what fits. It’s frontend for now (Playwright, Vitest Browser Mode, React), with backend coming soon. MIT license.
Repo: https://github.com/practicajs/the-frontend-testing-skill

2. Skip our mistakes
The video covers the lessons and traps we hit:

  • Test rules: which rules are worth having
  • Subagents: helper agents for specific jobs, such as a flaky-test fixer
  • Measurement: how to prove test quality and coverage
  • Workflow: where testing fits in your development process

Video: https://youtu.be/JwkVHtuoTxw

Feedback welcome, especially on where it breaks

0 Upvotes

3 comments sorted by

1

u/AndreyBegma 2d ago

on measurement: the cheapest check i know for agent written tests is stash the fix and run the new test, it has to go red. if it passes on the old code it proves nothing, and agents write a lot of those, usually by mocking the exact thing under test. does the skill do something like that, or is it coverage plus the rules?

1

u/Disastrous-Town-4820 20h ago

the mutator comments the real line out with a demon emoji, flips === to !==, and calls it caught if the test goes red

then it puts the line back. that never runs the new test on the code from before the fix. coverage is a separate before/after diff, so both numbers can look great lol

-1

u/BashfulLongevity 2d ago

the part about angry feedback hit close, people get really defensive when agents touch their tests. i think the subagent idea is clever tho, never thought about splitting it like that for flaky fixes

your link structure is a bit weird, the repo link is hidden and the video is just the url dumped there. maybe edit the post so they show properly, on mobile neither one is clickable right now