Do you know this feeling when a tool “clicks”? When you suddenly become so comfortable with it that it’s no longer just a means to an end but an instrument to craft better experiences for yourself. Over the past decade, that transition has happened with a bunch of tools for me.
Today, I want it to happen for you with Vitest.
In this workshop, my goal is to make you a Vitest superuser. And that means stepping beyond the basics and into the advanced. That means getting so good at Vitest that you would feel confident crafting custom test experiences, understanding the inner works of your test runner, and equipping that knowledge to solve everything from complexity issues to poor test performance.
Welcome to the Advanced Vitest Patterns workshop!
What You’ll Learn
The overarching theme of this workshop is customization. I believe your experience with tools is defined by how well you understand them and how comfortable you are when it comes to customizing them. With this workshop, I’ve collected some of the best techniques and pieces of advice to make you a true Vitest superuser.
I’m also taking this workshop as an opportunity to teach you the importance of the test setup. Throughout the exercises, you will be crafting your own test experience through things like custom fixtures, matchers, and equality testers. This will help you orchestrate tests for complex, real-world applications.
Setup
In the first block, you will get more comfortable with Vitest. From writing and debugging tests faster with the Vitest’s extension for Visual Studio Code, to configuring and visually exploring code coverage and setting up multiple test projects to use your test runner to the fullest.
Context
You will learn how to customize your test experience by creating custom fixtures. Discover the fixture syntax, its life-cycle, and how to implement them in a type-safe way. Then, note down the best practices of fixture design to make sure your custom fixtures eradicate complexity, not introduce it.
Assertions
Following the topic of customization, find out how you can supercharge your assertions. First, you will create your own matchers to help express your expectations toward your tested app and make your tests read like human language. Then, explore what is an equality tester and how you can teach the Vitest’s built-in .toEqual
matcher to compare the incomparable.
Nail down how to write assertions for eventual states with expect.poll
and become in full control of how much information you get out of failed assertions by understanding the balance between the hard and soft assertions.
Performance
And yes, I’ve saved the best for last. Performance.
Learn how to profile slow test runs using built-in metrics in Vitest as well as the vitest-profiler-plugin
. You will read the CPU and heap profiles, understand what they mean, and how you can use them to hunt down the problematic areas of your tests.
Everything past this point is techniques to make your tests faster. We are talking up to x40 times faster (that’s not a typo). Take a peek behind the scenes to see how Vitest orchestrates test runs and what defaults it has in place to ensure reliable results. Go through the difference between parallelization and concurrency in tests, explore the effects test isolation has on performance, and learn how to split your tests into shards for faster CI/CD jobs.
Who Is This Workshop For
This workshop is for all developers who want to learn how to customize Vitest to create better, custom test experiences on top of it. For everyone who has felt like adding a new test in your project feels like fighting against the entire world. For everyone who has found themselves lost before a slow test suite.
As the name suggests, you will be going through advanced topics, which makes a prior basic experience with Vitest mandatory to get the most out of these exercises.