cypress: localhost URL not accessible after cy.request on server

For me instructing the bundle server (in my case vite) to explicitly use host ‘127.0.0.1’ fixed the issue.

I get this error after upgrading Node from 16 to 18 or 20. I’m not even using cy.request().

A workaround when using Vite is hinted at here: https://vitejs.dev/config/server-options.html#server-host

// vite.config.js
import { defineConfig } from 'vite'
import dns from 'dns'

dns.setDefaultResultOrder('ipv4first')

export default defineConfig({ ...

or set server.host to true but this will allow access to the server over the network

(Adding the code ECONNREFUSED to this thread to make it easier to find)

I’ve created a simple reproduction here. The README explains the bug in detail. My understanding of the bug is:

• Setting host to localhost for the webpack-dev-server (the default value supplied by the nrwl/webpack-dev-server executor) inhibits the use of 127.0.0.1 (ipv4). You can still access the frontend site via localhost or [::1].
• The backend server is listening on 127.0.0.1
• When the cy.request is executed before the cy.visit, the subsequent visit is mapped to 127.0.0.1 rather than ::1. This causes the error as the frontend server will not accept requests from this IP as it is not listening to it.

If you move the request to after the visit, everything works fine. Also, if Cypress is allowed to visit before sending the request (by commenting out the request), adding the request back in works fine. There must be some server state being set from the initial request that influences subsequent visit requests.

Can you try adding "host": "127.0.0.1" to your apps/client/project.json for the serve.options configuration and see if it works? I tried it locally and it worked for me. You can still use localhost for visiting your site locally and telling Cypress how to connect but Webpack needs to be forced to use ipv4 over ipv6 (my understanding of DNS is fuzzy admittedly).

To be explicit, this is the update I made:

"serve": {
  "executor": "@nrwl/webpack:dev-server",
  "defaultConfiguration": "development",
  "options": {
    "buildTarget": "client:build",
    "hmr": true,
    "host": "127.0.0.1" <----
  },

Still investigating if there is an issue on our side. Cypress will warn the user it can’t connect to the provided baseUrl, but in this case there is no warning yet the connection fails when using cy.visit.

Edit: After investigating, it looks like the issue is due to Nx’s use of localhost for the default value of host used in for their webpack-dev-server executor. This use prohibits use of ipv4. Workaround described above should be enough, you can also use 0.0.0.0 to open both ipv4 and ipv6.

@nicolas-marien I was able to reproduce your issue by using Node18. With Node16, the e2e test works fine. There was a DNS change between Node16 and Node18 (issue) that you might be running into. I’ll keep investigating to see where the problem lies and if there is a workaround for you.

We are unable to upgrade to node 18 due to this issue

My workaround for anyone interested (Using angular, but should work for any, imho)

I had a few personal requirements:

• I did not want to change the host property. I want the app to run on localhost, not on 127.0.0.1
• The workaround should not affect performance (total runtime of e2e test) to much (not at all at best)
• should not cause alot of boilerplate
• should not require thrid party tools, any extra effort

go to your support file cypress/support/e2e.ts and add this one line of code: fetch(Cypress.env('baseUrl'), { method: 'GET' }) // fire and forget

I figured, since the cause for the issue is a cy.request() (and it was still an issue, after I replaced my login logic with fetch()), we can just do a fetch before all tests run.

Of course you can use a hardcoded url for this fetch('http://localhost:4200', {method: 'GET'}), but I used mine from the cypress.config.ts

Give me a thumbs up, if it works for you as well. I will report back, If I improve or change anything or if it stop working :C

For me instructing the bundle server (in my case vite) to explicitly use host ‘127.0.0.1’ fixed the issue.

This was solving the issue also on my dev-env. Using v12.9.0

Same issue here I was using node 18.10 and cypress 12.9.0, I downgraded the node version to 16.13.2 and that fixed the issue.