cypress调研记录
1. 可以实现数据驱动，但是数据驱动和json文件不通用
json文件获取数据：cy.fixture('login/login.json').as("login_json")
---json提供数据更适合全局变量
数据驱动获取数据：var testData = [1,2,3]
testData.forEach((event)=>{
// do something....
console.log(event)
})
这里规定让这两种调用分开
2. Page-Object实现：E:\cypress_sample\cypress\testpage\loginPageCy.js
新增js文件，封装Page页面元素
3. 无法按照优先级运行
当前方式可以修改文件名
4. 使用无头浏览器：cypress run
5. 仅重运行失败case，使用插件cypress-skip-and-only-ui
6. cypress打开的插件也是隐身窗口，没有代理
7. 运行所有case：
Jenkins 构建
@echo off
E:
cd E:\cypress_sample
cypress run --browser chrome --spec E:\cypress_sample\cypress\integration\**\*
可以实现执行冒烟用例和非冒烟用例选择性运行
8. 重试-----不是很好，网络不稳定的情况，无法解决问题，会报错
1. 断言失败测试
2. 元素不存在重试
3. 重试默认时间4s，配置项字段defaultCommandTimeOut
9. cypress的优点：
1. 运行速度快
2. 自动等待，相较于selenium的三种等待方式，代码健壮性更好
3. 自带mock服务
4. 截图（时光穿梭）和视频，方便定位问题
5. 多并发--跨虚拟机并行运行测试脚本，并且收集测试结果（不收费）
6. CI/CD
7. 不需要依赖第三方插件
8. 测试思路， Page-Object， 数据驱动
9. API和UI完美结合，使测试更快
10. 使用cypress遇到的问题：
1. 重试，没法重运行整个case
cypress-plugin-retries插件实现
cypress.json
"env":{
"RETRIES":2
}
1. 重运行2次,需要注意的是，测试代码中(it)失败时，beforeEach和afterEach都重试
还有很多情况下，钩子不会重试，更多内容如
https://www.npmjs.com/package/cypress-plugin-retries#how-it-works
2. 按照优先级运行，
1. 目前替代方案，使用冒烟用例的方式运行
2. 在配置文件的env中用三个值分配标签（P0，P1，P2），在case中写入判断，如果等于P0、P1、P2的标签运行case，否则skip()
if (Cypress.env("TagName")==="P0"){
case: do something.....
} else {
this.skip()
cy.log("不会执行这一步")
}
3. 仅支持JavaScript
4. 并发收费--运维帮助
5. 判断元素是否存在----怎么判断存在，我就执行A操作，否则执行B操作;
if (Cypress.$("element").length > 0) {
// do something....
}
6. 如何切换Windows
1. remove target and click
cy.get('.goods-img-wrap a').should("have.attr", "target", "_blank")
cy.get('.goods-img-wrap a').invoke('removeAttr', 'target').click()
2. get href and visit
cy.get('.goods-img-wrap a').first().then(function ($a) {
const href = $a.prop("href")
cy.visit(href)
})
7. 针对刷新慢的问题，怎么处理
1. 硬编码，等待2s
cy.wait(2000)
2. 使用request，api请求成功后，再获取price
// 启动服务器以响应路由cy.route()
cy.server()
cy.route("**/price**").as("priceApi")
// 点击事件触发接口请求
cy.get(".color-item").last().click()
// 等待接口返回200，继续后续操作
cy.wait("@priceApi").then((xhr) => {
expect(xhr.status).to.eq(200)
})
8. 配置测试报告
1. Mochawesome报告
1. 首先需要下载报告相关依赖macho、machowesome
npm install --save-dev mocha@5.2.0 mochawesome mochawesome-merge mochawesome-report-generator
2. 在cypress.json中加入如下配置
"reporter": "mochawesome",
"reporterOptions": {
"overwrite": false,
"html": false,
"json": true
}
3. 新增一个scripts/cypress.js
内容如下：
const cypress = require('cypress')
const fse = require('fs-extra')
const { merge } = require('mochawesome-merge')
const generator = require('mochawesome-report-generator')
async function runTests() {
await fse.remove('mochawesome-report')
const { totalFailed } = await cypress.run()
const jsonReport = await merge()
await generator.create(jsonReport)
process.exit(totalFailed)
}
runTests()
4. package.json中修改scripts
"scripts":{
"cypress:run": "node scripts/cypress.js"
}
5. 运行cypress
npm run cypress:run
自动生成报告，在根目录下：mochawesome-report
2. junit-allure报告
1. 在cypress.json中加入如下配置
"reporter": "junit",
"reporterOptions": {
"mochaFile": "results/my-test-output[hash].xml", // 通过hash 标签区分不同文件的用例结果
"toConsole": true
}
2. run cypress ：
npm run cypress:run 会在根目录下生成results数据
3. 生成allure报告：
allure generate results --clean
4. 打开报告：
allure open allure-report
缺陷：报告没有图片
9. 环境切换
