Chapter 11. Testing mixins and filters

 

This chapter covers

  • Using Vue mixins and filters in a project
  • Writing unit tests for Vue mixins and filters
  • Writing unit tests for components that use Vue mixins and filters

Mixins and filters are great ways to add reusable functionality to Vue components. In this chapter, you’ll learn what mixins and filters are and how to write unit tests for them.

At this point in the book, the Hacker News application is looking good. You have Vue, Vue Router, and Vuex—the holy trinity of Vue applications—working together to create a dynamic Hacker News feed. In this chapter, you’ll add some finishing touches to improve the UI.

The first section is about mixins. You’ll learn what mixins are and how to test them by creating a mixin to set the document title depending on the view that’s currently rendered. You’ll learn how to write unit tests for the mixin itself and how to write unit tests for components that use the mixin.

After you’ve added mixins, I’ll teach you how to test filters. In the same way, you’ll learn what filters are, how to write unit tests for filters, and how to write unit tests for components that use filters.

Let’s start by looking at mixins.

11.1. Testing mixins

Mixins add functionality to Vue components (there’s a more robust definition of mixins later in this chapter). They can contain complicated logic, so it’s important to learn how to test them.

11.2. Testing filters

Summary

Exercises

sitemap