Dynamically Add Queries in Cypress Intercept Function Requests

Filip Hric
InstructorFilip Hric

Share this video with your friends

Send Tweet
Published 3 months ago
Updated 3 months ago

When you don’t want to stub your response or create your data before the test, you can change the request your application makes altogether. If your server recognizes different queries, you can modify your request‘s URL and add a query that will specify what kind of data you want to get.

Instructor: [0:00] When my application opens, the first thing it will do is call this GET /api/boards request. This will load all of the boards and render them out. Each of these boards holds a different attribute. For example, there is a starred attribute, which will be true or false, depending on the state of the board.

[0:22] With .intercept(), I can dynamically change this GET request. To make my .intercept() dynamic, I will make the last argument of my .intercept() command a function, which will take my request as a parameter.

[0:39] I can change different parts of this request. For example, I can choose to change the query and give it an attribute of starred with a value of true so that my /api/boards request will become /api/boards?starred=true. When I save this, my API works in a way that, if I pass this query, it will return just those boards that have the starred attribute set to true.

[1:13] If I were to change it back to false, only the boards that are not starred will get rendered out. One thing to notice is that the value will always be a string, since this object will get parsed as a query string.

Jan Hesters
Jan Hesters
~ 2 months ago

Great course! This video is very quiet though.