在带GUI的Docker Ubuntu容器中运行Playwright有头测试无浏览器显示求助

问题描述 #

我尝试在带GUI的Docker Ubuntu容器中运行Playwright有头测试，为此创建了集成GUI与VNC的Docker镜像，以便通过VNC查看测试过程。

Dockerfile内容 #

# Pull base image.
FROM ubuntu

RUN apt-get update

# Install LXDE and VNC server.
RUN apt-get install -y xvfb
RUN DEBIAN_FRONTEND=noninteractive apt-get install -y lxde-core lxterminal tightvncserver
RUN apt-get install -y xfce4
RUN rm -rf /var/lib/apt/lists/*
RUN touch /root/.Xresources
COPY xstartup /root/.vnc/xstartup
RUN chmod +x /root/.vnc/xstartup

# Define working directory.
WORKDIR /data

COPY * /data

# Install Playwright dependencies
RUN npm install
# # # Install dependencies.
RUN npx @playwright/test install


# Expose ports.
EXPOSE 5901

容器启动命令 #

docker run -it --rm -v /data:/data -p 5901:5901 -e USER=root ubuntudsktp  bash -c "vncserver :1 -geometry 1280x800 -depth 24 && tail -F /root/.vnc/*.log"

能成功通过VNC登录容器，但执行命令xvfb-run npx playwright test test.spec.js --headed时，测试虽执行成功，但VNC会话中并未打开浏览器窗口。请问遗漏了什么配置？如何让测试时的浏览器窗口在VNC会话中显示？

解决步骤 #

1. 移除xvfb-run，指定VNC的DISPLAY环境变量 #

你当前用xvfb-run会让Playwright在独立的虚拟显示器运行，而非VNC已经启动的:1显示器。直接执行以下命令即可让浏览器显示在VNC会话中：

DISPLAY=:1 npx playwright test test.spec.js --headed

2. 验证xstartup配置 #

确保/root/.vnc/xstartup正确启动桌面环境，推荐替换为以下内容（适配xfce4）：

#!/bin/sh
unset SESSION_MANAGER
unset DBUS_SESSION_BUS_ADDRESS
startxfce4 &

修改后重新构建镜像，保证VNC会话能正常渲染GUI应用。

3. 补全Playwright浏览器系统依赖 #

执行以下命令安装浏览器运行所需的系统库，避免因依赖缺失导致浏览器无法显示：

npx playwright install-deps

可以把这条命令添加到Dockerfile的Playwright安装步骤后，确保镜像构建时就完成依赖安装。

4. 优化容器启动命令（可选） #

在Dockerfile末尾添加CMD指令，简化容器启动流程：

CMD ["bash", "-c", "vncserver :1 -geometry 1280x800 -depth 24 && tail -F /root/.vnc/*.log"]

之后启动容器只需执行：

docker run -it --rm -v /data:/data -p 5901:5901 -e USER=root ubuntudsktp

内容的提问来源于stack exchange，提问作者Itzik.B