The request to the route timed out after waiting 5000ms for a response from the server

I am a newcomer to using Cypress and I'm exploring an HTML page for testing purposes. My goal is to test the login authentication and log the body of an XHR. Here's the test code I wrote for this:

describe('Login test', function () {

    it("Test description", () => {
        cy.server();
        cy.visit("login");

        cy.route({
            method: "POST",
            url: '/login'
        }).as("login");

        cy.get('#username')
            .type(Cypress.env('Account'));

        cy.get('#password')
            .type(Cypress.env('Password'));

        cy.get('#login')
            .click();

        cy.wait("@login").then(xhr => {
            cy.log(JSON.stringity(xhr.response.body));
        });

    });
});

However, the test failed with the following error message:

CypressError: Timed out retrying: cy.wait() timed out waiting 5000ms for the 1st request to the route: 'route_login'. No request ever occurred.

Can anyone offer assistance, please?

Answer №1

Give this a shot:

describe('Login test', function () {

it("Check out this description", () => {
    cy.server();


    cy.route({
        method: "POST",
        url: '/login'
    }).as("login");

    cy.wait("@login", {timeout: 15000});

    cy.visit("login");

    cy.get('#username')
        .type(Cypress.env('Account'));

    cy.get('#password')
        .type(Cypress.env('Password'));

    cy.get('#login')
        .click();

    cy.get("@login").then(xhr => {
        cy.log(JSON.stringity(xhr.response.body));
    });

});

});

Answer №2

cy.route and cy.server are both considered outdated and should be avoided. Instead, a combination of cy.intercept and cy.wait is recommended.

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

Is it possible to move the res.send() outside of the function in node.js?

I currently have the following code: var server = http.createServer(function(req,res){ res.writeHead(200,{'Content-Type': 'text/html; charset=utf-8'}); var oo = require('/test.js'); oo(connection, function (e, res ...

Access information from Google Sheets through an AJAX GET request

I am facing an issue with my code while trying to retrieve data from a Google spreadsheet that I have already published. I have set the share properties of the spreadsheet to 'anyone can edit' and provided the correct URL, but I am still encounte ...

Encountering an issue while constructing an Angular library project. The 'ng serve' command runs smoothly on local environment, but an error message stating

I recently developed an npm package called Cloudee. While it functions perfectly locally, I encounter an issue when attempting to deploy it. The error message states: 'Unexpected value 'CloudyModule in /home/hadi/dev/rickithadi/node_modules/cloud ...

Issues with Ionic's $state.go and ui-sref functions not functioning as expected in the app

While attempting to change the view on the Ionic View app for iOS (I have not tested on the Android app), I encountered a bug that seems to have a solution, but unfortunately, it does not work for me. Bug info: Bug info 2: My Ionic information is as fol ...

JavaScript interval setting multiples

In my current situation, I have implemented a setInterval based code that continuously checks the value of an AJAX call response. Here is how it looks: var processInterval = setInterval(function () { var processResult = getVideoStatus(data.file_name) ...

How can ternary conditional operators be transformed into if statements?

When dealing with minified code like this, f&&!f.error?k.button.b==k.button.c.G?k.button.Q(b,e,f,c,d):k.button.b==k.button.c.o&&k.button.P(b,e,f,c,d):(console.error(f),f=f.error.message||chrome.i18n.getMessage("error_tooltip"),k.button.v(b ...

What exactly does the question mark represent in the code structure as indicated in VSCode?

When looking at the image, you can see that in the description of done(), VSCode indicates the type of parameters using a colon error: any or sometimes with a question mark and colon user?: any. So, what exactly is the distinction between these two ways o ...

What's the reason behind the refusal of my connection to localhost at port 3000 in Node.JS?

As a student venturing into the world of back-end development for the first time, I decided to dive into learning Node.JS. To kick things off, I downloaded a PDF book titled "Jumpstart Node.JS" from SitePoint. Following the provided instructions, I attempt ...

Troubleshooting a CORS problem with connecting an Angular application to a Node server that is accessing the Spotify

I am currently working on setting up an authentication flow using the Spotify API. In this setup, my Angular application is making calls to my Node server which is running on localhost:3000. export class SpotifyService { private apiRoot = 'http://lo ...

Managing empty props in React applications

I am facing an issue where I need to display an image fetched from an API on app start, but when I try to render it in React, the application crashes with the error message: TypeError: Cannot read property 'icon' of undefined. Although the icon ...

Creating a collapsing drop down menu with CSS

I utilized a code snippet that I found on the following website: Modifications were made to the code as shown below: <div class="col-md-12"> ... </div> However, after rearranging the form tag, the drop-down menu collapse ...

What is the best method for combining this function?

Currently, I am working on a code snippet that generates a sitemap.xml file when the /sitemap.xml endpoint is accessed. database = firebase.database(); var ref = database.ref('urls'); ref.on('value', gotData, errData); fu ...

Show only half of the Google Charts

I have a code snippet that displays a chart with dimensions of 500x500. However, I only want to show half of the chart, like 500x250. But whenever I adjust the values in the div, it resizes the entire chart instead of just showing half. My goal is to hide ...

Is NextJS Route Handler in Version 13 Really Secure?

Within my forthcoming NextJS 13 web application, I am in the process of integrating an API through route handlers to facilitate functions like user registration and login procedures. Is it considered safe when transmitting sensitive data like a user's ...

The redesigned pie chart animations in d3 are experiencing glitches

Previously, I had a pie chart with fantastic animations. You can view it here: https://jsfiddle.net/tk5xog0g/29/ I tried to rebuild the chart and improve it based on my needs, but the animations no longer work as intended. I suspect this might be due to ...

Issue: The object is unable to be executed as a function, resulting in the failure to return an array

Currently, I am extracting table values from the UI row by row. This involves clicking on each row and retrieving the corresponding data. exports.getTableData = function(callback){     var uiArray =[];     var count;         aLib.loadCheck(c ...

An Ajax call nested within another Ajax call

I've implemented an AJAX request to load my "home" page and "about" page into a designated "container" when a menu link button is clicked on my index.php. Now, I have three links on my "home" page and I want each of these links to open within the same ...

Ensure that test cases in Angular2 include a line that covers conditions for returning values

I'm having trouble implementing test coverage for an online platform, as I'm not sure how to approach it. Within my service method, I have the following code: public getResults() { return this.http(url,body).map(this.mapResponse); } private ...

Deactivate a span in real-time using ng-model

I found a helpful guide on creating a custom editable <span> using ngModelController here: https://docs.angularjs.org/api/ng/type/ngModel.NgModelController#example Now, I am looking to implement a feature that allows me to dynamically disable editin ...

Validation of object with incorrect child fields using Typeguard

This code snippet validates the 'Discharge' object by checking if it contains the correct children fields. interface DischargeEntry { date: string; criteria: string; } const isDischargeEntry = (discharge:unknown): discharge is DischargeEntry ...