How to see fetch history and logs after cypress run - cypress

As a part of my CI pipeline, I am testing my frontend using cypress. I run cypress run to test. One test is failing due to failed fetch request. How can I see detailed information about that fetch? So far I could only see which fetch failed from the video recording and screenshots of the test.

Cypress is built using the debug module. That means you can receive helpful debugging output by running Cypress with this turned on.
DEBUG=cypress:* npx cypress run
In case you want specific detailed Debug Logs, You can write something like:
DEBUG=cypress:network:*,cypress:net-stubbing* npx cypress run
Cypress is built from multiple packages, each responsible for its own logging: server, reporter, driver, command line, etc. Each package writes debug logs under a different source. You can find the list of log sources from here.

Do you know the failed url? If so, intercept it.
cy.intercept('/url', (req) => {
req.on('response', (res) => {
console.log(res)
})
})
You may have difficulty with nested details, if so
console.log(JSON.stringify(res))
or
cy.writeFile('cypress/debug/fetch.json', res))

Related

Why Cypress gives success after second attempt?

In my Cypress tests, I create some data in before block and then my test script is run that locates in it block. I checked business side flow and it seems like there is no error about app side. I just want to understand that why my test's result is success after second attempt. Does Cypress has this kind of solution to handle an error maybe?
Cypress has the ability to automatically retry any failed tests. I would check your Cypress configuration's value for retries.openMode.

Your page did not fire its `load` event within `60000ms` only on Github Actions

I have Cypress tests failing only on Github CI with this error:
Your page did not fire its `load` event within `60000ms`.
I assume this is because the Cypress browser is stuck loading something Github Actions environment is blocking. Tests run fine locally. However, because I do not have access to the browser console, I cannot know what is causing the error.
Based on Cypress the service screenshot the page loaded fine, though.
How can I either
Disable load event check in my Cypress tests, as I assume this is not a real issue
Access JavaScript logs or Network tab logs though Cypress service to confirm what could be the issue in Github Actions run-time environment
This is a SvelteKit based site.
It's not currently possible to opt-out of waiting for the load event: https://github.com/cypress-io/cypress/issues/788

Is there a way to hide all the HTTP request logs from the node terminal output?

When I run a suite of tests using Cypress, I get a TON of HTTP request logs to the terminal output. I think this image best shows the issue. In it, you can see the command I run to start cypress, and that following it comes a long list of every HTTP request made during the tests.
Is there a way to hide them all?
You can add the following to cypress.json:
"morgan": false,
The logs you see are from express (a built-in server within cypress).

Why does running Cypress on a React/GraphQL app return network errors when normal browsing doesn't?

I have a React/apollo client and an apollo/neo4j backend application based on GRANDStack.
My React app runs on localhost:3000 and my GraphQL on localhost:4001/graphql, and they communicate without fail. All is working well in the app (with CORS enabled), but I wanted to implement testing with Cypress.
Should I expect Cypress to be able to observe the flow between React and GraphQL without error? Or is this beyond its capability?
What I've tried:
I set up Cypress and ran the following test:
it("Opens myPlan.", function() {
cy.visit("localhost:3000/myPlan");
cy.wait(6000);
});
At first cypress setup, my site loaded. One of the first things that the app does is graphql query a few values, and create a dropdown box based on those values. While this and all other graphql requests work fine in the browser, I get "{"graphQLErrors":[],"networkError":{"name":"ServerParseError","response":{},"statusCode":404,"bodyText":""},"message":"Network error: Unexpected end of JSON input"}" errors in cypress for the same code.
Presumably, the problem was because there are 2 endpoints, and cy.visit only allows one. I tried disabled ChromeWebSecurity and tried an "Access-Control-Allow-Origin-master" plugin.
Edit: I found someone that knew Cypress, and they suggested adding:
"proxy": "http://localhost:4001/",
to my react client config. This avoids the multi-port issues, and Cypress works.
Edit: I found someone that knew Cypress, and they suggested adding:
"proxy": "http://localhost:4001/",
to my react client config. This avoids the multi-port issues, and Cypress works.

How can I prevent tests execution in beforeAll block in jasmine?

Before all my tests (running in jasmine under protractor) I have to login to my system and if login fails I should not run any test. But even when I use proccess.exit (which is node feature to halt program execution), tests are still executed and all failed .
beforeAll(function(done){
mainPage.resize();
loginPage.login(env.regularUser).then(function(){
mainPage.navigate();
mainPage.waitLoading();
done();
}, function(){
process.exit(1);
});
});
How can I prevent tests execution in beforeAll block?
If I understand correctly, this is the same or a related problem to:
Does jasmine-node offer any type of "fail fast" option?
Feature Request - fail-fast option
Bail on first failure
--fail-fast CLI option
Quitting on first failure
In other words, this is something a testing framework (in this case jasmine) should have. At the moment, this is an open feature request.
As a current workaround, use jasmine-bail-fast third-party package.

Resources