设置 CI（持续集成）
介绍
Playwright 测试可以在任何 CI 提供商上运行。本指南介绍了一种在 GitHub 上运行测试的方法，使用 GitHub Actions。如果您想了解更多内容，或如何配置其他 CI 提供商，请查看我们 【持续集成的详细文档】。
您将学习：
-
如何设置 GitHub Actions
-
如何查看测试日志
-
如何查看 HTML 报告
-
如何查看跟踪
-
如何在网上发布报告
设置 GitHub Actions
在通过 【VS Code 插件】 或 npm init playwright@latest 【安装 Playwright】 时，您可以选择添加一个 【GitHub Actions】 工作流。这样会在 .github/workflows 文件夹中创建一个 playwright.yml 文件，包含所有必要的配置，以便您的测试在每次推送和拉取请求合并到 main 或 master 分支时自动运行。以下是该文件的内容：
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该工作流执行以下步骤：
-
克隆您的代码仓库
-
安装
Node.js -
安装
NPM依赖 -
安装
Playwright浏览器 -
运行
Playwright测试 -
上传
HTML报告到GitHub UI
要了解更多，请查看 【理解 GitHub Actions】。
创建 Repo 并推送到 GitHub
设置 【GitHub Actions 工作流】 后，您只需要在 【GitHub 上创建一个仓库】或将代码推送到现有仓库。按照 GitHub 上的指示操作，并记得使用 git init 命令 【初始化一个 Git 仓库】，以便可以添加、提交和推送代码。
在网上发布报告
下载 HTML 报告为 zip 文件并不方便。不过，您可以利用 Azure Storage 的静态网站托管功能，将 HTML 报告轻松高效地发布到互联网，所需配置非常少。
-
创建一个 【Azure Storage 帐号】。
-
为存储帐户启用 【静态网站托管】。
-
在 Azure 中创建一个服务主体，并授予其访问 Azure Blob 存储的权限。成功执行后，命令将显示凭据，这些凭据将在下一步中使用。
az ad sp create-for-rbac --name "github-actions" --role "Storage Blob Data Contributor" --scopes /subscriptions/<SUBSCRIPTION_ID>/resourceGroups/<RESOURCE_GROUP_NAME>/providers/Microsoft.Storage/storageAccounts/<STORAGE_ACCOUNT_NAME> -
使用上一步获得的凭证，在 GitHub 仓库中设置加密的 secrets。转到仓库设置中的 【GitHub Actions secrets】，添加以下 secrets：
-
AZCOPY_SPA_APPLICATION_ID
-
AZCOPY_SPA_CLIENT_SECRET
-
AZCOPY_TENANT_ID
有关如何使用客户端密钥授权服务主体的详细指南，请参阅此 Microsoft 文档。
-
-
添加一个步骤，将 HTML 报告上传到 Azure 存储。
...
- name: Upload HTML report to Azure
shell: bash
run: |
REPORT_DIR='run-${{ github.run_id }}-${{ github.run_attempt }}'
azcopy cp --recursive "./playwright-report/*" "https://<STORAGE_ACCOUNT_NAME>.blob.core.windows.net/\$web/$REPORT_DIR"
echo "::notice title=HTML report url::https://<STORAGE_ACCOUNT_NAME>.z1.web.core.windows.net/$REPORT_DIR/index.html"
env:
AZCOPY_AUTO_LOGIN_TYPE: SPN
AZCOPY_SPA_APPLICATION_ID: '${{ secrets.AZCOPY_SPA_APPLICATION_ID }}'
AZCOPY_SPA_CLIENT_SECRET: '${{ secrets.AZCOPY_SPA_CLIENT_SECRET }}'
AZCOPY_TENANT_ID: '${{ secrets.AZCOPY_TENANT_ID }}'$web 存储容器的内容可以通过使用网站的 【公共 URL】 从浏览器访问。
|
此步骤不适用于从 forked 仓库创建的拉取请求，因为此类工作流 【无法访问机密信息】。 |