Run Cypress interactive GUI on host, but run tests in Docker container

[Splines]

Hey there 🙌, thank you for your efforts providing these ready-made Docker containers, much appreciated.

I've recently seen this guide explaining how to run cypress in a Docker container and transmit the GUI signal of the interactive test runner to an X11 server. This is also covered in this blog post.

I was wondering if it was possible to instead install the Cypress npm package on the host machine, start the GUI there, but have the tests still be run inside the Docker container. This would have the advantage that no X11 server setup is needed and that the Cypress GUI would have the native look and feel of Windows in our case.

[!tip] I've opened a StackOverflow question today regarding this request with more background information
(I found out about your GitHub repo only later).

[MikeMcC399]

@Splines

According to your https://stackoverflow.com/q/78639075/9655481 question it sounds like you are running Docker under Microsoft WSL2 using Ubuntu. Is that correct? Do you have Desktop Docker in use in this case? Could you say which Ubuntu version you are using? Also which type of Cypress Docker image? cypress/base, cypress/browsers or cypress/included?

What system is the X11 server supposed to be running on? Would this be Windows 10 or Windows 11? Is it simply the host machine running WSL2 or is it another machine?

[MikeMcC399]

@Splines

If you are using WSL2 it sounds like you may not have upgraded to WSLg, since in StackOverflow you mention VcXsrv. If this is correct, please check out the Cypress documentation section Windows Subsystem for Linux for information and links to corresponding Microsoft documentation. If it is not already the case, I would recommended upgrading to WSLg.

[MikeMcC399]

Here is a working solution:

Environment:

Windows 11
Docker Desktop: 4.31.1
Ubuntu 22.04.4 LTS in WSL2
WSL version: 2.2.4.0
Kernel version: 5.15.153.1-2
WSLg version: 1.0.61
MSRDC version: 1.2.5326
Direct3D version: 1.611.1-81528511
DXCore version: 10.0.26091.1-240325-1447.ge-release
Windows version: 10.0.22631.3737

In a WSL2 terminal window running Ubuntu 22.04, first test out X11 without Docker:

git clone https://github.com/cypress-io/cypress-docker-images
cd cypress-docker-images/examples/basic
npm ci
npx cypress open

This should open the Cypress GUI Launchpad.

Then with Docker (still in examples/basic)

docker build . -f Dockerfile.base -t test-base 
docker run -it --rm -v /tmp/.X11-unix:/tmp/.X11-unix -v /mnt/wslg:/mnt/wslg -v .:/e2e -w /e2e -e DISPLAY=$DISPLAY -e WAYLAND_DISPLAY=$WAYLAND_DISPLAY -e XDG_RUNTIME_DIR=$XDG_RUNTIME_DIR -e PULSE_SERVER=$PULSE_SERVER --entrypoint bash test-base -c "npx cypress open"

Again, this should open the Cypress GUI Launchpad, this time from Docker.

[Splines]

System specs

• Windows 10
• WSL2
• Ubuntu 22
• cypress/included
• X11 server should run on Windows (in order to show the GUI there)

---

If you are using WSL2 it sounds like you may not have upgraded to WSLg, since in StackOverflow you mention VcXsrv.

Thank you so much for your quick reply and for pointing me to WSLg. It must have passed by me, I've never heard of it before. I've simply executed wsl --update and jumped to WSL version 2.2.4.0. Routing the GUI signal now works out of the box without having to setup an X11 server on your own 🙌. The Docker compose file linked in a Cypress blog post still worked fine (slightly adapted)

# Instructions for interactive mode
# https://www.cypress.io/blog/2019/05/02/run-cypress-with-a-single-docker-command#Interactive-mode
services:
  cypress:
    # https://on.cypress.io/command-line#cypress-open
    entrypoint: cypress open --project ./your/folder/name/
    environment:
      # for X11/Wayland in WSLg
      - DISPLAY
    volumes:
      # for Cypress to communicate with the X11 server pass this socket file
      # in addition to any other mapped volumes
      - /tmp/.X11-unix:/tmp/.X11-unix

While the original question was about having the Cypress interactive GUI run on Windows directly and then somehow let it connect to the Docker container to have it execute the tests there, this solution (where the GUI runs within the Docker container but is forwarded to Windows) works great now and does not involve any additional setup. I will close this now.

[MikeMcC399]

@Splines

Thanks for confirming that your needs are now met! 🎉

The Docker compose file linked in a Cypress blog post still worked fine (slightly adapted)

The blog post from 2019 does contain some useful information. It's no longer linked from other places in the documentation because much of it is outdated, being based on Cypress legacy configurations, and could be confusing. Thanks for sharing your Docker compose file!

While the original question was about having the Cypress interactive GUI run on Windows directly and then somehow let it connect to the Docker container to have it execute the tests there, this solution (where the GUI runs within the Docker container but is forwarded to Windows) works great now and does not involve any additional setup.

Your original request, taken literally, is not supported by the Cypress architecture. The Cypress App needs to run on the same machine as Cypress itself. It's good to hear that the alternative setup is good for you.