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_samplecypress estpageloginPageCy.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_samplecypressintegration*** 
    可以实现执行冒烟用例和非冒烟用例选择性运行

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. 环境切换
原文地址:https://www.cnblogs.com/nieliangcai/p/12938474.html