Vue.js: Testing and Debugging

Learn how to build robust Vue.js apps with testing and debugging tools that let you dig below the surface.

Introduction

• Testing Vue applications
• What you should know
• Exercise files for testing and debugging
• Why you need to test

1. Setting Up Testing Tools

• Setting up the sample project
• What makes up a testing toolkit?
• Getting started with Jest
• Syntax error checking with ESLint

2. Unit Testing

• Installing and running Jest
• Testing strings using matchers
• Testing numeric values
• Testing objects and arrays
• Organizing tests
• Testing asynchronous code
• Analyzing test coverage

3. Testing Vue Components

• Mounting components using render
• Accessing elements within a component
• Firing events on components

4. Debugging with Vue and Chrome Developer tools

• Debugging errors using Chrome DevTools
• Setting up Vue Devtools
• Debugging with Vue Devtools
• Tracking and debugging state
• Running a performance audit

5. Functional and Automated Testing

• Introduction to Cypress
• Running a simple end-to-end test with Cypress
• Automated testing with CircleCI

Conclusion

• Next steps with testing