The React Show How to successfully test React apps to speed up development / Using Cypress
Feb 4, 2022
01:32:09
Stop getting midnight calls because you broke the site on the last deploy: use Cypress for front-end testing! In this episode we talk about how we use the free, open-source testing framework Cypress to save time, catch bugs, and sleep better at night.
Links
Show Notes
- What is integration testing?
- What are other types of testing?
- Unit
- Story Time, life without good tests
- Stories about poorly written tests
- Problem: new features get priority over testing
- Good tests with good coverage speeds up development!
- I always write tests before refactoring because you can go wild and know that all you have to do is get the tests to pass in the end
- Good tests give confidence: you can write new features/code a lot more quickly because you don’t have to think about breaking things, if somethings breaks you’ll know and you can fix it
- Infrastructure investment: it’s like investing in better roads and transportation networks, it has an upfront cost but you can move people and goods faster and more efficiently afterwards
- Solution: new features priority over testing
- Estimates include testing
- Don’t demo until you have tests if demoing puts on pressure to finish before you wrote tests
- What to test? / Testing priorities?
- Integration first (ensures things actually work for the end-user)
- Then unit
- What is Cypress used for?
- Integration Tests
- Unit Tests
- What makes Cypress best suitable for the task?
- Fast
- Consistent
- Screenshots, videos, logs
- Network request spies, spoofing
- CI Integration
- Dashboard
- What I don’t like about Cypress:
- Async API
- Maybe necessary for this because of JS?
- Async API
- Successfully Maintaining Tests?
- When to write tests?
- Cypress tips & tricks
- Custom commands
- Capturing values
- Example: capture a numeric value, do test, check that the new value is correct based on old one