Happo

一个用于集成的开源库 happo.io -一个可视化和可访问性回归测试平台，帮助您捕获应用程序中的意外更改。

📚文档

有关全面的文档，请访问 docs.happo.io。

🚀特性

• CLI工具包括一个命令行接口，便于集成
• 灵活的配置：支持多种配置文件格式
• 打印稿的支持：用TypeScript构建，并提供完整的类型定义
• ES模块：使用现代ES模块，更好的摇树和性能

📦安装

npm install happo --save-dev
# or
pnpm add happo --save-dev
# or
yarn add happo --dev

🛠️用法

基本配置

创建一个 happo.config.ts 项目根目录下的文件：

import { defineConfig } from 'happo';

export default defineConfig({
  apiKey: process.env.HAPPO_API_KEY!,
  apiSecret: process.env.HAPPO_API_SECRET!,
  targets: {
    'chrome-desktop': {
      type: 'chrome',
      viewport: '1280x720',
    },
    'firefox-desktop': {
      type: 'firefox',
      viewport: '1280x720',
    },
    'ios-safari': {
      type: 'ios-safari',
    },
  },
});

CLI使用

在CLI中运行Happo：

npx happo

CLI将自动找到您的配置文件并运行可视化回归测试套件。

🔧配置选项

支持的配置文件

库自动检测配置文件的顺序如下：

• happo.config.js
• happo.config.mjs
• happo.config.cjs
• happo.config.ts
• happo.config.mts
• happo.config.cts

关键配置属性

• apiKey ＆ apiSecret： happo.io的鉴权凭证
• integration：设置集成类型
• targets：目标配置，包括常规浏览器和可访问性目标
• project：可选项目名称
• deepCompare：计算差异的可选设置
• blockApproval：阻止比较被批准的可选条件

阻止批准

使用 blockApproval 在某些问题解决之前阻止比较被批准：

export default defineConfig({
  // ...
  blockApproval: {
    // Block when the report has examples that failed to render
    renderErrors: true,
    // Block when the comparison introduces new accessibility violations
    accessibilityViolations: true,
    // Block when a page starts to scroll sideways (needs a target with
    // `detectHorizontalOverflow`)
    horizontalOverflow: true,
  },
});

由于它存在于配置中，因此您可以在单个拉取请求中启用条件（并修复那里的问题），而不会影响存储库中的其他工作。

浏览器的目标

支持的浏览器类型：

• 桌面： chrome， firefox， edge， safari， accessibility
• 移动： ios-safari， ipad-safari

每个目标都支持高级选项，如：

• 视窗大小
• 最大尺寸
• 配色偏好
• 静音动画设置
• 动画（APNG）快照捕获通过 animate (实验性的，没有根据 ios-safari/ipad-safari）

🤝贡献

欢迎在 happo / happo． 这个包现在是在Happo自己的存储库中开发的，所以Happo / Happo中的代码不再更新，并且那里的pull请求不能按原样合并。

📄许可证

本项目在麻省理工学院许可下授权-参见 许可证 文件查看详细信息。

🔗链接

• 文档
• happo.io
• npm包
• 发布说明

💡支持

支持和问题：

• 检查 文档
• 在这个GitHub存储库中打开一个issue
• happo联系。IO支持 [email protected]