背景:偶然看到一个人的自动化框架的测试报告好漂亮,心痒痒,今天弄了一下午,还是不行,结果到现在就现在,我特么成功了,不为什么

Mark一下:

本地化修改

获取源码,修改reportng.properties文件,reportng.properties中的内容是键值对,修改后面的值为中文即可。其他视情况做改变。

  1. passed=通过

修改测试结果顺序

需要修改TestResultComparator类,参考链接

  1. class TestResultComparator implements Comparator<ITestResult> {
  2. publicintcompare(ITestResult result1, ITestResult result2) {
  3. // 按照名称排序显示
  4. // return result1.getName().compareTo(result2.getName());
  5. // 按照运行时间排序显示
  6. int longresult2 = 0;
  7. if (result1.getStartMillis() < result2.getStartMillis()) {
  8. longresult2 = -1;
  9. } else {
  10. longresult2 = 1;
  11. }
  12. return longresult2;
  13. }
  14. }

主页添加饼图显示

主页的饼图用的是ichart开源图形组件.
主页的概括显示在overview.html.vm页面当中,先在文件中导入ichart组件。

title标签下

  1. <script src='http://www.ichartjs.com/ichart.latest.min.js'></script>

添加饼图的标签<h1>下

  1. <div id='ichart-render'></div>

给通过总数,失败总数和跳过总数添加id属性

<td class="passRate suite">之前添加,找到#if($totalPassed>0),为td标签,添加id属性,如下:

  1. #if ($totalPassed > 0)
  2. <td id="tpn" class="passed number">$totalPassed</td>
  3. #else
  4. <td id="tpn" class="zero number">0</td>
  5. #end
  6. #if ($totalSkipped > 0)
  7. <td id="tsn" class="skipped number">$totalSkipped</td>
  8. #else
  9. <td id="tsn" class="zero number">0</td>
  10. #end
  11. #if ($totalFailed > 0)
  12. <td id="tfn" class="failed number">$totalFailed</td>
  13. #else
  14. <td id="tfn" class="zero number">0</td>
  15. #end

添加饼图显示的js代码

  1. <script type='text/javascript'>
  2. pcount=document.getElementById("tpn").innerHTML;
  3. fcount=document.getElementById("tfn").innerHTML;
  4. scount=document.getElementById("tsn").innerHTML;
  5. $(function(){
  6. var chart = iChart.create({
  7. render:"ichart-render",
  8. width:800,
  9. height:400,
  10. background_color:"#fefefe",
  11. gradient:false,
  12. color_factor:0.2,
  13. border:{
  14. color:"BCBCBC",
  15. width:0
  16. },
  17. align:"center",
  18. offsetx:0,
  19. offsety:0,
  20. sub_option:{
  21. border:{
  22. color:"#BCBCBC",
  23. width:1
  24. },
  25. label:{
  26. fontweight:500,
  27. fontsize:11,
  28. color:"#4572a7",
  29. sign:"square",
  30. sign_size:12,
  31. border:{
  32. color:"#BCBCBC",
  33. width:1
  34. }
  35. }
  36. },
  37. shadow:true,
  38. shadow_color:"#666666",
  39. shadow_blur:2,
  40. showpercent:false,
  41. column_width:"70%",
  42. bar_height:"70%",
  43. radius:"90%",
  44. subtitle:{
  45. text:"",
  46. color:"#111111",
  47. fontsize:16,
  48. font:"微软雅黑",
  49. textAlign:"center",
  50. height:20,
  51. offsetx:0,
  52. offsety:0
  53. },
  54. footnote:{
  55. text:"",
  56. color:"#111111",
  57. fontsize:12,
  58. font:"微软雅黑",
  59. textAlign:"right",
  60. height:20,
  61. offsetx:0,
  62. offsety:0
  63. },
  64. legend:{
  65. enable:false,
  66. background_color:"#fefefe",
  67. color:"#333333",
  68. fontsize:12,
  69. border:{
  70. color:"#BCBCBC",
  71. width:1
  72. },
  73. column:1,
  74. align:"right",
  75. valign:"center",
  76. offsetx:0,
  77. offsety:0
  78. },
  79. coordinate:{
  80. width:"80%",
  81. height:"84%",
  82. background_color:"#ffffff",
  83. axis:{
  84. color:"#a5acb8",
  85. width:[1,"",1,""]
  86. },
  87. grid_color:"#d9d9d9",
  88. label:{
  89. fontweight:500,
  90. color:"#666666",
  91. fontsize:11
  92. }
  93. },
  94. label:{
  95. fontweight:500,
  96. color:"#666666",
  97. fontsize:11
  98. },
  99. type:"pie2d",
  100. data:[
  101. {
  102. name:"通过",
  103. value:pcount,
  104. color:"#44aa44"
  105. },{
  106. name:"失败",
  107. value:fcount,
  108. color:"#ff4444"
  109. },{
  110. name:"跳过",
  111. value:scount,
  112. color:"#FFD700"
  113. }
  114. ]
  115. });
  116. chart.draw();
  117. });
  118. </script>

饼图显示效果:

reportng之测试报告升级美化的更多相关文章

  1. Hexo博客Next v7.X 主题升级,美化警示录

    本文转载于:Hexo博客Next v7.X 主题升级,美化警示录丨奥怪的小栈 前言 经历了好几天(懒癌晚期懒得数了)的与主题升级斗争后,我终于完成基本上完成了next主题的升级!升到了V7.3!哈哈哈 ...

  2. Mac Eclipse+Maven+TestNg+ReportNg 生成测试报告

    TestNG 是java 的单元测试框架,功能很强大,很方便,但是自动生成的测试报告有待改善,可以使用TestNg 自带的TestNG_xslt更改TestNG报告的样式,这里主要讲解ReportNg ...

  3. Reportng 的测试报告在 Jenkins 中显示不全

    通过Jenkins执行接口测试生成测试报告,用Jenkins的web服务打开html显示不全. 环境: Jenkins版本:1.651.2 Jenkins发布在mac上面 使用的是testng管理测试 ...

  4. Idea+maven+testng+reportng生成测试报告

    TestNG自带的测试报告不是很好用,所以一般结合reportng生成美观的测试报告. 首先,在pom.xml中添加testng和reportng相关依赖 <dependencies> & ...

  5. TestNG之使用ReportNG生成测试报告

    TestNG使用ReportNG生成测试报告会更加美观. 依赖包 <!--testNG报告依赖包--> <dependency> <groupId>org.test ...

  6. Eclipse+Maven+TestNg+ReportNg 生成测试报告

    http://blog.csdn.net/a542551042/article/details/46729585

  7. ReportNg 测试报告的定制修改【转】

    前言 前段时间在Testerhome上面看到了测试报告生成系列之-------如何用 testNG 生成测试报告 简单的描述了一些测试报告的生成,接着有人在评论中回复说可以针对reportNg的测试报 ...

  8. testng + reportng 测试结果邮件发送

    https://blog.csdn.net/qq744746842/article/details/51497506 其实大多数的时候我们的测试报告的发送可能都是结合Jenkins发送的,所以这方面更 ...

  9. Allure--自动化测试报告生成

    之前尝试使用过testNG自带的测试报告.优化过reportNG的测试报告,对这两个报告都不能满意.后经查找资料,发现有个神器: Allure(已经有allure2了,笔者使用的就是allure2), ...

随机推荐

  1. Mac OS X使用简介

    一.OS X 版本以大型猫科动物命名 10.0   猎豹(Cheetah) 10.1   美洲狮(Puma) 10.2   美洲虎(Jaguar) 10.3   黑豹(Panther) 10.4   ...

  2. Thinkphp3.2 入口绑定问题记录

    // 应用入口文件 // 检测PHP环境if(version_compare(PHP_VERSION,'5.3.0','<')) die('require PHP > 5.3.0 !'); ...

  3. MYSQL 解决中文字符集乱码问题的方法

    修改 /etc/mysql/my.cnf 增加内容 [client] default-character-set = utf8mb4 [mysql] default-character-set = u ...

  4. Easy-UI开发总结

    Easy-UI开发总结 jQuery EasyUI 简介 jQuery EasyUI 是一个基于 jQuery 的框架,集成了各种用户界面插件. 什么是 jQuery EasyUI jQuery Ea ...

  5. 【转】maven常用插件介绍

    我们都知道Maven本质上是一个插件框架,它的核心并不执行任何具体的构建任务,所有这些任务都交给插件来完成,例如编译源代码是由maven- compiler-plugin完成的.进一步说,每个任务对应 ...

  6. HGOI20180831 NOIP2018模拟

    input1: 4 4 4 4 4 3 2 4 5 4 5 5 5 1 7 3 2 output1: Yes Yes Yes No 好的吧数学题QwQ考场上没人做出来qwq 就是判断两个矩形能否互相放 ...

  7. kubernetes1.8开启swagger-ui

    现在的版本默认只开启了6443安全端口,需要证书验证才能访问api,实现起来稍微有点麻烦,这里提供一个简单的方法. 先来看看官方说明: Complete API details are documen ...

  8. 解题:SHOI 2006 有色图

    题面 本质上是在对边求置换,然后每个循环里涂一样的颜色,但是还是要点上入手,考虑每条边的两个端点是否在一个循环里 如果在一个循环里,那么当循环长度$len$为奇数时只有转一整圈才行,而边的总数是$\f ...

  9. 各种蕴含算法思想的DP - 2

    study from: https://www.cnblogs.com/flashhu/p/9480669.html 3.斜率dp study from:http://www.cnblogs.com/ ...

  10. Qt ------ UDP发送不了或接收不到问题

    1.禁用不需要的网卡,比如禁用虚拟机网卡. 2.向所有网卡广播数据 /* * 直接调用 QUdpSocket 的 writeDatagram() 函数发送数据,如果有多张网卡(装了虚拟机会增加网卡), ...