Cypress could not verify that this server is running when using Docker and Docker Compose

Question

I currently have three docker containers running:

1. Docker container for the front-end web app (exposed on port 8080)
2. Docker container for the back-end server (exposed on port 5000)
3. Docker container for my MongoDB database.

All three containers are working perfectly and when I visit http://localhost:8080 , I can interact with my web application with no issues.

I'm trying to set up a fourth Cypress container that will run my end to end tests for my app. Unfortunately, this Cypress container throws the below error, when it attempts to run my Cypress tests:

cypress | Cypress could not verify that this server is running:
cypress |
cypress |   > http://localhost:8080
cypress |
cypress | We are verifying this server because it has been configured as your `baseUrl`.
cypress |
cypress | Cypress automatically waits until your server is accessible before running tests.
cypress |
cypress | We will try connecting to it 3 more times...
cypress | We will try connecting to it 2 more times...
cypress | We will try connecting to it 1 more time...
cypress |
cypress | Cypress failed to verify that your server is running.
cypress |
cypress | Please start this server and then run Cypress again.

First potential issue (which I've fixed)

The first potential issue is described by this SO post , which is that when Cypress starts, my application is not ready to start responding to requests. However, in my Cypress Dockerfile, I'm currently sleeping for 10 seconds before I run my cypress command as shown below. These 10 seconds are more than adequate since I'm able to access my web app from the web browser before the npm run cypress-run-chrome command executes. I understand that the Cypress documentation has some fancier solutions for waiting on http://localhost:8080 but for now, I know for sure that my app is ready for Cypress to start executing tests.

ENTRYPOINT sleep 10; npm run cypress-run-chrome

Second potential issue (which I've fixed)

The second potential issue is described by this SO post , which is that the Docker container's /etc/hosts file does not contain the following line. I've also rectified that issue and it doesn't seem to be the problem.

127.0.0.1 localhost

Does anyone know why my Cypress Docker container can't seem to connect to my web app that I can reach from my web browser on http://localhost:8080 ?

Below is my Dockerfile for my Cypress container

As mentioned by the Cypress documentation about Docker , the cypress/included image already has an existing entrypoint. Since I want to sleep for 10 seconds before running my own Cypress command specified in my package.json file, I've overridden ENTRYPOINT in my Dockerfile as shown below.

FROM cypress/included:3.4.1

COPY hosts /etc/

WORKDIR /e2e

COPY package*.json ./

RUN npm install --production

COPY . .

ENTRYPOINT sleep 10; npm run cypress-run-chrome

Below is the command within my package.json file that corresponds to npm run cypress-run-chrome .

"cypress-run-chrome": "NODE_ENV=test $(npm bin)/cypress run --config video=false --browser chrome",

Below is my docker-compose.yml file that coordinates all 4 containers.

version: '3'
services:
    web:
        build:
            context: .
            dockerfile: ./docker/web/Dockerfile
        container_name: web
        restart: unless-stopped
        ports:
            - "8080:8080"
        volumes:
            - .:/home/node/app
            - node_modules:/home/node/app/node_modules
        depends_on:
            - server
        environment:
            - NODE_ENV=testing
        networks:
            - app-network

    db:
        build:
            context: .
            dockerfile: ./docker/db/Dockerfile
        container_name: db
        restart: unless-stopped
        volumes:     
            - dbdata:/data/db
        ports:
            - "27017:27017"
        networks:
            - app-network

    server:
        build:
            context: .
            dockerfile: ./docker/server/Dockerfile
        container_name: server
        restart: unless-stopped
        ports:
            - "5000:5000"
        volumes:
            - .:/home/node/app
            - node_modules:/home/node/app/node_modules
        networks:
            - app-network
        depends_on:
            - db
        command: ./wait-for.sh db:27017 -- nodemon -L server.js

    cypress:
        build:
            context: .
            dockerfile: Dockerfile
        container_name: cypress
        restart: unless-stopped
        volumes:
            - .:/e2e
        depends_on:
            - web
        networks:
            - app-network

networks:
    app-network:
        driver: bridge

volumes:
    dbdata:
    node_modules:

Below is what my hosts file looks like which is copied into the Cypress Docker container.

127.0.0.1   localhost

Below is what my cypress.json file looks like.

{
  "baseUrl": "http://localhost:8080",
  "integrationFolder": "cypress/integration",
  "fileServerFolder": "dist",
  "viewportWidth": 1200,
  "viewportHeight": 1000,
  "chromeWebSecurity": false,
  "projectId": "3orb3g"
}

Answer 1

localhost in Docker is always "this container". Use the names of the service blocks in the docker-compose.yml as hostnames, ie, http://web:8080

(Note that I copied David Maze's answer from the comments)