如何在GitHub Actions中运行针对localhost的Playwright测试？

问题根源 #

你当前的工作流把服务器启动和测试分成两个独立步骤，用&把服务器放后台，但GitHub Actions的每个步骤运行在单独的shell会话里，步骤结束后所有后台进程会被强制终止，所以到执行yarn e2e的步骤时，服务器已经不在运行了，这就是测试超时的核心原因。

解决方案1：同一步骤内完成服务器启动、就绪等待和测试 #

可以用wait-on工具先等待服务器完全就绪，再执行测试，确保两个操作在同一个shell会话里：

1. 先添加依赖（本地安装后提交到仓库）：

yarn add -D wait-on

2. 修改工作流步骤为：

- name: Build, start server and run e2e tests
  run: |
    yarn build:e2e
    yarn start:e2e &
    wait-on http://localhost:3000
    yarn e2e

解决方案2：用Playwright内置的webServer配置（更推荐） #

Playwright本身支持自动启动和管理测试服务器，无需手动处理后台进程，步骤更简洁可靠：

1. 修改playwright.config.ts（或对应配置文件），添加webServer配置：

import { defineConfig, devices } from '@playwright/test';

export default defineConfig({
  // 其他配置...
  webServer: {
    command: 'yarn start:e2e',
    url: 'http://localhost:3000',
    timeout: 120 * 1000,
    reuseExistingServer: !process.env.CI, // CI环境每次重新启动
  },
  use: {
    baseURL: 'http://localhost:3000', // 测试里可以直接用相对路径
  },
});

2. 简化工作流，只保留构建和测试步骤：

- name: Build for e2e
  run: yarn build:e2e
- name: Run e2e tests
  run: yarn e2e

这样Playwright会自动启动服务器，等待它就绪后再执行测试，测试完成后也会自动关闭服务器，完美适配GitHub Actions环境。

内容的提问来源于stack exchange，提问作者Dan