从零到工程化：用 GitHub Actions 高效集成 Playwright 测试

在现代软件开发流程中，自动化测试的真正价值往往需要通过与CI/CD流水线的集成才能发挥。因为只有当测试成为每次代码提交的"守门员"，自动执行并快速反馈时，它才真正发挥了作用。GitHub Actions 作为与代码仓库原生集成的CI/CD工具，凭借其简洁的YAML配置、丰富的生态市场和强大的并行处理能力，已经成为无数开发团队的首选。

本文章会带你完成如何通过Github Action去运行你的Playwright测试，并且完成并发测试和上传报告，最终打造一个高效的现代化CI测试体系。

---

实战演练：Playwright 与 GitHub Actions 集成

废话不多说，那我们就开始了。我们的最终目标是实现：在每次代码提交或发起 Pull Request (PR) 时自动触发并发测试，并将Allure测试报告作为构建产物供团队随时下载。

Step1 初始化测试框架和测试脚本

在这篇文章中，我选择使用 Node.js 版本的 Playwright 进行演示。当然，如果你更熟悉 Python，同样可以选择 Playwright的Python 版本。

首先，通过以下命令可以初始化Nodejs的Playwright测试框架:

npm install --save-dev @playwright/test # Playwright install
npm init playwright@latest

npm init playwright@latest命令运行后会引导我们搭建一个测试框架的脚手架

Step2 让测试在 Actions 上跑起来

要在GitHub Actions中实现自动运行测试，我们需要完成以下几个步骤：

1. 在 .github/workflows/ 目录下创建一个 playwright.yml 工作流文件。
2. 使用 on 关键字定义触发时机（例如 push 和 pull_request 事件）。
3. 设置一个 job，让它在 GitHub 托管的 Runner 上运行。
4. 在 job 的步骤中调用 Playwright 命令来执行测试。

以下是基础的Workflow代码示例：

name: Playwright Tests
on:
  push:
    branches: [ main, master ]
  pull_request:
    branches: [ main, master ]
jobs:
  test:
    timeout-minutes: 60
    runs-on: ubuntu-latest
    steps:
    - name: Checkout repository
      uses: actions/checkout@v4

    - name: Set up Node.js
      uses: actions/setup-node@v4
      with:
        node-version: '20'

    - name: Install dependencies
      run: npm install
    
    - name: Install Playwright browsers
      run: npx playwright install --with-deps

    - name: Run Playwright tests
      run: npx playwright test
     
    - uses: actions/upload-artifact@v4
      if: ${{ !cancelled() }}
      with:
        name: playwright-report
        path: playwright-report/
        retention-days: 30

提交后, 运行Job生成了测试报告！

Step3 并发测试

在上一步中我们只是把测试跑起来了。但随着项目规模的增长，自动化测试用例的数量也会快速增加。如果每次代码合并都需要运行几十分钟甚至更久，不仅会延迟部署，还会严重影响开发团队的工作效率。

因此，我们需要引入并发测试！

说到并发，大家第一反应可能是："直接在命令里加个 --workers=8 把进程数拉满不就行了？"其实不然。这里有必要先简单了解一下 Playwright 底层的运行机制，这样大家就明白原因了。

Playwright的并发采用基于worker的设计,默认情况下每组测试会在一个独立的worker进程中运行，Playwright会根据机器的CPU核心数来自动分配默认的worker数量

所以这里有个坑！GitHub Actions 默认使用的ubuntu-latest Runner只提供 2个vCPU 。这就意味着，如果你直接在这里要求 Playwright 启动 8 个并发进程，就会出现 CPU 资源不足，进程之间不断争抢，最终导致执行时间不降反升。

解决方案：矩阵 + 分片（Matrix + Sharding）

在Github Action中实现大规模并行测试，正确思路是是用多个机器，每个机器只跑一部分测试。这就需要结合 Playwright 的分片功能和GitHub Actions的矩阵策略来实现。

第一步：修改 playwright.config.ts

首先，我们需要调整 Playwright 的配置，确保在 CI 环境下不要启动过多的 worker，并开启全量并行模式：

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

export default defineConfig({
  testDir: './tests',
  timeout: 60000,
  retries: 2,
  fullyParallel: true,
  reporter: [['html', { outputFolder: 'playwright-report' }]],
  workers: process.env.CI ? 2 : 4, // 本地可以4个进程或根据电脑配置情况
  // 确保 fullyParallel 为 true，以允许文件级的并行
  fullyParallel: true,
});

第二步：修改 GitHub Workflow 配置

接下来，在之前 Step 2 中创建的Workflow文件中，我们通过添加 strategy: matrix 来启动多个并行的 Job，并在执行命令时传入--shard参数，把测试任务平均分配给这些机器：

jobs:
  test:
    runs-on: ubuntu-latest
    strategy:
      # fail-fast 设为 false：当其中一个分片失败时，不要立刻取消其他正在运行的分片
      fail-fast: false
      # 启动 4 个并行的 job 矩阵
      matrix:
        shardIndex: [1, 2, 3, 4]
        shardTotal: [4]

    steps:
    # ... (前置的 Checkout 代码、安装 Node.js 和依赖等步骤保持不变)

    - name: Run Playwright tests
      # 根据矩阵变量动态执行分片测试
      run: npx playwright test --shard=${{ matrix.shardIndex }}/${{ matrix.shardTotal }}

提交代码后，你可以在 GitHub Actions 控制台看到，测试被分发到了4个并行的 Job 中同时运行，测试效率得到了成倍的提升！

Step4 合并测试报告

在完成了分布式的运行后，接着又出现了一个问题。每个 job 都会各自生成一份报告，报告就会很零散。解决方法也很简单, 在所有的测试运行完成后进行合并。具体配置步骤如下

1. 安装与配置Allure

首先，我们需要在项目中安装 allure-playwright和 allure-commandline

npm install --save-dev allure-playwright
npm install --save-dev allure-commandline

然后在 playwright.config.ts里加上reporter配置：

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

export default defineConfig({
  reporter: [
    ['list'],  // 控制台输出
    ['allure-playwright'], // 生成 allure 结果文件
  ],
});

2. 在并发 Job 中上传分片结果

在之前写好的并发Job的最后，我们需要添加一个步骤，将每个分片生成的 allure-results 目录作为 Artifact 上传保存，注意要用 matrix.shardIndex 动态命名以防覆盖：

- name: Upload allure-results
  uses: actions/upload-artifact@v4
  with:
    name: allure-results-${{ matrix.shardIndex }}
    path: allure-results

在所有分片测试完成后，我们需要新增一个独立的 merge-reports Job。它的核心任务是：下载所有分片数据 ➡️ 解压归集 ➡️ 使用 Allure CLI 完成合并 ➡️ 上传最终产物。

merge-reports:
  runs-on: ubuntu-latest
  needs: test
  steps:
    - uses: actions/download-artifact@v4
      with:
        path: ./allure-results
        # 下载所有 shard 的 allure-results，存放到同一目录下

    # 解压所有分片结果（每个 artifact 默认会打包成 zip）
		- name: Extract all allure-results
		  run: |
		    mkdir -p merged-results
		    for d in ./allure-results/*; do
		      echo "Looking into $d"
		      zipfile=$(find "$d" -name "*.zip")
		      echo "Extracting $zipfile"
		      unzip -q "$zipfile" -d merged-results
		    done

    - name: Set up Node.js
      uses: actions/setup-node@v4
      with:
        node-version: '20'

    - name: Install Allure CLI
      run: npm install -g allure-commandline

    - name: Generate Allure report
      run: npx allure generate ./merged-results --clean -o ./allure-report

    - name: Upload Allure report
      uses: actions/upload-artifact@v4
      with:
        name: allure-report
        path: ./allure-report

执行完成后，Github Action会生成一个最终的allure-report目录，并作为artifact上传，你就可以直接下载并查看完整的合并报告。

---

总结

通过本文的实战演练，我们完成了一个完整的现代化测试流水线，具体包括以下内容：

1. 基础集成：让测试在 GitHub Actions 中自动运行；
2. 并发优化：利用矩阵 + 分片实现并行测试，提升运行效率；
3. 结果合并：借助 Allure 报告实现分布式结果的合并。

完整项目请访问
https://github.com/bridgeshi85/playwright-github-action-demo