使用Azure管道自动着色

半音的自动化可以包括作为您的一部分 多级Azure管道 相对容易的工作流.

设置

要集成彩色与你现有的管道,你需要添加以下:

# azure-pipelines.yml

#👇事件触发管道执行
触发:
- main

#👇环境变量创建彩色
变量:
- 集团: 彩色-关键s

#其他配置 

#管道阶段
阶段:
- 阶段: 测试
  displayName: 色测试
  #工作列表
  工作:
  - 工作: Chromatic_Deploy
    displayName: 安装软件包并发布到chromecast
    变量:
      #设置有作用域的环境变量缓存包
      npm_config_cache: $(管道.工作区)/.npm 
    #步骤列表
    步骤:
      #👇安装和配置节点环境
    - 任务: 节点Tool@0
      输入:
        versionSpec: '12.x'
      displayName: '安装 节点.js'  
    - 任务: Cache@2
      displayName: 安装和缓存包
      输入:
        关键: 'npm | “$(代理.OS)" | 包-lock.json的
        restoreKeys: |
          npm |“$(代理.OS)"
        路径: $ (npm_config_cache)
    - script: npm ci
      条件: ne(变量.CACHE_RESTORED,“真正的”)
      #👇添加彩色作为一个步骤
    - 任务: CmdLine@2
      displayName: 发布到彩色
      输入:
        #👇Runs彩色
        script: npx彩色——project-token = $ {CHROMATIC_PROJECT_TOKEN}
为了额外的安全,添加彩色的 project-token 作为环境变量. 查看官方Azure 环境变量文件.

在特定的分支上运行chrodbook

如果你需要自定义你的工作流程来运行chrombook在特定的分支, 像这样调整你的管道:

# azure-pipelines.yml

#👇事件触发管道执行
触发:
  分支机构:
    包括:
    - main #👈过滤执行只在主分支上运行
    排除:
    - 例子

#👇在pull请求上配置管道执行
pr:
  分支机构:
    包括:
    - main #👈过滤执行只在主分支的pull请求上运行
    排除:
    - 例子


#额外的管道配置
阅读官方Azure 有条件的管道文档.

现在你的管道将只运行彩色 main 分支.

覆盖色系的分支检测

如果您的Azure管道包括一组分支规则(e.g., 重命名分支, 创造了短暂的, 或临时分支),它可能导致不可预见的构建错误.

在这种情况下,您可以调整您的工作流并包括 ——分支名称 国旗. 该标志覆盖了默认的分支检测,以支持指定的分支:

# azure-pipelines.yml

#其他配置

#管道阶段
阶段:
- 阶段: 测试
  displayName: 色测试
  #工作列表
  工作:
  - 工作: Chromatic_Deploy
    displayName: 发布到彩色
    步骤:
      #管道中的其他步骤

      #👇添加彩色作为管道中的一个步骤
    - 任务: CmdLine@2
      displayName: 发布到彩色
      输入:
        #👇运行带有——分支-name标志的半色代码来覆盖基线分支
        script: npx——project-token=${CHROMATIC_PROJECT_TOKEN}——分支-name=${YOUR_BRANCH}

现在将检测正确的分支和运行您的工作流程. 在修复跨分支UI比较时,也可以应用此方法.

UI测试和UI评审

用户界面测试UI审查 依靠 分支和基线 检测以保持跟踪 Snapshots. 十博体育备用网址推荐以下配置.

“必需”检查的命令退出代码

如果你使用拉请求状态作为必要的检查之前合并, 如果测试Snapshots呈现时没有错误(但有更改),您可能不希望管道失败. 为了实现这一点,传递国旗 ——exit-zero-on-changes彩色 命令,您的步骤将继续在这种情况下. 例如:

# azure-pipelines.yml

#其他配置

#管道阶段
阶段:
- 阶段: 测试
  displayName: 色测试
  #工作列表
  工作:
  - 工作: Chromatic_Deploy
    displayName: 发布到彩色
    步骤:
      #管道中的其他步骤

      #👇添加彩色作为管道中的一个步骤
    - 任务: CmdLine@2
      displayName: 发布到彩色
      输入:
        #👇运行带标志的彩色,以防止管道故障 
        script: npx color——project-token=${CHROMATIC_PROJECT_TOKEN}——exit-zero-on-changes
阅读十博体育备用网址的 CLI文件.

当使用 ——exit-zero-on-changes 如果您的故事书包含错误的故事,那么您的管道执行仍然会停止并失败. 如果你更喜欢色系的话 从来没有 要阻塞你的管道,你可以使用 NPX彩色||是真的.

在验证UI测试结果后重新运行失败的构建

包含可视化更改的构建需要 验证. 如果你不使用,它们就会失败 ——exit-zero-on-changes. 接受所有更改后,重新运行管道和 发布到彩色 一步将.

如果你否认任何改变, 你将需要修改必要的代码来修复测试(并因此开始一个新的构建),以使chromium再次通过测试.

保持一个干净的“主要”分支

一个干净的 main 分支机构是一个发展 最佳实践强烈推荐 对色. 在实践中,这意味着确保测试构建在您的 main 分支传递.

如果构建是直接提交的结果 main,您将需要接受更改以保持主分支的干净. 如果它们被合并 feature-分支机构,您需要确保这些分支正在通过 之前 你融入 main.

Azure squash/rebase合并和“主”分支

Azure的squash/rebase合并功能创建了与被合并的分支没有关联的新提交. 如果您已经在使用此选项, 然后,十博体育备用网址将自动检测这种情况,并带来基线(见 分支和基线 更多细节).

如果你正在使用这个功能,但是注意到传入的更改在chrolical中不被接受为基线, 然后,您将需要调整管道并包括 ——auto-accept-changes 国旗. 例如:

# azure-pipelines.yml

#其他配置 

#管道阶段
阶段:
- 阶段: 测试
  displayName: 色测试
  #工作列表
  工作:
  - 工作: Chromatic_Deploy
    displayName: 发布到彩色
    步骤:
      #管道中的其他步骤

      #👇检查分支是否为主分支,并运行带标志的彩色分支以接受所有更改.
    - 任务: CmdLine@2
      displayName: 发布到彩色和自动接受变化
      条件: (成功(),eq(变量的构建.sourceBranch], refs /头/ main '))
      输入:
        script: npx color——project-token=${CHROMATIC_PROJECT_TOKEN}——auto-accept-changes
      #👇检查分支是否不是主要的,并运行彩色
    - 任务: CmdLine@2
      displayName: 发布到彩色
      条件: eq(变量的构建.原因'],“PullRequest”)
      输入:
        script: npx彩色——project-token = $ {CHROMATIC_PROJECT_TOKEN}
阅读十博体育备用网址的 CLI文件.

包括 ——auto-accept-changes 标志确保所有传入的更改将被接受为基线. 此外,你将保持清洁 main 分支.

如果您想测试重新基于的分支所引入的更改, 控件可以调整工作流并包含一个新步骤 ignore-last-build-on-分支 国旗. 例如:

# azure-pipelines.yml

#其他配置 

#管道阶段
阶段:
- 阶段: 测试
  displayName: 色测试
  #工作列表
  工作:
  - 工作: Chromatic_Deploy
    displayName: 发布到彩色
    步骤:
      #管道中的其他步骤

      #👇选择跳过目标分支的最后一次构建
    - 任务: CmdLine@2
      displayName: 发布到彩色
      输入:
        script: npx——project-token=${CHROMATIC_PROJECT_TOKEN}——ignore-last-build-on-分支=my-分支
阅读十博体育备用网址的 CLI文件.

包括 ——ignore-last-build-on-分支 标志确保不将特定分支的最新构建用作基线.

在开放源码项目的外部分支上运行chroff

您可以通过共享您的 project-token 您在其中配置了彩色命令(通常在 包.json 或者在管道步骤中).

有取舍. 分享 project-token的允许 贡献者 和其他人运行半音. 他们可以用你的Snapshots. 他们将无法访问您的帐户、设置或接受基线. 对于重视社区贡献的开源项目来说,这是一个可以接受的折衷方案.

跳过某些分支的构建

有时您可能希望跳过为某个分支运行构建, 但仍然有彩色标记,在该分支上的最新commit作为“passed”. 否则,拉取请求可能会由于需要的检查仍然挂起而被阻塞. 为了避免这个问题,您可以运行 彩色——跳过 国旗. 此标志接受分支名称或glob模式.

这个特性的一个用例是跳过机器人创建的分支的构建. 例如,Renovate自动更新项目依赖项. 尽管一些依赖关系可能会导致UI更改, 你可能会发现不值得为每一个依赖项更新运行彩色. 相反,你可以依靠半音跑步对抗 main or 开发 分支.

跳过构建 翻新 分支,使用以下:

彩色 ——跳过 “翻新/ * *”
阅读十博体育备用网址的 CLI文件.

要将其应用于多个分支,请使用“扩展glob”. 看到 picomatch 有关详细信息,.

彩色 ——跳过 “@(翻新/ * * | your-custom-分支 / * *)”
友情链接: 1 2 3 4 5 6 7 8 9 10