Docker refuses to work on my localhost:3000 port

Question

Here is my docker-compose.yml I'm trying to run cypress on my local project and it's refuses to run on the port. What I'm doing wrong?

version: '3.2'
   
# run Cypress tests and exit with command
#   docker-compose up --exit-code-from cypress
services:
  cypress:
    # the Docker image to use from https://github.com/cypress-io/cypress-docker-images
    image: "cypress/included:5.0.0"
    environment:
      - CYPRESS_baseUrl=http://localhost:3000
    # share the current folder as volume to avoid copying
    working_dir: /e2e
     command: "--browser chrome"
     ports:
     - 3333:3000
     volumes:
       - ./:/e2e

Result of the compose-docker:

cypress_1  | 
cypress_1  | Cypress automatically waits until your server is accessible before running tests.
cypress_1  | 
cypress_1  | We will try connecting to it 3 more times...
cypress_1  | We will try connecting to it 2 more times...
cypress_1  | We will try connecting to it 1 more time...
cypress_1  | 
cypress_1  | Cypress failed to verify that your server is running.
cypress_1  | 
cypress_1  | Please start this server and then run Cypress again.
e2e_cypress_1 exited with code 1
Aborting on container exit...

I know for sure that my localhost:3000 is running, I'm able to run it via browser.

Answer 1

The problem is that the container doesn't know you localhost hostname, because it is running inside an isolated docker network. If you want your container to know your local network, you have to Use host networking and the container's network stack is not isolated from the Docker host.EG:

    version: '3.2'
    
    # run Cypress tests and exit with command
    #   docker-compose up --exit-code-from cypress
    services:
      cypress:
        # the Docker image to use from https://github.com/cypress-io/cypress-docker-images
        image: "cypress/included:5.0.0"
        environment:
          - CYPRESS_baseUrl=http://localhost:3000
        # share the current folder as volume to avoid copying
        working_dir: /e2e
        command: "--browser chrome"
        network_mode: "host"
        ports:
        - 3333:3000
        volumes:
          - ./:/e2e

Answer 2

baseUrl can be set in your configuration file (cypress.json by default) - and then you can set an environment variable in your OS to override it like shown below.

Try to using CYPRESS_BASE_URL instead of CYPRESS_baseUrl

And make sure that you using network_mode: "host" in docker-compose file.

Another way, you can define baseUrl in crypess.json and add volume to docker container:

e2e-chrome:
  image: "cypress/included:4.1.0"
  # container_name: cypress
  # "cypress/included" images have entrypoint set to globally installed cypress
  # so the command can simply add any arguments
  command: "--browser chrome"
  volumes:
    - ./cypress.json:/cypress.json

Refer: docker-compose.yml

version: '3.2'

# run Cypress tests and exit with command
#   docker-compose up --exit-code-from cypress
services:
  cypress:
    image: "cypress/included:5.2.0"
    environment:
      - CYPRESS_BASE_URL=http://host.docker.internal:3000
    working_dir: /user-management-ui
    #command: "--browser chrome"
    network_mode: "host"
    volumes:
      - ./:/user-management-ui