wait-on failure ECONNREFUSED to localhost with Angular and Node.js 18

[MikeMcC399]

This duplicates the report in #634 (comment) and adds steps to reproduce.

Problem description

When the wait-on parameter of cypress-io/github-action is used to wait for the availability of an Angular server in a Node.js 18 environment on a GitHub ubuntu-22.04 runner, the wait times out and the following is shown in the logs:

Error: connect ECONNREFUSED 127.0.0.1:4200

This is a regression from Node.js 16.

Steps to reproduce

Create app

Follow the steps in Angular: Setting up the local environment and workspace to create a standard Angular 15 project.

Execute:

npm install -g @angular/cli
ng new angular-test

Accept defaults.

Set up Cypress

cd angular-test
npm install cypress@latest -D
npx cypress open

Select E2E Testing > Continue > Chrome > Start E2E Testing in Chrome
Create new spec > Create spec > Okay, run the spec

Edit
cypress/e2e/spec.cy.ts and replace https://example.cypress.io by http://localhost:4200/ so that the test spec line reads:

    cy.visit('http://localhost:4200')

Execute:

npm start

The following is shown:

** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **

In a separate terminal window execute:

npx cypress run

and confirm that the Cypress test completes successfully.

Add GitHub workflow

Create the file .github/workflows/cypress-test.yml with the following content:

name: cypress-test
on:
  workflow_dispatch:

jobs:

  start:
    runs-on: ubuntu-22.04
    strategy:
      matrix:
        node: [16, 18]
    name: Angular E2E test on Node.js ${{ matrix.node }}
    steps:
      - uses: actions/setup-node@v3
        with:
          node-version: ${{ matrix.node }}
      - name: Checkout
        uses: actions/checkout@v3

      - name: Cypress tests
        uses: cypress-io/github-action@v5
        with:
          start: npm start
          wait-on: 'http://localhost:4200'
          browser: chrome

Run on GitHub

Commit the above to a GitHub repository and run .github/workflows/cypress-test.yml.

Note that the job runs successfully under Node.js 16 and fails under Node.js 18

Under Node.js 18 the following is seen in the log file:

** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **


✔ Compiled successfully.
http://localhost:4200 timed out on retry 91 of 3, elapsed 90286ms, limit 90000ms
Error: connect ECONNREFUSED 127.0.0.1:4200

Expected behavior

wait-on should correctly wait for an Angular server (ng serve) on Node.js 18 to allow Cypress testing to proceed when the server is available.

Workarounds

Use npm wait-on package

Use the npm package wait-on to wait for the Angular server ng serve to come online.

Execute:

npm install wait-on

and replace

wait-on: 'http://localhost:4200'

with a 60 second wait for the server using wait-on

wait-on: 'npx wait-on --timeout 60000 http://localhost:4200'

See README: Wait-on.

Use alternate server

Add an alternate http server to the configuration to replace ng serve. (npm install your-favorite-http-server and add start-alternate script to package.json)

npm run build causes ng build to be executed
npm run start-alternate starts the alternate http-server

      - name: Cypress tests
        uses: cypress-io/github-action@v5
        with:
          build: npm run build
          start: npm run start-alternate
          wait-on: 'http://localhost:4200'
          browser: chrome

serve is an example of an http server which works in the above test for both Node.js 16 and Node.js 18.

IPv6 localhost address

Replace http://localhost:4200 by http://ip6-localhost:4200 in wait-on under Node.js 18

See also #634 (comment) from @mraible.

[MikeMcC399]

I updated the workaround section above to include the following as an alternative way to wait for the Angular server to become available. This works under ubuntu-22.04 with both Node.js 16 and 18:

wait-on: 'npx wait-on --timeout 60000 http://localhost:4200'

[MikeMcC399]

• I've replaced this issue with the more generic issue wait-on issues with Node.js 18 #811. This concentrates more on issues and workarounds using the built-in wait-on parameter.