egghead.io
illustration for Add e2e tests with cypress to a React application

Course

Add e2e tests with cypress to a React application

  1. 1
    Adding cypress to an existing project in order to start writing e2e tests
    2m 35s
  2. 2
    Write a basic cypress test to ensure that the app is not entirely broken
    1m 51s
  3. 3
    Enable intelligent code completion for cypress tests in VSCode
    44s
  4. 4
    Use data-cy property to select elements in cypress tests to write more resilient e2e tests
    1m 55s
  5. 5
    Add a beforeEach function to cypress tests to avoid copying and pasting needless code
    34s
  6. 6
    Test a search input in an e2e test with cypress
    2m 6s
  7. 7
    Use "Cypress Driven Development" in order to add a feature to a React app
    2m 23s
  8. 8
    Use cypress UI in order to debug an API response
    50s
  9. 9
    Use cy.server() and cy.route() to control API response in a cypress test
    2m 10s
  10. 10
    Use cy.only in order to run only a single test in a cypress test suite
    44s
  11. 11
    Use cy.skip in order to skip a test in a cypress suite
    38s
  12. 12
    Change a viewport width and height in a cypress test
    1m 49s

Use cypress UI in order to debug an API response

Tomasz Łakomy
InstructorTomasz Łakomy
  • cypress
    Cypress

Share this video with your friends

Send Tweet

Most of the time the communication between backend and frontend works seamlessly.

Until it doesn't.

When our e2e tests start to fail because there's an issue with an API response, it's important to know how to debug it.

In this lesson we're going to learn how to get insights about a network request and its response using the cypress UI.

Build your Developer Portfolio and climb the engineering career ladder.
  • Search
  • Talks
  • Podcasts
  • Machine
  • Pricing
  • Store
©egghead.io
Terms & Conditions