Workshop: Head-to-Head Web Testing: Part 1 with Cypress
- 1. 1 How to start with Cypress
- 2. - almost 7 years at Slido - Mostly test automation - Cypress ambassador - filiphric.com - Cypress tips - Workshops, presentations, webinars, courses, streaming, youtube, consultations 👋 Filip Hric
- 4. Workshop form - 📚 Chapter overview - 👀 Demo - Practical challenge - try it at home! - ❓ Q&A continually, use your mic, or in Q&A section
- 5. How well do you know Cypress?
- 6. 👀 Workshop form - demos - code example, short presentation - I’ll start in demo_start.js - finished state in demo_end.js - notes for everything I plan on saying are in notes/notes.md - I tend to improvise 😅
- 7. Workshop form - practical challenges
- 8. Workshop form - practical challenges - open your editor and go to challenge.js - run it in Cypress - look at the solution in challenge_solution.js
- 9. Important note: you don’t need to finish all the practical challenges
- 10. 🔧 Tools we will be using
- 11. VS Code
- 12. Cypress
- 13. Trello app
- 14. Database seeding
- 15. 15 Cypress project & GUI Chapter #0:
- 16. 📚 What you’ll learn - how to install Cypress - how does a Cypress project look like - what is the purpose of different project folders - how to choose a different browser in Cypress
- 17. 👀 Demo
- 18. 18 Creating first test Chapter #1:
- 19. 📚 What you’ll learn - how to write your first test - what kind of syntax does Cypress use - how to setup url of the page we want to test - what are the capabilities of Cypress app - how to click, type - what kind of checks does Cypress perform in the background
- 20. 👀 Demo
- 23. 📚 What you’ll learn - how to use .should() command - beforeEach() hook - how to check visibility, state, class or number of elements - what to look out for when making assertions
- 24. 👀 Demo
- 27. 📚 What you’ll learn - how does chaining commands work in Cypress - how built-in retrying in Cypress works - how to write effective command chains - how to write your test if the app is flaky
- 28. 👀 Demo
- 31. 📚 What you’ll learn - how to use .then() function - how to use expect() assertions - how to make assertions on multiple elements - how to make Cypress retry assertions on multiple elements
- 32. 👀 Demo
- 35. 📚 What you’ll learn - how to send an http request - how to test response from server - how to set up different attributes - how to reset Trello app
- 36. 👀 Demo
- 39. 📚 What you’ll learn - how to watch API requests that our app makes - how to test those API requests - how to stabilize a flaky test - different ways of matching our requests
- 40. 👀 Demo
- 43. 📚 What you’ll learn - where to find Cypress plugins - how to install and use a Cypress plugin
- 44. 👀 Demo