Complete Course

Cypress Interception

Take full control of the network with cy.intercept(): wait for requests, mock responses, and simulate errors and delays to make an existing suite fast, robust, and reliable.

~3 hours of content

Start Course View Lessons

Course Content

9 comprehensive lessons covering everything you need to know

Introduction

Course Structure

Learn how the course is organized and make the most of the content.

Introduction

Prerequisites

Systems and knowledge required to complete the course.

Introduction

Getting to know the application under test

Meet the Hacker Stories app and the existing test suite you will refactor.

Lesson

Lesson 1

Project Clone

Clone the existing project and set up Cypress to get started.

Controlling the network

Lesson

Lesson 2

Waiting for network requests

Use cy.intercept(), .as(), and cy.wait() to test like a real user.

Lesson

Lesson 3

Simulating server and network errors

Stub error responses and force network failures with cy.intercept().

Lesson

Lesson 4

Mocking API responses with fixtures

Isolate the frontend from the backend by mocking responses.

Lesson

Lesson 5

Simulating a slow request

Add a delay to reliably test intermediate loading states.

Robust, readable tests

Lesson

Lesson 6

Adding assertions to stabilize tests

When Cypress's retriability is enough, and when a targeted assertion adds real stability or coverage.

Lesson

Lesson 7

Scoping element selection with .within() and .find()

Two ways to scope element selection - .within() and .find() - for more specific, readable tests.

Lesson

Lesson 8

Reading the browser's localStorage

Assert values stored in localStorage using built-in Cypress commands.

Tooling

Lesson

Lesson 9

Customizing the test reporter

Change the default terminal report using a Mocha reporter.

Bonus & Conclusion

Bonus

One last challenge

Apply what you learned to test that a cached search works.

Bonus

Content from Talking About Testing

Explore additional Cypress content from Talking About Testing.

Conclusion

Congratulations!

You've completed the Cypress Interception course!