Vitest and the big picture: Shipping and maintaining quality applications

Jessica Sachs
Maintainer of Vue test utils

Vitest and the big picture: Shipping and maintaining quality applications

Nov 18, 2024
9 - 5pm
Novotel Toronto North York

Workshop details

For some developers, writing tests is a chore. For others, testing is part of their development process. Looking at the big picture, we're all trying to accomplish the same goal: shipping quality applications that are maintainable. Sometimes we use tests to do that.

Regardless of which camp you fall under, this workshop is for you. If you're trying to learn how to teach others how to test their code or if you're being asked to test your code and have no idea where to start... start here! You'll learn specific techniques as well as abstract concepts that will help you test your app, composables, and components.

The goal of this workshop is to teach you concepts about delivering quality software that you can apply to any situation or stack. We'll do this in round table discussions, conversation, and using practical coding exercises in Vue and TypeScript (or JavaScript).

This workshop will teach you how to think about testing and how to use Vitest (optionally with its new browser mode) in order to help you write tests and understand what to test.

You'll learn about framework agnostic tools and concepts such as:

  1. How to systemically fix "flaky" tests.
  2. How to test "things that mount in the browser" in the generic sense.
  3. How to utilize Testing Library to make interacting with and finding components a breeze.
  4. How to use Mock Service Worker to mock out network requests.
  5. When to use end-to-end or integration testing tools instead of Vitest.
  6. The benefits of realistic mock data using Faker.js.

You'll learn Vue-specific concepts such as:

  1. How to test your Vue components with your users in mind (both developers and end users!).
  2. How to test components that use slots, scoped slots, events, and props.
  3. How to test composables?
  4. How and when to mock Vue Router.
  5. How to easily test code that relies on state management tools like Pinia.