Automation Testing Web Apps with Cypress
summary
Hands-on setup and demo of Cypress for JavaScript web apps showing npm install, Cypress open vs cypress run, and using cy.visit, cy.type, cy.get, cy.intercept and cy.request to stub APIs and reset backend state. A todo app test suite is built with a page object that adds, edits, toggles and removes items; tests assert focus, input clearing and DOM visibility and rely on Cypress’s command/execution separation for flake resistance. Demos include intentional failures and fixes so the workflow actually works.
AI-written summary · about
chapters (26)
- 0:00Introduction
- 1:33Takeaways
- 2:55Purpose
- 5:15Command Execution Separation
- 6:49Run Cypress
- 8:35Inspect
- 12:20Mocha
- 13:36Question
- 15:30Demo
- 15:49Page Objects
- 16:38Implementation vs Behavior
- 17:23Behaviors
- 18:28Intercept
- 21:50Focus
- 24:48FocusOne
- 25:25Dawn
- 25:51Clear it
- 27:15Add object
- 28:09Checkbox
- 28:59Unchecked
- 31:30Test Process
- 32:25Edit Items
- 33:53Edit Mode
- 35:27Escape Key
- 39:56Blur
- 40:51Multiple Tests
related talks
47mEnd to End Testing with Cypress
42mStrategy for Automation Testing Using Cypress.io
23mGaining Confidence with Cypress Tests
50mShip Web Apps Confidently: End-to-End Testing with Cypress
29mAutomated Testing for the Modern Web
23mGaining Confidence with Cypress Tests
32mGaining Confidence with Cypress Tests
39mGaining Confidence with Cypress Tests