Testing Vue.js components with Jest
Minimum price
Suggested price

Testing Vue.js components with Jest

A concise guide to testing Vue.js components using Jest and the official library vue-test-utils

About the Book

Vue.js has become the most popular framework of 2018. People is excited about it, and that's no surprise given how productive, easy to use and flexible it is. You've probably already use it, but... Have you done testing in Vue.js?

Unit testing in modern component based JavaScript frameworks is not easy. Components are connected to each other and the browser adds a layer of UI, which makes everything so dependent while we must test components in isolation. We want the test suite to be reliable and to run fast as well.

This book shows you by practise how to test easily Vue.js components and take advantage of the fully featured Jest testing framework. It will guide you through testing styles and structure as well as testing behaviours of you Vue.js components. You'll see how to apply techniques such as snapshot testing, shallow rendering, module dependency mocking and module aliasing to make smoother and cleaner your tests.

About the Author

Alex Jover Morales
Alex Jover Morales

Vue.js core team partner. Co-organizes @AlicanteFront and Vue Day. Instructor @eggheadio at @alligatorio. Interested on Web Performance, PWA, code quality and the human side of code.

Reader Testimonials

Kirsty Forrester
Kirsty Forrester

This is the first book I've read on this topic which was actually useful. I've tried to set up module aliases for a while and now I've got it done in a couple of minutes. THANK YOU.

Paul Melero
Paul Melero

This has been the most valuable resource while learning to test Vue components so far. Thanks, @alexjoverm!

M Haris Khan
M Haris Khan

Thanks Alex! What I needed, explained very well.

Table of Contents

  • 1. Write the first Vue.js Component Unit Test in Jest
    • Set up a vue-test sample project
    • Testing a Component
    • Testing a Component with vue-test-utils
  • 2. Test Deeply Rendered Vue.js Components
    • Adding a Message Component
    • Testing MessageList with Message Component
  • 3. Test Styles and Structure
    • The Wrapper object
  • 4. Test Properties and Custom Events
    • Properties
    • Custom Events
    • Wrapping up
  • 5. Test Computed Properties and Watchers
    • Computed Properties
    • Watchers
    • Wrapping Up
  • 6. Test Methods and Mock Dependencies
    • Mock External Module Dependencies
    • Keep mocks externalized
    • Wrapping Up
  • 7. Test Vue.js Slots
    • Make MessageList slot based
    • $children and $slots
    • Testing Slots
    • Testing Named Slots
    • Testing Contextual Slot Specs
    • Wrapping
  • 8. Enhance Jest configuration with Module Aliases
    • Webpack aliases
    • Multiple aliases
    • Other solutions
    • Wrapping Up
  • 9. Snapshot Testing
    • Rethinking in Snapshots
    • When Snapshot Testing doesn’t help
    • When a test fails
    • Conclusion

The Leanpub 60-day 100% Happiness Guarantee

Within 60 days of purchase you can get a 100% refund on any Leanpub purchase, in two clicks.

See full terms

80% Royalties. Earn $16 on a $20 book.

We pay 80% royalties. That's not a typo: you earn $16 on a $20 sale. If we sell 5000 non-refunded copies of your book or course for $20, you'll earn $80,000.

(Yes, some authors have already earned much more than that on Leanpub.)

In fact, authors have earnedover $12 millionwriting, publishing and selling on Leanpub.

Learn more about writing on Leanpub

Free Updates. DRM Free.

If you buy a Leanpub book, you get free updates for as long as the author updates the book! Many authors use Leanpub to publish their books in-progress, while they are writing them. All readers get free updates, regardless of when they bought the book or how much they paid (including free).

Most Leanpub books are available in PDF (for computers) and EPUB (for phones, tablets and Kindle). The formats that a book includes are shown at the top right corner of this page.

Finally, Leanpub books don't have any DRM copy-protection nonsense, so you can easily read them on any supported device.

Learn more about Leanpub's ebook formats and where to read them

Write and Publish on Leanpub

You can use Leanpub to easily write, publish and sell in-progress and completed ebooks and online courses!

Leanpub is a powerful platform for serious authors, combining a simple, elegant writing and publishing workflow with a store focused on selling in-progress ebooks.

Leanpub is a magical typewriter for authors: just write in plain text, and to publish your ebook, just click a button. (Or, if you are producing your ebook your own way, you can even upload your own PDF and/or EPUB files and then publish with one click!) It really is that easy.

Learn more about writing on Leanpub