Repository for the basic course of visual regression testing with Cypress and Percy, by Walmyr Filho.
Initial setup
Lesson's content
- Git clone - git@github.com:wlsf82/cypress-and-percy-course.git
- Initializing a Node.js project - npm init -y
- Updating the test script - percy exec -- cypress run
- Installation - npm i cypress @percy/cypress -D
- Cypress' files and directories structure - npx cypress open
- Updating the .gitignore file - cypress/screenshots/ and cypress/videos/
- Configuring Percy to work with Cypress - https://docs.percy.io/docs/cypress
- Cypress docs - https://docs.cypress.io/guides/overview/why-cypress.html
- Percy docs - https://docs.percy.io/docs
Lesson's content
- Creating an account on percy.io
- Creating a project
- Exporting the project token
The first test
Lesson's content
- Getting to know the application under test
- Creating the first visual regression test with Cypress & Percy
- Running the first test
- Approving the snapshot on Percy's dashboaard
Testing an invalid email address
Lesson's content
- Writing the test
- Running the test
- Approving the snapshot on percy.io
Testing filling all the mandatory form fields
Lesson's content
- Writing the test
- Running the test
- Approving the snapshot on percy.io
Testing the selection of a VIP ticket
Lesson's content
- Writing the test
- Running the test
- Approving the snapshot on percy.io
Testing dynamic content
Lesson's content
- The problem of dynamic content in visual regression testing
- Testing successfully submitting the form
- Running the test and aproving the snapshot on percy.io
- Re-running the tests and getting a false-negative result
- Dealing with dynamic content - https://docs.percy.io/docs/percy-specific-css
- Re-running the tests and approving the new snapshot on percy.io
- Re-running the tests without false-negative results
Ending
Lesson's content
- Project docs - updating the README.md file
- Learnings summary
- Going beyond - #ReadTheDocs
A course created by Walmyr Filho.