初识cypress

Posted 2023-05-03

参考技术A 我是一个前端开发工程师，由于没有自动化测试这块，一直都是人工去测，不免太耗时。所以想试试Cypress，希望能有收获。

我在selenium和cypress这两个框架中纠结，最后选择这个框架的初心很简单，老公推荐的，哈哈，我信他。然后就开始了我的自动化测试之旅。

首先，还是得安装环境，因为nodejs和npm早就ready，我只需要新创建一个文件夹，在该文件夹下执行命令 npm install cypress ,然后等待大概十分钟左右，安装完成！

那就尝试下手动添加package.json

执行 npm run cypress

在原项目中也可添加cypress，最近 npm install cypress 不成功，改为 cnpm install cypress 快多了，安装完，没有生产cypress目录，在package.json中的“script”中添加"cypress": "cypress open" ，执行 npm run cypress ，第一次执行，会自动创建cypress目录。

examples下面是Cypress提供的demo，点击即可运行。运行时一直刷刷刷的在跑案例跑网页，这种感觉，就跟上了高速一般~~

暗暗发誓，一定要用好这个玩意儿，解放双手，翻身农奴把歌唱~~

Cypress内置工具

Cypress 中内置的断言 包含了几种类型：

注意到 Cypress 使用 Mocha BDD 风格的生命周期 ，
不同测试的命名风格：

Cypress Report

1.页面直接查看结果

2.用命令行测试case，会有截图和video保存

　　a.在cypress case目录下（与cypress.json同级）添加package.json文件，文件内容：　

{
  "scripts": {
    "cypress:open": "cypress open",
    "cypress:run": "cypress run"
  }
}

　　b.cmd中在cypress case目录（与cypress.json同级）位置运行命令行：

　　cypress run --spec .cypressintegrationlogin.js （--spec定义要运行的case，可以不写，默认为运行integration下所有case）运行后cmd中显示report结果，integration同级目录会新加screenshots和videos两个folder，存截图和视频。