跳至主要内容

持续集成

简介​

Playwright测试可以在CI环境中执行。我们为常见的CI提供商创建了示例配置。

在CI上运行测试的3个步骤：

  1. 确保CI代理可以运行浏览器: 在Linux代理中使用我们的Docker镜像或通过CLI安装依赖项。

  2. 安装Playwright:

    # 安装NPM包
    npm ci

    # 安装Playwright浏览器及其依赖
    npx playwright install --with-deps

  3. 运行测试:

    npx playwright test

工作线程​

我们建议在CI环境中将workers设置为"1"，以优先考虑稳定性和可复现性。顺序运行测试可以确保每个测试都能获得完整的系统资源，避免潜在的冲突。不过，如果您拥有强大的自托管CI系统，可以启用parallel并行测试。如需更大规模的并行化，可以考虑sharding分片——将测试分配到多个CI作业中。

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

export default defineConfig({
  // Opt out of parallel tests on CI.
  workers: process.env.CI ? 1 : undefined,
});

CI配置​

命令行工具可用于在CI中安装所有操作系统依赖项。

GitHub Actions​

在推送/拉取请求时​

Tests will run on push or pull request on branches main/master. The workflow will install all dependencies, install Playwright and then run the tests. It will also create the HTML report.

.github/workflows/playwright.yml
name: Playwright Tests
on:
  push:
    branches: [ main, master ]
  pull_request:
    branches: [ main, master ]
jobs:
  test:
    timeout-minutes: 60
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v4
    - uses: actions/setup-node@v4
      with:
        node-version: lts/*
    - name: Install dependencies
      run: npm ci
    - 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

在推送/拉取请求时（分片处理）​

GitHub Actions supports sharding tests between multiple jobs. Check out our sharding doc to learn more about sharding and to see a GitHub actions example of how to configure a job to run your tests on multiple machines as well as how to merge the HTML reports.

通过容器​

GitHub Actions 支持通过使用 jobs.<job_id>.container 选项在容器中运行作业。这种方式有助于避免依赖项污染主机环境，并能为不同操作系统提供一致的环境，例如用于截图/视觉回归测试。

.github/workflows/playwright.yml
name: Playwright Tests
on:
  push:
    branches: [ main, master ]
  pull_request:
    branches: [ main, master ]
jobs:
  playwright:
    name: 'Playwright Tests'
    runs-on: ubuntu-latest
    container:
      image: mcr.microsoft.com/playwright:v1.51.0-noble
      options: --user 1001
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: lts/*
      - name: Install dependencies
        run: npm ci
      - name: Run your tests
        run: npx playwright test

关于部署​

这将在GitHub Deployment进入success状态后启动测试。像Vercel这样的服务使用这种模式，因此您可以在其部署环境中运行端到端测试。

.github/workflows/playwright.yml
name: Playwright Tests
on:
  deployment_status:
jobs:
  test:
    timeout-minutes: 60
    runs-on: ubuntu-latest
    if: github.event.deployment_status.state == 'success'
    steps:
    - uses: actions/checkout@v4
    - uses: actions/setup-node@v4
      with:
        node-version: lts/*
    - name: Install dependencies
      run: npm ci
    - name: Install Playwright
      run: npx playwright install --with-deps
    - name: Run Playwright tests
      run: npx playwright test
      env:
        PLAYWRIGHT_TEST_BASE_URL: ${{ github.event.deployment_status.target_url }}

快速失败​

大型测试套件的执行可能非常耗时。通过使用--only-changed标志执行初步测试运行，您可以优先运行可能失败的测试文件。这将为您提供更快的反馈循环，并在处理拉取请求时略微降低CI资源消耗。为了检测受变更集影响的测试文件，--only-changed会分析测试套件的依赖关系图。这是一种启发式方法，可能会遗漏某些测试，因此在初步测试运行后始终执行完整的测试套件非常重要。

.github/workflows/playwright.yml
name: Playwright Tests
on:
  push:
    branches: [ main, master ]
  pull_request:
    branches: [ main, master ]
jobs:
  test:
    timeout-minutes: 60
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v4
      with:
        # Force a non-shallow checkout, so that we can reference $GITHUB_BASE_REF.
        # See https://github.com/actions/checkout for more details.
        fetch-depth: 0
    - uses: actions/setup-node@v4
      with:
        node-version: lts/*
    - name: Install dependencies
      run: npm ci
    - name: Install Playwright Browsers
      run: npx playwright install --with-deps
    - name: Run changed Playwright tests
      run: npx playwright test --only-changed=$GITHUB_BASE_REF
      if: github.event_name == 'pull_request'
    - 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

Docker​

我们提供了一个预构建的Docker镜像，您可以直接使用或作为参考来更新现有的Docker定义。

建议配置

  1. 在使用Chromium时，也建议使用--ipc=host。没有这个参数，Chromium可能会耗尽内存并崩溃。更多关于此选项的信息请参阅Docker文档。
  2. 在启动Chromium时遇到其他奇怪错误？在本地开发时，尝试使用docker run --cap-add=SYS_ADMIN运行您的容器。
  3. 建议使用--init Docker标志或dumb-init来避免对PID=1进程的特殊处理。这是导致僵尸进程的常见原因。

Azure Pipelines​

对于Windows或macOS代理，无需额外配置，只需安装Playwright并运行测试即可。

对于Linux代理，您可以使用我们的Docker容器（支持Azure Pipelines）来运行容器化作业。或者，您也可以使用命令行工具来安装所有必要的依赖项。

要运行Playwright测试，请使用此流水线任务：

trigger:
- main

pool:
  vmImage: ubuntu-latest

steps:
- task: NodeTool@0
  inputs:
    versionSpec: '18'
  displayName: 'Install Node.js'
- script: npm ci
  displayName: 'npm ci'
- script: npx playwright install --with-deps
  displayName: 'Install Playwright browsers'
- script: npx playwright test
  displayName: 'Run Playwright tests'
  env:
    CI: 'true'

使用Azure Pipelines上传playwright-report文件夹​

如果任何playwright测试失败，这将导致流水线运行失败。如果您还想将测试结果与Azure DevOps集成，请使用PublishTestResults任务，如下所示：

trigger:
- main

pool:
  vmImage: ubuntu-latest

steps:
- task: NodeTool@0
  inputs:
    versionSpec: '18'
  displayName: 'Install Node.js'

- script: npm ci
  displayName: 'npm ci'
- script: npx playwright install --with-deps
  displayName: 'Install Playwright browsers'
- script: npx playwright test
  displayName: 'Run Playwright tests'
  env:
    CI: 'true'
- task: PublishTestResults@2
  displayName: 'Publish test results'
  inputs:
    searchFolder: 'test-results'
    testResultsFormat: 'JUnit'
    testResultsFiles: 'e2e-junit-results.xml'
    mergeTestResults: true
    failTaskOnFailedTests: true
    testRunTitle: 'My End-To-End Tests'
  condition: succeededOrFailed()
- task: PublishPipelineArtifact@1
  inputs:
    targetPath: playwright-report
    artifact: playwright-report
    publishLocation: 'pipeline'
  condition: succeededOrFailed()

注意：需要通过以下方式相应配置JUnit报告器

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

export default defineConfig({
  reporter: [['junit', { outputFile: 'test-results/e2e-junit-results.xml' }]],
});

在 playwright.config.ts 中。

Azure Pipelines (分片)​

trigger:
- main

pool:
  vmImage: ubuntu-latest

strategy:
  matrix:
    chromium-1:
      project: chromium
      shard: 1/3
    chromium-2:
      project: chromium
      shard: 2/3
    chromium-3:
      project: chromium
      shard: 3/3
    firefox-1:
      project: firefox
      shard: 1/3
    firefox-2:
      project: firefox
      shard: 2/3
    firefox-3:
      project: firefox
      shard: 3/3
    webkit-1:
      project: webkit
      shard: 1/3
    webkit-2:
      project: webkit
      shard: 2/3
    webkit-3:
      project: webkit
      shard: 3/3
steps:
- task: NodeTool@0
  inputs:
    versionSpec: '18'
  displayName: 'Install Node.js'

- script: npm ci
  displayName: 'npm ci'
- script: npx playwright install --with-deps
  displayName: 'Install Playwright browsers'
- script: npx playwright test --project=$(project) --shard=$(shard)
  displayName: 'Run Playwright tests'
  env:
    CI: 'true'

Azure Pipelines (容器化)​

trigger:
- main

pool:
  vmImage: ubuntu-latest
container: mcr.microsoft.com/playwright:v1.51.0-noble

steps:
- task: NodeTool@0
  inputs:
    versionSpec: '18'
  displayName: 'Install Node.js'

- script: npm ci
  displayName: 'npm ci'
- script: npx playwright test
  displayName: 'Run Playwright tests'
  env:
    CI: 'true'

CircleCI​

在CircleCI上运行Playwright与在GitHub Actions上运行非常相似。为了指定预构建的Playwright Docker镜像,只需在配置中使用docker:修改代理定义,如下所示:

executors:
  pw-noble-development:
    docker:
      - image: mcr.microsoft.com/playwright:v1.51.0-noble

注意：当使用docker代理定义时，您将Playwright运行的资源类别指定为'medium'层级此处。Playwright的默认行为是将工作线程数设置为检测到的核心数（在medium层级情况下为2）。将工作线程数覆盖为超过此数值会导致不必要的超时和故障。

CircleCI中的分片​

在CircleCI中，分片索引从0开始，这意味着您需要覆盖默认的并行环境变量。以下示例展示了如何通过在CIRCLE_NODE_INDEX上加1来传入--shard命令行参数，从而在CircleCI并行度为4的情况下运行Playwright。

  playwright-job-name:
    executor: pw-noble-development
    parallelism: 4
    steps:
      - run: SHARD="$((${CIRCLE_NODE_INDEX}+1))"; npx playwright test --shard=${SHARD}/${CIRCLE_NODE_TOTAL}

Jenkins​

Jenkins支持用于管道的Docker代理。使用Playwright Docker镜像在Jenkins上运行测试。

pipeline {
   agent { docker { image 'mcr.microsoft.com/playwright:v1.51.0-noble' } }
   stages {
      stage('e2e-tests') {
         steps {
            sh 'npm ci'
            sh 'npx playwright test'
         }
      }
   }
}

Bitbucket Pipelines​

Bitbucket Pipelines可以使用公共Docker镜像作为构建环境。要在Bitbucket上运行Playwright测试，请使用我们的公共Docker镜像(参见Dockerfile)。

image: mcr.microsoft.com/playwright:v1.51.0-noble

GitLab CI​

要在GitLab上运行Playwright测试，请使用我们的公共Docker镜像(see Dockerfile)。

stages:
  - test

tests:
  stage: test
  image: mcr.microsoft.com/playwright:v1.51.0-noble
  script:
  ...

分片​

GitLab CI 支持使用 parallel 关键字在多个作业之间分片测试。测试作业将被拆分为多个并行运行的小型作业。并行作业按顺序命名为从 job_name 1/N 到 job_name N/N。

stages:
  - test

tests:
  stage: test
  image: mcr.microsoft.com/playwright:v1.51.0-noble
  parallel: 7
  script:
    - npm ci
    - npx playwright test --shard=$CI_NODE_INDEX/$CI_NODE_TOTAL

GitLab CI 还支持使用 parallel:matrix 选项在多个作业之间分片测试。测试作业将在单个流水线中并行运行多次，但每个作业实例具有不同的变量值。在下面的示例中，我们有2个 PROJECT 值和10个 SHARD 值，总共将运行20个作业。

stages:
  - test

tests:
  stage: test
  image: mcr.microsoft.com/playwright:v1.51.0-noble
  parallel:
    matrix:
      - PROJECT: ['chromium', 'webkit']
        SHARD: ['1/10', '2/10', '3/10', '4/10', '5/10', '6/10', '7/10', '8/10', '9/10', '10/10']
  script:
    - npm ci
    - npx playwright test --project=$PROJECT --shard=$SHARD

Google Cloud Build​

要在Google Cloud Build上运行Playwright测试，请使用我们的公共Docker镜像(see Dockerfile)。

steps:
- name: mcr.microsoft.com/playwright:v1.51.0-noble
  script: 
  ...
  env:
  - 'CI=true'

无人机​

要在Drone上运行Playwright测试，请使用我们的公共Docker镜像(see Dockerfile)。

kind: pipeline
name: default
type: docker

steps:
  - name: test
    image: mcr.microsoft.com/playwright:v1.51.0-noble
    commands:
      - npx playwright test

浏览器缓存​

不建议缓存浏览器二进制文件，因为恢复缓存所需的时间与下载二进制文件的时间相当。特别是在Linux下，操作系统依赖项需要安装，这些依赖项是不可缓存的。

如果您仍希望在CI运行之间缓存浏览器二进制文件，请在您的CI配置中根据Playwright版本的哈希值缓存这些目录。

调试浏览器启动​

Playwright 支持 DEBUG 环境变量来在执行期间输出调试日志。在调试 Error: Failed to launch browser 错误时，将其设置为 pw:browser 会很有帮助。

DEBUG=pw:browser npx playwright test

运行带界面的版本​

默认情况下，Playwright以无头模式启动浏览器。请参阅我们的运行测试指南了解如何在有头模式下运行测试。

在Linux代理上，有界面(headed)执行需要安装Xvfb。我们的Docker镜像和GitHub Action已预装Xvfb。要在Xvfb下以有界面模式运行浏览器，请在实际命令前添加xvfb-run。

xvfb-run npx playwright test