Refactor via extractions

In the last episode, we covered how our tests should be named in a clear way that describes the requirements they are enforcing, this is a good way to allow the usage of our test suite as a second form of documenting the requirements of the application, however, this can start to get hard to organize as the number of tests grows. To account for this, in this lesson, we’ll explore ways to better organize our test suite by grouping tests with describe() blocks, and reducing test code repetition via hooks like beforeEach().

Furthermore, this episode will also provide tips and tricks for writing less fragile tests by focusing on concepts instead of specific hardcoded messages. Finally, we’ll also explore a little bit of Typescript UtilityTypes.

Topics covered:

• Grouping tests for better readability
• Vitest beforeEach()
• Typescript UtilityTypes (ReturnType<>)

Links

• Git Diff for Episode 5
• Start lesson from code in this Git Commit
• Vite
• Vue Test Utils
• Vitest beforeEach
• Typescript Utility Types