Outside-in Testing in Vue with Cypress
Download as PPTX, PDF0 likes136 views
The document discusses outside-in testing and test-driven development (TDD) specifically for Vue, emphasizing its effectiveness and benefits such as enhanced code quality and increased development speed. It raises common questions about testing priorities and coverage, suggesting that TDD can lead to 100% test coverage and minimal code. Additionally, it promotes Cypress as a tool that facilitates TDD for end-to-end testing, inviting users to learn more and consider career opportunities.
Outside-in Testing in Vue with Cypress
- 1. Outside-In Testing In Vue Josh Justice learntdd.in/vue
- 3. Talk to us about Vue projects!
- 4. Free 30 Day Trial [email protected]
- 5. Vue is one of the most testable frontend frameworks
- 7. Questions! 🤔 • Do I write the test or production code first? • What do I test first? • How many E2E/unit tests do I write? • How much test code do I write at a time? Production code? • Do I test every line of code and configuration?
- 8. Test-Driven Development: An approach to testing that provides a consistent set of answers to those questions.
- 11. A note on test coverage
- 13. https://www.cypress.io/how-it-works/ "One of our goals was to make test-driven development a reality for end-to-end testing. Cypress is at its best when you use it as you build your application. We give you the power to code as fast as possible.”
- 14. “…unlock the ability to do TDD with full end- to-end tests for the very first time…The end result is that you will have developed more, your code will be better, and it will be completely tested.” https://www.cypress.io/how-it-works/
- 15. learntdd.in/vue
- 16. live demo 😅
- 17. Requirement: as a user, I want to be able to send a message.
- 18. Why TDD?
- 21. Minimal code.
- 23. Ability to ship quickly.
- 25. TDD can be one of your distinctives
- 27. To Learn More
- 28. Apply for future positions! bignerdranch.com/about/careers
- 29. 🤔 Questions?
Editor's Notes
- #5: We are adding more and more web content across different frameworks Just added a talk about testing Vue components Also about extracting a component under test; it’s in React but the principles apply to Vue Free trial to check it out and let us know what you want to see
- #6: Who here uses the Vue web pack template?
- #7: How many of you use the Webpack template? E2E and component testing built in
- #8: But you still have a lot of questions
- #10: Diagram from Growing Object Oriented Software Guided by Tests
- #11: Outside-in TDD
- #12: Webpack template has Istanbul code coverage built in Specifically it’s unit test coverage The people I’ve learned testing from, whose opinions I respect the most, don’t talk about percentage coverage Here’s why. In TDD, end-to-end tests necessarily cover everything You don’t need a unit test to cover everything; it doesn’t deliver value
- #13: Cypress was specifically built with a focus on TDD Completely free to use Nearing 1.0 release Based in Atlanta, some Cypress folks in the room—introduce them
- #14: Cypress was specifically built with a focus on TDD Completely free to use Nearing 1.0 release Based in Atlanta, some Cypress folks in the room—introduce them
- #15: Cypress was specifically built with a focus on TDD Completely free to use Nearing 1.0 release Based in Atlanta, some Cypress folks in the room—introduce them I can’t vouch for the fact of whether you can do TDD with Nightwatch. But I don’t hear of many people doing it
- #29: Several Vue projects for a major company Apply for future positions