Selenium 自定义自动化测试报告整理

发布时间：2024-11-27 00:27

测试后，遵循皮肤测试报告的建议调整护肤方案。 #生活技巧# #美容护肤技巧# #皮肤测试指南#

参考代码github地址：https://github.com/zhangfei19841004/ztest

原报告截图

修改后的报告截图

修改自动化报告

以下是之前写的自动化测试报告模板，所有的东西都是用excel来完成，作为一个秘籍恐惧症患者真的很恐惧，再次感谢https://github.com/zhangfei19841004/ztest 同学，可以用html的方式去呈现自动化报告，源码中的格式与自己写的报告格式不同，之前又学过一些html，jQuery的知识，这次正好用的上，嘻嘻！

简述一下逻辑，将csv文件中的数据读取出来，然后用重跑的用例针对之前的报错的进行更改，然后在将数据写到html文件中，然后就是一份自定义的自动化测试报告了。

执行开始时间2019/1/13 18:57执行结束时间2018/10/20 19:09 耗时（秒）0时12分31秒用例总数8 用例初始通过数4用例初始通过率50.00% 用例初始失败数4用例初始失败率50.00% 用例重跑后通过数6用例重跑通过率75.00% 用例重跑后失败数2用例重跑失败率25.00% 用例详细报告 SNG-001写信发送邮件1send_mail1TRUEsucceedSNG-002草稿箱发送邮件2send_mail2TRUEsucceedSNG-003订阅邮件发送邮件3send_mail3FALSEselenium.common.exceptions.NoSuchElementException: Message: Unable to locate element: {"method":"id","selector":"blog_nav_newpostxx"}SNG-004写信发送邮件4send_mail4TRUEsucceedSNG-005草稿箱发送邮件5send_mail5TRUEsucceedSNG-006写信发送邮件6send_mail6FALSEselenium.common.exceptions.NoSuchElementException: Message: Unable to locate element: {"method":"id","selector":"blog_nav_newpostxx"}SNG-007草稿箱发送邮件7send_mail7FALSEselenium.common.exceptions.NoSuchElementException: Message: Unable to locate element: {"method":"id","selector":"blog_nav_newpostxx"}SNG-008草稿箱发送邮件8send_mail8FALSEselenium.common.exceptions.NoSuchElementException: Message: Unable to locate element: {"method":"id","selector":"blog_nav_newpostxx"} 重跑的用例 SNG-003写信发送邮件3send_mail3TRUEsucceedSNG-006草稿箱发送邮件6send_mail6TRUEsucceedSNG-007草稿箱发送邮件7send_mail7FALSEselenium.common.exceptions.NoSuchElementException: Message: Unable to locate element: {"method":"id","selector":"blog_nav_newpostxx"}SNG-008订阅邮件发送邮件8send_mail8FALSEselenium.common.exceptions.NoSuchElementException: Message: Unable to locate element: {"method":"id","selector":"blog_nav_newpostxx"} 修改HTML

1、修改html部分，添加了多个要素，以及详细数据的“耗时”

</div>

</a>

</a>

</div>

<label class="col-sm-2 statistical control-label text-navy">执行开始时间 :</label>

</div>

<label class="col-sm-2 statistical control-label text-navy">执行结束时间 :</label>

</div>

</div>

</div>

<label class="col-sm-2 statistical control-label text-warning">用例初始通过数:</label>

</div>

<label class="col-sm-2 statistical control-label text-navy">用例初始通过率:</label>

</div>

<label class="col-sm-2 statistical text-error control-label text-navy">用例初始失败数:</label>

</div>

<label class="col-sm-2 statistical text-error control-label text-navy">用例初始失败率:</label>

</div>

<label class="col-sm-2 statistical control-label text-navy">用例重跑后通过数:</label>

</div>

<label class="col-sm-2 statistical control-label text-navy">用例重跑通过率:</label>

</div>

<label class="col-sm-2 statistical text-error control-label text-navy">用例重跑后失败数:</label>

</div>

<label class="col-sm-2 statistical text-error control-label text-navy">用例重跑失败率:</label>

</div>

</form>

</div>

</div>

</a>

</a>

</div>

</select>

</select>

</label>

</div>

<thead>

<tr>

</tr>

</thead>

</tbody>

</table>

</div>

修改的CSS部分

其中将原有的单列要素，修改为多列要素

.form-horizontal .form-group{

width: 40%;

float: left;

}

.statistical{

width: 40%;

}

.col-sm-5{

width: 60%;

}

.highly{

height: 35px;

}

.text-danger,.text-warning{

color: #1ab394;

}

.text-error{

color: #EF5352;

}

修改js部分

其中添加了多个数据的显示，将原有的报错信息数组类型，修改为字符串形式

function $childNode(o) {

return window.frames[o]

}

function animationHover(o, e) {

o = $(o), o.hover(function () {

o.addClass("animated " + e)

}, function () {

window.setTimeout(function () {

o.removeClass("animated " + e)

}, 2e3)

})

}

function WinMove() {

var o = "[class*=col]", e = ".ibox-title", i = "[class*=col]";

$(o).sortable({

handle: e,

connectWith: i,

tolerance: "pointer",

forcePlaceholderSize: !0,

opacity: .8

}).disableSelection()

}

var $parentNode = window.parent.document;

if ($(".tooltip-demo").tooltip({

selector: "[data-toggle=tooltip]",

container: "body"

}), $(".modal").appendTo("body"), $("[data-toggle=popover]").popover(), $(".collapse-link").click(function () {

var o = $(this).closest("div.ibox"), e = $(this).find("i"), i = o.find("div.ibox-content");

i.slideToggle(200), e.toggleClass("fa-chevron-up").toggleClass("fa-chevron-down"), o.toggleClass("").toggleClass("border-bottom"), setTimeout(function () {

o.resize(), o.find("[id^=map-]").resize()

}, 50)

}), $(".close-link").click(function () {

var o = $(this).closest("div.ibox");

o.remove()

}), top == this) {

}

</script>

var resultData = 这里写报告的数据

function clickRow(obj){

$("#detailBody").children("tr").attr("style","font-family: Consolas");

$(obj).attr("style","font-family: Consolas; background-color: #b0d877");

}

function details(obj) {

if ($(obj).text() == '展开') {

var len = $(obj).parent().parent().children().length;

var detailLog = "";

var logs = resultData["startResult"][parseInt($(obj).attr("buttonIndex"))]["log"];

$(obj).text("收缩");

$(obj).removeClass("btn-primary");

$(obj).addClass("btn-danger");

detailLog = detailLog + "<p>" + logs + "</p>";

console.log(detailLog);

$(obj).parent().parent().after("<tr><td colspan='" + len + "'><div style='font-family: Consolas;font-size:12px'>" + detailLog + "</div></td></tr>");

} else if ($(obj).text() == '收缩') {

$(obj).parent().parent().next().remove();

$(obj).text("展开");

$(obj).removeClass("btn-danger");

$(obj).addClass("btn-primary");

}

$(function () {

$("#startTime").text(resultData["startTime"]);

$("#endTime").text(resultData["endTime"]);

$("#executionTime").text(resultData["executionTime"]);

$("#listSum").text(resultData["listSum"]);

$("#passSum").text(resultData["passSum"]);

$("#Pass").text(resultData["Pass"]);

$("#fillSum").text(resultData["fillSum"]);

$("#Fill").text(resultData["Fill"]);

$("#passAllSum").text(resultData["passAllSum"]);

$("#startPass").text(resultData["startPass"]);

$("#startFillSum").text(resultData["startFillSum"]);

$("#startFill").text(resultData["startFill"]);

var classNames = [];

var results = [];

$.each(resultData["startResult"], function (i, n) {

if (classNames.indexOf(n["className"]) == -1) {

classNames.push(n["className"]);

}

if (results.indexOf(n["status"]) == -1) {

results.push(n["status"]);

}

});

$.each(classNames, function (i, n) {

$("#filterClass").append("<option value='" + n + "' hassubinfo='true'>" + n + "</option>");

});

$.each(results, function (i, n) {

$("#filterResult").append("<option value='" + n + "' hassubinfo='true'>" + n + "</option>");

});

$("#filterClass").chosen({search_contains: true});

$("#filterResult").chosen({search_contains: true});

function generateResult(className, caseResult) {

$("#detailBody").children().remove();

var filterAll = 0;

var filterOk = 0;

var filterFail = 0;

var filterSkip = 0;

$.each(resultData["startResult"], function (i, n) {

if ((className == "" || n["className"] == className) && (caseResult == "" || n["status"] == caseResult)) {

filterAll += 1;

var status = "";

if (n["status"] == 'TRUE') {

filterOk += 1;

status = "<td><span class='text-navy'>成功</span></td>";

} else if (n["status"] == 'FALSE') {

filterFail += 1;

status = "<td><span class='text-danger'>失败</span></td>";

} else {

status = "<td><span>" + n["status"] + "</span></td>";

}

var tr = "<tr style='font-family: Consolas'>" +

"<td>" + (i + 1) + "</td>" +

"<td>" + n["className"] + "</td>" +

"<td>" + n["methodName"] + "</td>" +

"<td>" + n["description"] + "</td>" +

status + "<td><button type='button' onclick='details(this)' buttonIndex='" + i + "' class='btn btn-primary btn-xs' style='margin-bottom: 0px'>展开</button></td></tr>"

$("#detailBody").append(tr);

}

});

$("#filterAll").text(filterAll);

$("#filterOk").text(filterOk);

$("#filterFail").text(filterFail);

$("#filterSkip").text(filterSkip);

}

generateResult("", "");

$("#filterClass").on('change', function () {

var className = $("#filterClass").val();

var caseResult = $("#filterResult").val();

generateResult(className, caseResult);

});

$("#filterResult").on('change', function () {

var className = $("#filterClass").val();

var caseResult = $("#filterResult").val();

generateResult(className, caseResult);

});

function pie() {

var option = {

title: {

text: '测试用例运行结果',

subtext: '',

x: 'center'

tooltip: {

trigger: 'item',

formatter: "{a} <br/>{b} : {c} ({d}%)"

legend: {

orient: 'vertical',

left: 'left',

data: ['失败', '成功']

series: [

{

name: '运行结果',

type: 'pie',

radius: '55%',

center: ['50%', '60%'],

data: [

{value: resultData["passAllSum"], name: '失败'},

{value: resultData["startFillSum"], name: '成功'}

itemStyle: {

emphasis: {

shadowBlur: 10,

shadowOffsetX: 0,

shadowColor: 'rgba(0, 0, 0, 0.5)'

}

]

};

var chart = echarts.init(document.getElementById("echarts-map-chart"));

chart.setOption(option);

}

pie();

});

</script>

数据读取

其中都是写死的，简直不忍直视，很尴尬

'''

Created on 2019年1月13日

@author: pinsengjiujiezhong

'''

with open('customerStatistical.csv','r') as fo:

lines = fo.readlines()

ReportList = []

for line in lines:

list = line.strip().split(',')

ReportList.append(list)

startTime = ReportList[0][1]

endTime = ReportList[0][3]

executionTime = ReportList[1][1]

listSum = ReportList[2][1]

passSum = ReportList[3][1]

Pass = ReportList[3][3]

fillSum = ReportList[4][1]

Fill = ReportList[4][3]

passAllSum = ReportList[5][1]

startPass = ReportList[5][3]

startFillSum = ReportList[6][1]

startFill = ReportList[6][3]

startResult = []

endResult = []

IntegrationReport = []

for list in ReportList:

if list[0] == u'用例详细报告':

startIndex = ReportList.index(list)

elif list[0] == u'重跑的用例':

endIndex = ReportList.index(list)

for Report in ReportList[startIndex+1:endIndex-1]:

Result = {'className' : Report[1],

'methodName' : Report[2],

'description' : Report[3],

'status' : Report[4],

'log' : Report[5],}

startResult.append(Result)

for Report in ReportList[endIndex+1:-1]:

Result = {'className' : Report[1],

'methodName' : Report[2],

'description' : Report[3],

'status' : Report[4],

'log' : Report[5],}

endResult.append(Result)

for start in startResult:

for end in endResult:

if start['description'] == end['description']:

start = end

break

IntegrationReport.append(start)

Result = {'startTime' : startTime,

'endTime' : endTime,

'executionTime' : executionTime,

'listSum' : listSum,

'passSum' : passSum,

'Pass' : Pass,

'fillSum' : fillSum,

'Fill' : Fill,

'passAllSum' : passAllSum,

'startPass' : startPass,

'startFillSum' : startFillSum,

'startFill' : startFill,

'startResult' : startResult,

'endResult' : endResult,

'IntegrationReport' : IntegrationReport}

import json

Result = json.dumps(Result)

with open('template','rb') as fo:

lines = fo.read()

fo.close()

lines = lines.replace(b'Edit_resultData',Result.encode('utf-8'))

with open('test.html','wb') as fo:

fo.write(lines)

fo.close()

在学了1个月vue后，强行将js所用的jQuery编写的部分改成了vue来渲染页面，真的是强行变更的，很勉强，其中需要替换2个数据resultDict、items

</div>

</a>

</div>

</div>

</form>

</div>

</div>

</transition>

</div>

</a>

</div>

<option :value="itemType" v-for="(itemType,index) in itemTypes" :key="index">{{itemType}}</option>

</select>

<option value="FALSE">False</option>

</select>

<span class="text-navy">用例数: </span><span class="text-navy b-r" id="filterAll">{{filterAll}}</span><span> | </span>

<span style="color: green">成功: </span><span style="color: green" id="filterOk">{{filterOk}}</span><span> | </span>

<span class="text-danger">失败: </span><span class="text-danger" id="filterFail">{{filterFill}}</span>

</label>

</div>

<thead>

<tr>

<tr >

<td width="4%">{{index + 1}}</td>

<td width="6%">{{result.className}}</td>

<td width="10%">{{result.methodName}}</td>

<td width="10%">{{result.description}}</td>

<span class="text-navy">{{result.status}}</span>

</td>

<button type="button" buttonindex="0" class="btn btn-xs btn-danger" style="margin-bottom: 0px"

@click="reportShowClick($event)">{{reportShow?"显示日志":"隐藏日志"}}</button>

<div class="isShowLog" style="width: 100%;">{{result.log}}</div>

</td>

</tr>

</thead>

</tbody>

</table>

</div>

Vue.prototype.$echarts = echarts

const vm = new Vue({

el : '#app',

data:{

Boolean : "全部",

classItem : "全部",

resultDict : [

{

'className': '写信',

'methodName': '发送邮件1',

'description': 'send_mail1',

'status': 'TRUE',

'log': 'succeed'

}, {

'className': '草稿箱',

'methodName': '发送邮件2',

'description': 'send_mail2',

'status': 'TRUE',

'log': 'succeed'

}, {

'className': '订阅邮件',

'methodName': '发送邮件3',

'description': 'send_mail3',

'status': 'FALSE',

'log': '"selenium.common.exceptions.NoSuchElementExceptiselenium.common.exceptions.NoSuchElementExceptiselenium.common.exceptions.NoSuchElementExceptiselenium.common.exceptions.NoSuchElementExceptiselenium.common.exceptions.NoSuchElementExceptiselenium.common.exceptions.NoSuchElementExceptiselenium.common.exceptions.NoSuchElementExceptiselenium.common.exceptions.NoSuchElementExceptiselenium.common.exceptions.NoSuchElementExceptiselenium.common.exceptions.NoSuchElementExceptiselenium.common.exceptions.NoSuchElementExceptiselenium.common.exceptions.NoSuchElementExceptiselenium.common.exceptions.NoSuchElementExceptiselenium.common.exceptions.NoSuchElementExceptiselenium.common.exceptions.NoSuchElementExceptiselenium.common.exceptions.NoSuchElementException: Message: Unable to locate element: {""method"":""id""'

}, {

'className': '写信',

'methodName': '发送邮件4',

'description': 'send_mail4',

'status': 'TRUE',

'log': 'succeed'

}, {

'className': '草稿箱',

'methodName': '发送邮件5',

'description': 'send_mail5',

'status': 'TRUE',

'log': 'succeed'

}, {

'className': '写信',

'methodName': '发送邮件6',

'description': 'send_mail6',

'status': 'FALSE',

'log': '"selenium.common.exceptions.NoSuchElementException: Message: Unable to locate element: {""method"":""id""'

}

items : [

['执行开始时间','2018/10/20 18:57'],

['执行结束时间','2018/10/20 19:09'],

['耗时（秒）','0时12分31秒'],

['用例总数','6'],

['用例初始通过数','3'],

['用例初始通过率','50.00%'],

['用例初始失败数','3'],

['用例初始失败率','50.00%'],

['用例重跑后通过数','4'],

['用例重跑通过率','66.67%'],

['用例重跑后失败数','2'],

['用例重跑失败率','33.33%'],

reportShow : true,

activeNames: ['1']

computed :{

itemTypes(){

const Arr = []

this.resultDict.forEach((result)=>{

if(!Arr.includes(result.className)){

Arr.push(result.className)

}

})

return Arr

filterAll(){

return this.items[3][1]

filterOk(){

if(this.items[8]){

return this.items[8][1]

}else{

return this.items[4][1]

}

filterFill(){

if(this.items[10]){

return this.items[10][1]

}else{

return this.items[6][1]

}

itemBoolT(){

const items = this.resultDict

return items.reduce((totalCount,item) => totalCount + (item.status==="TRUE"?1:0),0)

itemBoolF(){

return this.resultDict.length - this.itemBoolT

Integrations(){

const Integrations = this.resultDict

return Integrations.filter((item)=>{

return (item.className === this.classItem || this.classItem === "全部") && (item.status === this.Boolean || this.Boolean === "全部")

})

}

mounted(){

this.drawLine()

methods:{

reportShowClick(event){

let divChild = event.target.parentNode.lastChild

divChild.className = divChild.className?"":"isShowLog"

drawLine () {

let bardv = this.$refs.myChart

let myChart = this.$echarts.init(bardv)

myChart.setOption({

title : {

text: 'web自动化测试报告',

subtext: '杨凯自写',

x:'center'

tooltip : {

trigger: 'item',

formatter: "{a} <br/>{b} : {c} ({d}%)"

legend: {

orient: 'vertical',

left: 'left',

data: ['true','false']

series : [

{

name: '自动化用例',

type: 'pie',

radius : '70%',

center: ['50%', '60%'],

data:[

{value:this.itemBoolT, name:'true'},

{value:this.itemBoolF, name:'false'},

itemStyle: {

emphasis: {

shadowBlur: 10,

shadowOffsetX: 0,

shadowColor: 'rgba(0, 0, 0, 0.5)'

}

]

})

}

})

</script>

</body>

网址：Selenium 自定义自动化测试报告整理 https://www.yuejiaxmz.com/news/view/284717

上一篇：差分进化算法求函数y(x,y)=

下一篇：scikit

Selenium 自定义自动化测试报告整理

修改自动化报告

相关内容

随便看看

最新动态分享

热点动态分享

专题

推荐动态分享