定制目的

最近接口测试和UI自动化测试都有用到reportng来做测试报告的展示,发现了几个不是很方便的地方:

  • 报告没有本地化的选项
  • 主页的测试结果显示的不够清晰
  • 测试详情中的结果是按照名称排列的,想用执行顺序显示
  • 测试结果中添加日志

Reportng源码地址

添加日志

测试结果添加日志,直接在测试代码中添加Reporter.log("reportng日志显示");

显示在report的Log Output中的效果:



显示在report的详情中的效果:

本地化修改

获取源码,修改reportng.properties文件,reportng.properties中的内容是键值对,修改后面的值为中文即可。

passed=通过

修改测试结果顺序

需要修改TestResultComparator类,参考链接

class TestResultComparator implements Comparator<ITestResult> {
public int compare(ITestResult result1, ITestResult result2) {
// 按照名称排序显示
// return result1.getName().compareTo(result2.getName()); // 按照运行时间排序显示
int longresult2 = 0;
if (result1.getStartMillis() < result2.getStartMillis()) {
longresult2 = -1;
} else {
longresult2 = 1;
}
return longresult2;
}
}

主页添加饼图显示

主页的饼图用的是ichart开源图形组件.

主页的概括显示在overview.html.vm页面当中,先在文件中导入ichart组件。

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

添加饼图的标签

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

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

#if ($totalPassed > 0)
<td id="tpn" class="passed number">$totalPassed</td>
#else
<td id="tpn" class="zero number">0</td>
#end #if ($totalSkipped > 0)
<td id="tsn" class="skipped number">$totalSkipped</td>
#else
<td id="tsn" class="zero number">0</td>
#end #if ($totalFailed > 0)
<td id="tfn" class="failed number">$totalFailed</td>
#else
<td id="tfn" class="zero number">0</td>
#end

添加饼图显示的js代码

<script type='text/javascript'>
pcount=document.getElementById("tpn").innerHTML;
fcount=document.getElementById("tfn").innerHTML;
scount=document.getElementById("tsn").innerHTML;
$(function(){
var chart = iChart.create({
render:"ichart-render",
width:800,
height:400,
background_color:"#fefefe",
gradient:false,
color_factor:0.2,
border:{
color:"BCBCBC",
width:0
},
align:"center",
offsetx:0,
offsety:0,
sub_option:{
border:{
color:"#BCBCBC",
width:1
},
label:{
fontweight:500,
fontsize:11,
color:"#4572a7",
sign:"square",
sign_size:12,
border:{
color:"#BCBCBC",
width:1
}
}
},
shadow:true,
shadow_color:"#666666",
shadow_blur:2,
showpercent:false,
column_width:"70%",
bar_height:"70%",
radius:"90%",
subtitle:{
text:"",
color:"#111111",
fontsize:16,
font:"微软雅黑",
textAlign:"center",
height:20,
offsetx:0,
offsety:0
},
footnote:{
text:"",
color:"#111111",
fontsize:12,
font:"微软雅黑",
textAlign:"right",
height:20,
offsetx:0,
offsety:0
},
legend:{
enable:false,
background_color:"#fefefe",
color:"#333333",
fontsize:12,
border:{
color:"#BCBCBC",
width:1
},
column:1,
align:"right",
valign:"center",
offsetx:0,
offsety:0
},
coordinate:{
width:"80%",
height:"84%",
background_color:"#ffffff",
axis:{
color:"#a5acb8",
width:[1,"",1,""]
},
grid_color:"#d9d9d9",
label:{
fontweight:500,
color:"#666666",
fontsize:11
}
},
label:{
fontweight:500,
color:"#666666",
fontsize:11
},
type:"pie2d",
data:[
{
name:"通过",
value:pcount,
color:"#44aa44"
},{
name:"失败",
value:fcount,
color:"#ff4444"
},{
name:"跳过",
value:scount,
color:"#FFD700"
}
]
});
chart.draw();
});
</script>

饼图显示效果:

修改完后的代码地址

使用修改后的reportng

jar包下载

<!-- 依赖reportNg 关联testNg -->
<dependency>
<groupId>org.uncommons</groupId>
<artifactId>reportng</artifactId>
<version>1.1.5</version>
<scope>system</scope>
<exclusions>
<exclusion>
<groupId>org.testng</groupId>
<artifactId>testng</artifactId>
</exclusion>
</exclusions>
<systemPath>${project.basedir}/lib/reportng-1.1.5.jar</systemPath>
</dependency>
<dependency>
<groupId>velocity</groupId>
<artifactId>velocity</artifactId>
<version>1.4</version>
</dependency>

reportng定制修改的更多相关文章

  1. TFS中工作项的定制-修改面板

    上一篇文章我们讲到了<TFS 中工作项的订制-修改工作流>,工作流只要我们设计出来,就可以进行定制修改了.这次通过简单的案例,了解一下,工作项的面板如何定制.     1.软件准备     ...

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

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

  3. ReportNG测试报告的定制修改(二)

    上一篇文章修改了一些基本的ReportNG信息,链接:https://www.cnblogs.com/mrjade/p/9912073.html,本文将继续带大家进行修改,重点是添加饼图 1.修改测试 ...

  4. ReportNG测试报告的定制修改(一)

    目前笔者接触的自动化测试报告有两种,这两种都是开源的,第一种是ReportNG,第二种是ExtentReports,两种风格各异,ExtentReports自带饼图,页面很炫,但是我们今天讲的是Rep ...

  5. reportNG定制化之失败截图及日志

    先从github上拉下 reportNg的源代码 reportng  拉下源码后我们使用IDEA进行导入 1.reportng.properties 增加部分类表项 这里我们直接在末尾添加 log=L ...

  6. SpringBoot定制修改Servlet容器

    1.如何修改Servlet容器的相关配置: 第一种:在application.properties中修改和server有关的配置(ServerProperties提供): server.port=80 ...

  7. TFS 中工作项的定制-修改工作流

    我们都会用到TFS中的工作项.一般来说,最主要的会用到任务.bug这些工作流来进行项目管理里.但我们发现,实际上,有些模板中的工作流并不能完全符合我们的需要,因此我们会进行工作流的定制操作.下面就会通 ...

  8. Android9.0 SystemUI 网络信号栏定制修改

    前情提要 Android 8.1平台SystemUI 导航栏加载流程解析 9.0 改动点简要说明 1.新增 StatusBarMobileView 替代 SignalClusterView,用以控制信 ...

  9. SpringBoot Banner 图片定制修改

    启动Spring Boot项目的时候,在控制台会默认输出一个启动图案 这个图案如果你需要的话是可以自己修改的,修改方式很简单: 1. 在src/main/resources下新建一个banner.tx ...

随机推荐

  1. Angular2使用boostrap和ng-bootstrap总结

    Angular2使用bootstrap有几种方式,本文主要介绍两种方式进行Boostrap样式的使用: 一.直接通过静态文件的方式进行引入: 通过命令新建一个Bootstrap的工程 ng new B ...

  2. 关于Android Studio上得处女座福音功能——reformat code

    在mac上,选中需要的代码,然后 Option+(shift) + Command + L 全部重新排列!!爽飞!

  3. AngularJS:简介

    ylbtech-AngularJS:简介 1.返回顶部 1. AngularJS 简介 AngularJS 是一个 JavaScript 框架.它可通过 <script> 标签添加到 HT ...

  4. ITextSharp使用说明 (转)

    原文: http://www.cnblogs.com/LifelongLearning/archive/2010/12/28/1919138.html TextSharp是一个生成Pdf文件的开源项目 ...

  5. Dynamics CRM 2011 WebResources

    Type Limitation Capabilities Usage Images JPG,   PNG, GIF, ICO Custom entity icons Icons for custom ...

  6. mysql枚举类型与集合类型

    枚举类型与集合类型 字段的值只能在给定范围中选择,如单选框,多选框 enum 单选 只能在给定的范围内选一个值,如性别 sex 男male/女female set 多选 在给定的范围内可以选择一个或一 ...

  7. C Primer Plus学习笔记(十三)- 结构和其他数据形式

    建立结构声明 结构声明(structure declaration)描述了一个结构的组织布局 struct book { char title[MAXTITL]; char author[MAXAUT ...

  8. php代码执行漏洞

    php代码执行的两个函数eval(),assert() <?php $i = $_GET['x']; eval($i); ?> eval()函数将以php类型执行传入的参数x的值 给x传入 ...

  9. leetcode318

    public class Solution { public int MaxProduct(string[] words) { ) { ; } int len = words.Length; int[ ...

  10. vue中使用markdown富文本,并在html页面中展示

    想给自己的后台增加一个markdown编辑器,下面记录下引用的步骤 引入组件mavon-editor 官网地址:https://github.com/hinesboy/mavonEditor // 插 ...