持续集成CI/CD配置

发布时间: 2025-03-27 19:18

↑

# 持续集成CI/CD配置

本文将详细介绍如何将Playwright测试集成到CI/CD流程中，帮助你实现自动化测试的持续集成和部署。

## 基础配置

### 1. GitHub Actions

```yaml
# .github/workflows/playwright.yml
name: Playwright Tests

on:
  push:
    branches: [ main, master ]
  pull_request:
    branches: [ main, master ]

jobs:
  test:
    runs-on: ubuntu-latest

steps:
    - uses: actions/checkout@v2

- name: Setup Node.js
      uses: actions/setup-node@v2
      with:
        node-version: '16'

- name: Install dependencies
      run: npm ci

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

- name: Run Playwright tests
      run: npx playwright test

- name: Upload test results
      if: always()
      uses: actions/upload-artifact@v2
      with:
        name: playwright-report
        path: playwright-report/
```

### 2. GitLab CI

```yaml
# .gitlab-ci.yml
image: mcr.microsoft.com/playwright:v1.28.0-focal

stages:
  - test

playwright:
  stage: test
  script:
    - npm ci
    - npx playwright test
  artifacts:
    when: always
    paths:
      - playwright-report/
    expire_in: 1 week
```

## 高级配置

### 1. 并行测试

```yaml
# GitHub Actions 并行配置
jobs:
  test:
    strategy:
      matrix:
        shardIndex: [1, 2, 3, 4]
        shardTotal: [4]
    steps:
      - name: Run tests
        run: npx playwright test --shard=${{ matrix.shardIndex }}/${{ matrix.shardTotal }}
```

### 2. 多浏览器测试

```yaml
# GitLab CI 多浏览器配置
playwright:
  script:
    - npm ci
    - npx playwright test --project=chromium
    - npx playwright test --project=firefox
    - npx playwright test --project=webkit
```

## 环境配置

### 1. 环境变量

```yaml
# GitHub Actions 环境变量
jobs:
  test:
    env:
      BASE_URL: ${{ secrets.BASE_URL }}
      API_KEY: ${{ secrets.API_KEY }}
    steps:
      - name: Run tests
        run: npx playwright test

# GitLab CI 环境变量
playwright:
  variables:
    BASE_URL: ${CI_BASE_URL}
    API_KEY: ${CI_API_KEY}
```

### 2. Docker配置

```dockerfile
# Dockerfile
FROM mcr.microsoft.com/playwright:v1.28.0-focal

WORKDIR /app

COPY package*.json ./
RUN npm ci

COPY . .

CMD ["npx", "playwright", "test"]
```

## 最佳实践

### 1. 测试策略

```yaml
# 分层测试策略
jobs:
  unit:
    runs-on: ubuntu-latest
    steps:
      - name: Run unit tests
        run: npm run test:unit

integration:
    needs: unit
    runs-on: ubuntu-latest
    steps:
      - name: Run integration tests
        run: npm run test:integration

e2e:
    needs: integration
    runs-on: ubuntu-latest
    steps:
      - name: Run E2E tests
        run: npx playwright test
```

### 2. 报告处理

```yaml
# 测试报告处理
steps:
  - name: Run tests
    run: npx playwright test

- name: Upload HTML report
    if: always()
    uses: actions/upload-artifact@v2
    with:
      name: playwright-report
      path: playwright-report/
      retention-days: 30

- name: Publish Test Results
    if: always()
    uses: dorny/test-reporter@v1
    with:
      name: Playwright Tests
      path: results.xml
      reporter: jest-junit
```

## 调试技巧

### 1. CI调试

```yaml
# 启用调试模式
steps:
  - name: Run tests with debugging
    env:
      DEBUG: pw:api
      PWDEBUG: 1
    run: npx playwright test

- name: Save debug logs
    if: failure()
    uses: actions/upload-artifact@v2
    with:
      name: debug-logs
      path: test-results/
```

### 2. 错误处理

```yaml
# 错误重试机制
steps:
  - name: Run tests with retry
    uses: nick-invision/retry@v2
    with:
      timeout_minutes: 10
      max_attempts: 3
      command: npx playwright test

- name: Notify on failure
    if: failure()
    uses: actions/github-script@v6
    with:
      script: |
        github.rest.issues.create({
          owner: context.repo.owner,
          repo: context.repo.repo,
          title: 'Playwright tests failed',
          body: 'Check the logs for details'
        })
```

## 常见问题

### 1. 性能优化

```yaml
# 缓存依赖
steps:
  - name: Cache dependencies
    uses: actions/cache@v2
    with:
      path: ~/.npm
      key: npm-${{ hashFiles('package-lock.json') }}
      restore-keys: npm-

- name: Cache Playwright browsers
    uses: actions/cache@v2
    with:
      path: ~/.cache/ms-playwright
      key: playwright-${{ hashFiles('package-lock.json') }}
```

### 2. 资源管理

```yaml
# 资源限制
jobs:
  test:
    runs-on: ubuntu-latest
    timeout-minutes: 60
    steps:
      - name: Run tests with resource limits
        run: |
          docker run --memory=4g --cpus=2 \
          mcr.microsoft.com/playwright:v1.28.0-focal \
          npx playwright test
```

## 下一步

1. 探索[测试用例组织结构](/article/playwright/best-practices/test-organization)
2. 学习[性能优化策略](/article/playwright/best-practices/performance)
3. 了解[跨浏览器测试方案](/article/playwright/best-practices/cross-browser)

## 参考资料

- [Playwright CI指南](https://playwright.dev/docs/ci)
- [GitHub Actions文档](https://docs.github.com/cn/actions)
- [GitLab CI/CD文档](https://docs.gitlab.com/ee/ci/)

元素码农