Cypress fails to log requests in the Command Log

I'm having trouble intercepting requests to the Backend using Cypress. Strangely, I can't see some of the XHR requests in the DevTools, even though they are there. To help illustrate the issue, I've included a screenshot with arrows. https://i.sstatic.net/dLHlP.png

Unfortunately, I can't share my project on a public repository, but perhaps you can provide some insights based on the test itself. I haven't included any beforeEach blocks, etc.

it('should generate the correct request for password change', () => {
cy.visit(`/courses/reset-password?token=${token}&userId=${userId}`);
cy.server();
cy.route('POST', '/auth/local/reset-password').as('resetRequest');
cy.get('#password').type(password);
cy.get('#confirmPassword').type(password);
cy.get('button[type="submit"]').click();
console.log('at the end');
cy.wait('@resetRequest').then((request) => {
  // I never reach this point
  console.log('fff', request);
  console.log('requestBody', request.requestBody);
  expect(request.body.newPassword).to.eq(password);
  expect(request.body.token).to.eq(token);
  expect(request.body.userId).to.eq(userId);
});

});

If you have any insights or suggestions, please feel free to share them with me :)

Answer №1

If you want to utilize cy.server() and cy.route() for fetch requests, follow the instructions provided in this link:

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Updating the URL in React and Redux

I am currently working on developing an application using React and Redux (DVA) with Ant.Design as the main framework. I am facing an issue where I need to change the URL when a user clicks on a button, and connect that URL change to a specific action so t ...

Having trouble getting my subarrays to push correctly into the parent array in ReactJS. What am I doing wrong

I am currently working on implementing the bubblesort algorithm using ReactJS. My state includes an array of 3 objects initially sorted in descending order by the 'num' property. I have a button on my interface that triggers the bubblesort functi ...

Tips for implementing the data.map function in Reactjs

I am currently exploring Reactjs with nextjs, and I am facing an issue with fetching data using the "map" function. Can anyone provide guidance on how to approach this? Below is my current code snippet: import { useEffect, useState } from "react" export ...

Having trouble with your UI Router states not updating correctly when changing the URL in your Angular UI Router?

I have tried numerous solutions and tutorials already with no success in finding the right answer. Therefore, I am posting here in hopes of receiving a fresh perspective and a little challenge. Using: angular ui router The Issue I have set up differen ...

Retrieve data from multiple JSON tables using a JavaScript loop

Check out this Codepen for a working example. I am relatively new to Javascript, so I may not be approaching this problem the best way. If you have any suggestions on how I could improve my approach, I would greatly appreciate it; always looking to learn ...

Tips for incorporating routes in Polka.js in a way that resembles the functionality of express.Route()

One of the challenges I am facing is trying to import route logic from another file in my project. While using Express.js, this could be done easily with express.Route(). However, when attempting polka.Route(), an error occurs stating that Route doesn&apos ...

Why is the jQuery change event only firing when the page loads?

I am experiencing an issue with a .js file. The change event is only triggering when the page loads, rather than when the selection changes as expected. $(document).ready(function(){ $("#dropdown").on("change keyup", colorizeSelect()).change(); }); f ...

Is it possible to include a local directory as a dependency in the package.json file

As I work on developing an npm package alongside its application, I find myself constantly making small changes to the package. Each time I make a change, I want to run the application again for testing purposes. The package is included as a dependency in ...

Querying Mongoose Nested Data in Express: A Comprehensive Guide

I need to retrieve the "stocked" boolean value for item "4" belonging to user "456" from my mongoose data collection. However, when I try to query for this specific information, I end up receiving the entire user object instead. Data: data = [{ use ...

Issue with distinguishing JavaScript code from an SVG file

Seeking assistance as I have an SVG file that is mostly composed of a script. My goal is to separate the script for compression purposes, but I am struggling to find a way to achieve this. Any guidance or help on this matter would be greatly appreciated. ...

Tips for implementing lazy loading with an owl carousel featuring background images

Is there a way to add lazy loading to a semi custom owl carousel that uses background images instead of regular img tags? I've tried using Owl carousel's function for lazy loading but it doesn't seem to work. How can I achieve this? This is ...

What is the best way to retrieve the latest state after applying useEffect to trigger an onChange event for an element?

I am encountering an issue with an input field in my component that requires an onChange event to update the state. Despite binding the onChange event on mounting the component, the state remains unchanged as the onChange event seems to have the initial st ...

Private route displaying unexpected behavior when making API call

A snippet of code I have been working on is partially functioning (refer to the last paragraph for a detailed description): App.Js: export default function App() { const [isLoggedIn, setisLoggedIn] = useState(null); const logIn = () => { setisLogg ...

The function $(this).addClass() seems to be malfunctioning

While trying to follow a tutorial, I noticed that the style sheet isn't being applied to the clicked element in the list. What could be causing this issue? In the example provided, when a string is added to the text box and the button is clicked, a n ...

The datepicker is refusing to update the date format

I've been attempting to adjust the date format for my datepicker, but it refuses to change. Below is the code I'm using: $(document).ready(function() { $('#dateselect').datepicker({ format: 'dd/mm/yyyy', o ...

Is it possible to animate multiple SVGs on a webpage with just the click of a button?

Is there a way to trigger the animation in the SVG each time a next/prev button is clicked while navigating through a carousel where the same SVG is repeated multiple times? The carousel is built using PHP and a while loop. jQuery(document).ready(function ...

Transforming a jQuery menu into an active selection with Vue JS

I am looking to transition away from using jQuery and instead utilize Vue for the front end of a menu. Specifically, I need to add an active class and a 'menu-open' state to the appropriate nested list items, similar to what is achieved in the pr ...

Discovering the quantity of arguments passed into a constructor in Node.js

In my Node.js code, I have a constructor that looks like this: function Tree() { //Redirect to other functions depending on the number of arguments passed. } I then created instances of objects like so: var theTree = new Tree('Redwood'); var ...

Can you explain the process of utilizing Angular databinding to display nested information?

I'm facing a challenge with databinding when working with nested arrays in multiple timeslots and windows. Despite understanding the basics, I can't seem to make it work no matter how I try different approaches. It's really frustrating not k ...

Activate the saturation toggle when a key is pressed in JavaScript

I am trying to modify a script that currently toggles the value of a variable when a key is pressed and then lifted. Instead of changing the variable value, I would like to adjust the saturation of the screen based on key presses and releases. How can I ac ...