Introducing Interactive Testing Challenges to How To Test Frontend.com

November 8, 2025
#testing#howtotestfrontend.com

I started this site (howToTestFrontend.com) earlier in the year, and it went live a few weeks ago. So far I have only been adding content with lessons on how to write tests, the main features of Jest, Vitest and React Testing Library that you need to know.

But one thing I've had in the back of my mind for a while is a 'testing challenge'.

So I have started this new section on the site found under courses, where I have written some incomplete or buggy test, and the challenge is that you have to update the test (in the test runner on this app, in your browser) to make them pass.

There are two types of challenges right now

  • Vitest/Jest testing challenges for fundamental testing challenges - things that aren't specific to React or frontend testing, but just general gotchas, common bugs, etc.
  • React testing challenges for React specific things. Basically anything that requires a render(<SomeComponent />) and use of React Testing Library

Over the coming days/weeks I'll add more challenges to these two sections. (Each one has around 10 challenges, ranging from extremely easy to moderate difficulty).

I'm hoping you find them good ways to learn realistic problems that you'll face when testing.

Try them out, let me know what you think. After you complete a challenge there is a feedback form - I read and take note of every submission, so please do fill it out if you can!

Found this useful? Share this article

TwitterLinkedIn Facebook

Want to become a pro at testing your React apps?

I've got a huge range of interactive lessons from beginner to expert level.

Get better at testing every week:

Join developers, engineers and testers who receive my free newsletter with React testing tips

I've been writing tests for years, but as I research content for this blog, I am always discovering new things in the tools we use every day!

Get free React/testing tips 👇