茶水牛 发表于 2024-8-5 06:46:18

自动化测试平台设计与实现(五、用例执行的统计与展示)

基本思路:

[*]设计统计的数据内容:定义需要统计的数据内容,包括测试用例的执行结果。
[*]使用 Pyecharts 生成统计图表:在后端使用 Pyecharts 根据统计数据生成图表。
[*]将图表数据传输到前端:后端通过 API 将图表数据传输到前端。
[*]在 Vue.js 前端展示图表:在 Vue.js 前端项目中使用 Echarts 渲染图表。
1. 设计统计的数据内容

假设我们统计的数据内容包括:

[*]总用例数
[*]成功用例数
[*]失败用例数
[*]执行时间
[*]各用例的执行状态(成功、失败)
设计一个模型来存储测试用例执行结果,TestCaseResult 用于存储测试用例执行结果,ChartData 用于存储统计图表数据。
# models.py
from django.db import models

class TestCaseResult(models.Model):
    STATUS_CHOICES = (
      ('success', 'Success'),
      ('failure', 'Failure'),
    )

    case_id = models.CharField(max_length=100)
    status = models.CharField(max_length=10, choices=STATUS_CHOICES)
    execution_time = models.FloatField()
    executed_at = models.DateTimeField(auto_now_add=True)

    def __str__(self):
      return f"TestCase {self.case_id} - {self.status}"<br><br>class ChartData(models.Model): <br>  created_at = models.DateTimeField(auto_now_add=True) <br>  pie_chart = models.TextField() <br>  bar_chart = models.TextField() <br>  def __str__(self): <br>    return f"ChartData created at {self.created_at}"<br> 
2. 使用 Pyecharts 生成统计图表

通过视图中统计这些数据,在后端使用 Pyecharts 生成图表,将其保存到 ChartData 模型中
# views.py
from django.shortcuts import render
from django.http import JsonResponse
from .models import TestCaseResult, ChartData
from pyecharts.charts import Pie, Bar
from pyecharts import options as opts

def generate_charts():
    total_cases = TestCaseResult.objects.count()
    success_cases = TestCaseResult.objects.filter(status='success').count()
    failure_cases = TestCaseResult.objects.filter(status='failure').count()
    execution_times = list(TestCaseResult.objects.values_list('execution_time', flat=True))

    # 饼图
    pie = Pie()
    pie.add("", [("Success", success_cases), ("Failure", failure_cases)])
    pie.set_global_opts(title_opts=opts.TitleOpts(title="Test Case Results"))
    pie_html = pie.render_embed()

    # 柱状图
    bar = Bar()
    bar.add_xaxis()
    bar.add_yaxis("Execution Time (s)", execution_times)
    bar.set_global_opts(title_opts=opts.TitleOpts(title="Test Case Execution Times"))
    bar_html = bar.render_embed()

    return pie_html, bar_html

def save_chart_data():
    pie_html, bar_html = generate_charts()
    chart_data = ChartData(pie_chart=pie_html, bar_chart=bar_html)
    chart_data.save()
    return chart_data

def test_case_statistics(request):
    # 生成并保存图表数据
    chart_data = save_chart_data()
    return JsonResponse({
      "pie_chart": chart_data.pie_chart,
      "bar_chart": chart_data.bar_chart,
    }) 
3. 前端展示图表

在 Vue.js 前端通过 API 获取图表数据并展示
<template>

   
   

</template> 

来源:https://www.cnblogs.com/xiaojp65536/p/18342502
免责声明:由于采集信息均来自互联网,如果侵犯了您的权益,请联系我们【E-Mail:cb@itdo.tech】 我们会及时删除侵权内容,谢谢合作!
页: [1]
查看完整版本: 自动化测试平台设计与实现(五、用例执行的统计与展示)