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!