@ cypress/ chrome- 记录器
此 repo 提供了导出 Cypress 测试的工具 Google Chrome DevTools 的录音 在方案方面.
安装 Cypress Chrome 录音机扩展名 如果您想直接从 Chrome DevTools 的录音机 UI 中导出录音.
先决条件
要从 Chrome DevTools Recorder 中导出 JSON 文件, 您需要使用 Chrome 101 或 更新 .
dblClick 财务报告和审定财务报表 rightclick 要求Chrome 103或更新.
安装
$ npm install -g @cypress/chrome-recorder
使用量
通过 CLI
要使用交互式 CLI, 运行 :
$ npx @cypress/chrome-recorder
CLI 将提示您输入您想要修改的目录或文件的路径, 以及写入生成的 Cypress 测试的路径 .
如果您喜欢通过 CLI 进入路径, 您可以运行以下命令导出单个录音 :
$ npx @cypress/chrome-recorder <relative path to target test file>
或包含多段录音的文件夹:
$ npx @cypress/chrome-recorder <relative path to target test folder>/*.json
默认输出会写入到 cypress/integration 倒计时 cypress/e2e。如果没有这些文件夹,请手工创建这些文件夹,或通过运行安装 Cypress yarn add -D cypress 或者说 npm install --save-dev cypress 在你的项目.
如果您喜欢不同的输出目录, 请指定通过 CLI :
$ npx @cypress/chrome-recorder <relative path to target test folder>/*.json --output=folder-name
或者通过交互的 CLI 提示.
CLI 选项
| 选项 | 说明 |
|---|---|
| -f, --部队 | 绕行 进行安全检查并迫使出口商运行 |
| -d --干 干 干 -干 干 | 干运行( 文件没有更改) |
| -哦, -- 产出 | 输出出口商生成的文件位置 |
| -p, -- 印记 | 打印已转换的文件到 stdout, 用于开发 |
Via 导入
import { cypressStringifyChromeRecording } from '@cypress/chrome-recorder';
const stringifiedContent = await cypressStringifyChromeRecording(
recordingContent
);
return stringifiedContent;
支持的 Chrome 记录器步骤类型
以下是目前支持的步数类型:
| 类型 | 说明 |
|---|---|
| 变动 | 变成 cy ("")元素".)类型 ("文本") |
| 单击 | 变成 cy ("")元素" 。单击(); |
| 单击(右键点击) | 变成 cy ("")元素" ),右键单击(; |
| 双击 | 变成 cy ("")元素".dbl 点击 (); |
| 盘旋 | 变成 cy ("")元素" ) 触发器(; |
| 键下 | 变成 cy. type ("{key}") |
| 键 | 目前未导出 |
| 导航 | 变成 cy.visit ("url") (中文(简体) ) |
| 设置Viewport | 变成 cy.viewport(宽,高) |
| 滚动 | 变成 cy.scrollTo(${step.x},${step.y}) |
如果上面没有列出步骤类型,那么应在CLI中显示警告信息.
许可证
本项目的许可条件如下: 麻省理工学院许可证。 。 。 .