Visual Studio Code extension
01 01 Problem
Think about your testing loop right now. Most likely, it looks something like this:
- You write some code;
- You write tests for that code;
- You run those tests and address failures, if any.
- Rinse and repeat.
The shorter is the time between each step in this loop, the faster you can get from having no tests to having tests written and passing. And since debugging often involves tests, this is important for fixing bugs more efficiently, too!
One of the ways to improve your efficiency and optimize this testing loop is by getting faster feedback from your tests. As a baseline, you should see the test results right in your IDE, without even having to run any commands. Ideally, you should also have the tools to run a subset of tests, rerun them as you change your code, and debug failed test cases.
All of those things (and more) are provided by the official Vitest extension! Let's go through this exercise together and have it up and running in Visual Studio Code!
At the time of writing this, Vitest provides an official extension only for Visual Studio Code. Keep an eye on the IDE integrations for any future support for other IDEs.
Your task
π¨βπΌ In this exercise, let's go through the steps needed to get the Vitest extension up and running together.
π¨ First, install the Vitest extension from Visual Studio Code Marketplace (or search for "vitest" in the "Extensions" tab of the editor).

And ... that's it! π Next, let's explore how to use the extension to iterate on tests faster and help you debug failed tests more efficiently.