• 2
  • 1
分享

      前言

  • Cypress 的测试报告模块脱胎于 Mocha 的测试报告,故任何 Mocha 支持的测试报告均可直接用于 Cypress。

  • 下面将利用 Cypress-example 提供的 web 应用程序作为例子,需要先启动本地服务。

      进入被测应用 logging-in__html-web-forms 的目录

C:\Users\user\Desktop\py\cypress-example-recipes\examples\logging-in__html-web-forms

      启动本地服务

npm start

      启动成功后,cmd窗口将显示服务器的地址和端口图1.png

      内置的测试报告

      内置的测试报告包括 Mocha 的内置测试报告和直接嵌入在 Cypress 中的测试报告,主要有以下几种:

  • spec 格式报告

  • json 格式报告

  • junit 格式报告

      准备工作

      确保  package.json  文件的 scripts 模块加入了如下键值对  "cypress:run":"cypress run" 

  • cypress run  是以无头浏览器模式跑测试用例文件夹下的所有测试用例

  • cypress open  会打开测试用例集的界面,需要手动运行

      spec 格式报告

      简介

      spec 格式是 Mocha 的内置报告,它的输出是一个嵌套的分级视图

      如何使用

      在 Cypress 中使用 spec 格式的报告非常简单,在命令行运行时加上 --reporter=spec 

      运行测试

      进入 Cypress 安装的目录,cmd敲

yarn cypress:run --reorter=spec

      运行完成后,测试报告如下图

图2.png

      json 格式报告

      简介

      json 测试报告格式将输出一个大的 JSON 对象

      如何使用

      在 Cypress 中使用 json 格式的报告非常简单,在命令行运行时加上  --reporter=json 

      运行测试

      进入 Cypress 安装的目录,cmd敲

yarn cypress:run --reporter=json --reporter-options "toConsole=true"

      运行完成后,测试报告如下图

图3.png

      junit 格式报告

      简介

      junit 测试报告格式将输出一个 xml 文件

      如何使用

      在 Cypress 中使用 xml 格式的报告非常简单,在命令行运行时加上   --reporter=junit 

      运行测试

      进入 Cypress 安装的目录,cmd敲

yarn cypress:run --reporter junit --reporter-options
 "mochaFile=results/test_output.xml,toConsole=true"

      运行完成后,测试报告如下图

图4.png

      自定义的测试报告

      除了内置的测试报告,Cypress 也支持用户自动以报告格式

      Mochawesome 报告介绍

  • Mochawesome 是与 JavaScript 测试框架 Mocha 一起使用的自定义报告程序,它运行在 Node.js(≥8)上

  • 并与 mochawesome-report-generatir 结合使用生成独立的 HTML/CSS 报告,以帮助可视化测试运行

      在 Cypress 中使用 Mochawesome 报告的步骤

      第一步

  • 将 Mocha、Mochawesome 添加至项目中(看下面命令)

npm install --save-dev mocha
npm install --save-dev mochawesome

      注意坑

  • 先看看 node_modules 目录下是否有 mocha 文件夹,如果有直接装 mochawesome

  • 如果安装 mocha 失败,出现很古怪的错误,譬如 mkdirp 版本不行(如:  mkdirp@0.5.1: Legacy versions of mkdirp are no longer supported. Please update to mkdirp 1.x.  )

  • 尝试先 update mkdirp 库,如果也报错,则 uninstall mkdirp 库,如果仍然报错;则把 Cypress 目录下的 node_modules 整个文件夹删掉,重新执行 npm install ,大概率可以解决问题了(别问我怎么知道这些坑...)

      第二步

  • 进入 Cypress 安装目录,cmd执行下面命令

yarn cypress:run --reporter mochawesome

      运行完成后,可以看到下图
图5.png

      测试报告文件夹 mochawesome-report 会生成在项目根目录下

图6.png

图7.png

      点击 html 查看可视化报告

图8.png

      用户自定义报告的步骤

      第一步:配置 reporter 选项

  • cypress.json  文件中配置  reporter 选项,指定 reporter 文件位置

  • 在本例子中,把 reporter 定义在 custom_reporter.js 文件中

      第二步:编写自定义报告文件

  • 进入 Cypress 安装目录下的 cypress 目录下(本案例在:C:\Users\user\Desktop\py\MyCypress\cypress )

  • 创建 reporter 文件夹,然后创建一个 custom_reporter.js 文件

  • 写以下代码(此自定义报告扩展了内置报告,仅更改了成功的显示样式)

var mocha = require('mocha');
module.exports = MyReporter;
function MyReporter(runner) {    
     mocha.reporters.Base.call(this, runner)    
     var passes = 0    
     var failures = 0
    
    runner.on('pass', function (test) {        
        passes++        
        console.log('pass:%s', test.fullTitle())    
    })    
    
    runner.on('fail', function (test, err) {        
        failures++        
        console.log('fail:%s -- error:%s', test.fullTitle(), err.message)    
    })    
    
    runner.on('end', function () {        
        console.log('用户自定义报告:%d/%d', passes, passes + failures)    
    })
}

      第三步:运行测试

      进入 Cypress 安装目录,cmd敲下面命令

yarn cypress:run --reporter ../cypress/reporters/custom_reporter.js

      运行完成后,测试报告如下图

图9.png

      生成混合测试报告

      前言

  • Cypress 除了支持单个测试报告,还支持混合测试报告

  • 老板或者管理者一般都喜欢看到多种不一样样式的报告,比如测试在 CI 中运行时,又想生成 junit 格式的报告,又想在运行时实时看到测试输出

  • Cypress 官方推荐使用 mocha-multi-reporters 来生成混合测试报告(https://github.com/stanleyhlng/mocha-multi-reporters)

      使用 mocha-multi-reporters 的测试步骤

      第一步:安装所需库

npm install --save-dev mocha-multi-reporters mocha-junit-reporter

      第二步:创建 json 文件

      在 cypress/reporters 文件夹下,创建一个 custom.json 文件,增加如下内容:

{  
   "reporterEnabled": "spec,json, mocha-junit-reporter",  
   "reporterOptions": {    
     "mochaFile": "cypress/results/results-[hash].xml"  
   }
}

      第三步:运行测试

      进入 Cypress 安装目录,cmd敲下面命令

yarn cypress run --reporter mocha-multi-reporters  --reporter-options 
configFile=cypress/reporters/custom.json --spec cypress/integration/testLogin.js

      运行完成后,测试报告如下图

图10.png

      测试报告文件夹 results 会生成在 Cypress安装路径/cypress  目录下

图12.png


      总结

      当我们运行完一次测试(可能包含多个 spec),我们更希望看到一个完整的测试报告文件,而不是分开的独立文件。

      特别对于 HTML 格式报告来说,整合到同一个 HTML 报告中是更加直观的。

      Cypress 为了解决此问题也提供了高阶的方法,将在后续的 Cypress 进阶部分进行详细介绍。


作者:小菠萝

来源:51Testing软件测试网原创

  • 【留下美好印记】
    赞赏支持
登录 后发表评论
+ 关注

热门文章

    最新讲堂

      • 推荐阅读
      • 换一换
          • 前言       作为一名曾在京东做过软测岗面试官的人,笔者将从面试技巧以及软件测试面试题层面,分享出自己在面试的时候最常问的那些问题及面试官希望听到的回答!一、简述负载测试与压力测试的区别       压力测试(Stress Testing)       压力测试的主要任务就是获取系统正确运行的极限,检查系统在瞬间峰值负荷下正确执行的能力。例如,对服务器做压力测试时就可以增加并发操作的用户数量;或者不停地向服务器发送请求;或一次性向服务器发送特别大的数据等。看看服务器保持正...
            0 0 1283
            分享
          •   据台湾《经济日报》,特斯拉正在增加 Dojo D1 超级计算机芯片的订单。Dojo D1 是特斯拉专门为 Dojo 超级计算机设计的定制芯片,由台积电代工。  知情人士透露,特斯拉计划明年将 Dojo D1 芯片的产量增加一倍,达到 1 万片。预计到 2025 年,台积电代工的 Dojo D1 芯片订单量将持续增加,考虑到 Dojo 超级计算机的可扩展性。  特斯拉使用 Dojo 超级计算机训练高级驾驶辅助系统和完全自动驾驶系统的人工智能模型。随着 FSD、自动驾驶出租车和 Optimus 机器人等项目的推出,Dojo 超级计算机对公司运营的贡献可能会更大。  特斯拉增加 Dojo D1 ...
            0 0 1035
            分享
          •   一、简介  我的jdk是1.8 Jmeter版本是3.3 其它可能会有冲突 导致不能正确安装 jdk和jmeter会有对应版本,大家注意。  二、打开Jmeter  在安装jmeter里面的bin目录下双击jmeter.bat文件即可本地启动。  三、添加虚拟用户组  入下图所示,右击“测试计划”,添加-Theard-线程组。 线程组:JMeter是由Java实现的,并且使用一个Java线程来模拟一个用户,因此线程组就是指一组用户的意思,这些虚拟用户用来模拟访问被测系统。  四、线程组常用设置  线程数:虚拟用户数,默认的输入是1,表明一个用户访问被测系统,如果想模拟100个用户...
            0 0 1297
            分享
          • 网上收集到的一些有关Selenium自动化相关的面试,给出的答案仅供参考。1.Selenium中用什么函数判断元素是否存在?isElementPresent2.Selenium中hidden或者是display = none的元素是否可以定位到?不能,可以写JavaScript将标签中的hidden先改为0,再定位元素3.Selenium中如何保证操作元素的成功率?也就是说如何保证我点击的元素一定是可以点击的?添加元素智能等待时间 driver.implicitly_wait(30)添加强制等待时间(比如python中写 sleep)try 方式进行 id,name,clas,x path, ...
            1 1 1311
            分享
          • 前言下面将详细说说微信小程序如何发布体验版(测试环境)和线上版(生产环境)小程序如何打包1、打开微信开发者工具,并使用微信扫码登录2、打开已经编写好的小程序代码项目3、当代码编写完成后,点击上传4、上传完成后,登录微信公众平台,点击版本管理,刚刚打包上传的版本就是最新的体验版5、如果需要将体验版转为线上版本,那么就点击体验版的提交审核按钮,补充审核资料即可6、体验版审核成功后,会出现在审核版本上,点击审核版本的发布生产,即可将此版本转为线上版本,此时在微信就可以搜出最新的生产环境的小程序了作者:Boale_H原文链接:https://blog.csdn.net/Boale_H/article/...
            0 0 5653
            分享
      • 51testing软件测试圈微信