Cypress e2e test can't access app url in GitHub Actions

Question

I am trying to set up an e2e test in my app using Cypress and GitHub Actions. The tests pass in local with no issue but, when I push to GitHub and consequently run the tests, they don't anymore. The database and backend seem to build and run fine but I am not sure about the frontend. Indeed, it seems to work but when the Cypress tests begin, they don't find the "localhost:4200" as they should (they can interact with the database though).

Here's the action log for the first failed test :

Go to the homepage

1. "before each" hook for "should display the homepage"

0 passing (973ms) 1 failing

1. Go to the homepage "before each" hook for "should display the homepage": CypressError: cy.visit() failed trying to load:

http://localhost:4200/

We attempted to make an http request to this URL but the request failed without a response.

We received this error at the network level:

Error: connect ECONNREFUSED 127.0.0.1:4200

Common situations why this would fail: you don't have internet access you forgot to run / boot your web server your web server isn't accessible you have weird network configuration settings on your computer

The test in question :

describe('Go to the homepage', () => {
  beforeEach(() => {
    cy.visit('http://localhost:4200/');
  });
  it('should display the homepage', () => {
    cy.contains('app is running!');
    cy.get('[data-cy=header]');
    cy.get('[data-cy=footer]');
  });
});

And my github workflow file :

name: End-to-end tests

on:
  push:
  pull_request:
    branches: [main, develop]

jobs:
  build-and-test:
    runs-on: ubuntu-latest
    services:
      mssql:
        image: mcr.microsoft.com/mssql/server:2022-latest
        env:
          ACCEPT_EULA: y
          MSSQL_SA_PASSWORD: **********
        ports:
          - "5014:1433"

    steps:
      - name: Checkout
        uses: actions/checkout@v3

      - name: Setup .NET Core
        uses: actions/setup-dotnet@v3
        with:
          dotnet-version: '8.0'

      - name: Install backend dependencies
        run: dotnet restore ./backend/backend.sln

      - name: Install EF Core CLI
        run: dotnet tool install dotnet-ef --global
        shell: bash
        working-directory: ./backend/backend

      - name: Build backend
        run: dotnet build ./backend/backend.sln --configuration Release --no-restore

      - name: Create Migration
        run: dotnet ef migrations add InitialCreate
        working-directory: ./backend/backend

      - name: Apply EF Core Migrations
        run: dotnet ef database update
        env:
          ConnectionString: "Server=localhost,5014;TrustServerCertificate=true;Database=database-1;User=sa;Password=**********"
        working-directory: ./backend/backend

      - name: Start backend
        run: dotnet run --project ./backend/backend/backend.csproj &

      - name: Setup Node.js
        uses: actions/setup-node@v3
        with:
          node-version: '20.x'

      - name: Install frontend dependencies
        run: npm install
        working-directory: ./frontend

      - name: Cypress run
        uses: cypress-io/github-action@v6
        with:
          build: npm run build
          start: npm start
          wait-on: 'http://localhost:4200'
          working-directory: ./frontend`

Do you need to check something else in order to spot the problem ?

Thank you for the time spent on my issue.

I tried to change the urls, write them entirely, change the order of my workflow command, try with and without building the frontend first, I tried to build the front separately from the cypress run...