七、命令行运行Cypress

命令行运行Cypress

前面咱们都是通过图形界面(Test Runner)运行测试,直观是直观,但实际工作中,尤其是在持续集成(CI)环境里,更常用命令行来跑测试。这一章就来聊聊怎么用命令行操作Cypress,灵活控制测试的运行方式。

一、两种运行模式:open和run

Cypress的命令行运行主要有两种方式,用途不同:

  • cypress open:启动图形界面,适合写用例时实时调试,能看到每一步的执行过程。
  • cypress run:无界面运行(默认无头模式),适合批量执行或CI环境,跑完直接出结果。

二、cypress open:带界面的调试模式

虽然是命令行启动,但最终会打开图形界面,用法很简单:

  1. 基础用法:在项目根目录执行

    bash 复制代码
    npx cypress open

    第一次运行会初始化配置,之后每次执行会直接打开Test Runner,和咱们之前手动点击的效果一样。

  2. 指定浏览器:默认用Electron浏览器,也可以指定Chrome、Firefox等(前提是本地已安装):

    bash 复制代码
    npx cypress open --browser chrome
  3. 指定配置文件 :默认用项目根目录的cypress.json,如果想临时用其他配置文件:

    bash 复制代码
    npx cypress open --config-file cypress.qa.json
  4. 传环境变量:运行时动态指定环境变量,比如区分测试环境和生产环境:

    bash 复制代码
    # 指定环境为测试环境,端口8080
    npx cypress open --env env=test,port=8080

    代码里用Cypress.env('env')就能拿到传的值。

三、cypress run:无界面的批量运行

这种方式不会打开浏览器窗口,适合一次性跑完全部用例,或集成到CI流水线中,用法更灵活:

  1. 基础用法:直接运行所有用例

    bash 复制代码
    npx cypress run

    运行结束后,命令行会显示总用例数、成功/失败数,以及每个用例的执行时间。

  2. 只跑指定用例 :用--spec参数指定单个或多个用例文件,不用跑全部:

    bash 复制代码
    # 只跑登录相关的用例
    npx cypress run --spec "cypress/integration/login/**/*.js"
    # 跑单个用例文件
    npx cypress run --spec "cypress/integration/testLogin.js"
  3. 指定浏览器 :和open类似,支持无头模式运行在Chrome、Firefox等浏览器:

    bash 复制代码
    npx cypress run --browser firefox
  4. 生成测试报告 :用--reporter指定报告格式,比如生成JUnit格式给Jenkins用:

    bash 复制代码
    npx cypress run --reporter junit --reporter-options mochaFile=results/test.xml

    也可以生成HTML报告(需要先安装mochawesome插件):

    bash 复制代码
    npx cypress run --reporter mochawesome
  5. 记录测试过程 :加--record参数可以把运行结果上传到Cypress Dashboard(需要注册账号),方便查看历史记录和视频:

    bash 复制代码
    npx cypress run --record --key 你的项目key
  6. 并行运行 :在CI环境中用--parallel参数可以把用例分到多台机器上跑,加速执行(需要配合--record):

    bash 复制代码
    npx cypress run --record --parallel

四、在package.json里简化命令

每次敲一长串命令太麻烦,可以在package.jsonscripts里定义快捷命令:

json 复制代码
{
  "scripts": {
    "cy:open": "cypress open", // 启动图形界面
    "cy:run": "cypress run", // 无界面运行所有用例
    "cy:login": "cypress run --spec 'cypress/integration/login/**/*.js'", // 只跑登录用例
    "cy:report": "cypress run --reporter mochawesome" // 生成HTML报告
  }
}

之后直接用npm run执行:

bash 复制代码
npm run cy:open # 启动图形界面
npm run cy:login # 只跑登录用例
相关推荐
N***73851 小时前
Vue网络编程详解
前端·javascript·vue.js
e***71671 小时前
Spring Boot项目接收前端参数的11种方式
前端·spring boot·后端
程序猿小蒜1 小时前
基于springboot的的学生干部管理系统开发与设计
java·前端·spring boot·后端·spring
银空飞羽1 小时前
让Trae CN SOLO自主发挥,看看能做出一个什么样的项目
前端·人工智能·trae
Eshine、2 小时前
解决前端项目中,浏览器无法正常加载带.gz名称的文件
前端·vue3·.gz·.gz名称的js文件无法被加载
用户47949283569152 小时前
别再当 AI 的"人肉定位器"了:一个工具让 React 组件秒定位
前端·aigc·ai编程
WYiQIU3 小时前
面了一次字节前端岗,我才知道何为“造火箭”的极致!
前端·javascript·vue.js·react.js·面试
qq_316837753 小时前
uniapp 观察列表每个元素的曝光时间
前端·javascript·uni-app
小夏同学呀3 小时前
在 Vue 2 中实现 “点击下载条码 → 打开新窗口预览 → 自动唤起浏览器打印” 的功能
前端·javascript·vue.js
芳草萋萋鹦鹉洲哦3 小时前
【vue】导航栏变动后刷新router的几种方法
前端·javascript·vue.js