[Python]如何使用HtmlTestRunner讓自動化測試報告內容更豐富

 

簡述

         使用selenium webdriver + Python作自動化測試，執行完成後要生成測試報告，Python咱們使用的HTMLtestrunner 進行生成，可是默認提供的生成報告內容，並不能知足咱們的需求，怎麼才能讓測試報告數據更清晰，內容更豐富呢。對於一些人來講，可能已經重寫了報告生成方式，放棄使用HTMLtestrunner。可是對於python小白可能還作不到，只能用現有東西進行展現，那麼下面簡單介紹經過修改HTMLtestrunner去實現想要的內容。

 

先經過兩張圖片對比一下咱們將要實現的功能：

 

圖表 1

 

圖表 2

         如圖所示，圖表1是原始樣式輸出，圖表2是修改後樣式輸出。經過對比咱們能夠看到，圖表2比圖表1多了首位部的兩列。我在第一行加caseid，用來記錄用例的編號，最後一列，添加了每個用例執行過程當中關鍵步驟的截圖快照。

這樣作的好處：

1. 有了用例編號咱們能夠經過用例ID進行對用例的定位，尤爲是對失敗用例的定位。
2. 有了用例執行過程當中關鍵位置截圖快照，對於失敗或者出錯異常的用例，在無人值守狀況下進行執行用例時，能夠進行界面追蹤。

實現

下面來介紹怎麼實現的，首先先說一下我實現的思路。對於這個咱們的測試報告而言，我只想調整一下他的展現樣式，豐富兩列內容。因此先去想怎麼去把他的樣式給修改了。而後再往修改後的樣式表格裏面添加數據。

也就是分兩步作：

         1改樣式

         2加數據

改樣式

改樣式，這裏只須要會基礎的HTML <table>中行、列標識就能夠了。

咱們要在界面中加兩列，那麼很簡單，就是加兩個<td></td>就能夠了。

看源碼部分：

從395行左右開始就是存儲HTML代碼展現的部分，找到table標籤和第一行列頭展現內容。

腳本片斷1:

REPORT_TMPL = 「」」  ……   「」」 代碼段裏面包含了<table>的結構內容

如：

<table id='result_table'>

<colgroup>

<col align='left' />

<col align='right' />

<col align='right' />

<col align='right' />

<col align='right' />

<col align='right' />

</colgroup>

<tr id='header_row'>

    <td colspan='2'>Test Group/Test case</td>

    <td>Count</td>

    <td>Pass</td>

    <td>Fail</td>

    <td>Error</td>

<td>View</td>

<td>Screenshot</td>

</tr>

%(test_list)s

<tr id='total_row'>

    <td colspan='2'>Total</td>

    <td>%(count)s</td>

    <td>%(Pass)s</td>

    <td>%(fail)s</td>

    <td>%(error)s</td>

    <td>&nbsp;</td>

    <td>&nbsp;</td>

</tr>

</table>

 

table標籤中的第一個<tr>就是第一行，<tr>中的每個<td></td>表明一列。標籤中間的文本是直接顯示在界面的。

 

<tr id='header_row'>

         <td colspan='2'>Test Group/Test case</td>   //這裏添加colspan='2' 是合併2個列。由於下面的行中的caseid須要佔一列，可是標題列頭部分顯示是一個總體，因此作了合併

         <td>Count</td>

    <td>Pass</td>

    <td>Fail</td>

    <td>Error</td>

<td>View</td>

<td>Screenshot</td>    //圖片快照的列頭標題

</tr>

 

腳本片斷2：

REPORT_CLASS_TMPL = 「」」 … 「」」代碼段 是 展現calss的行，能夠叫作測試模塊的類，它是單獨放在一行中的，每一個模塊一行。由於要跟上面的第一行標題中的列數對應，因此修改以下：

<tr class='%(style)s'>

    <td>case_id</td>    //添加的caseid 的標題，這一行不在主列頭，而是放在測試模塊用例統計所在的行裏面。

    <td>%(desc)s</td>

    <td>%(count)s</td>

    <td>%(Pass)s</td>

    <td>%(fail)s</td>

    <td>%(error)s</td>

    <td><a href="javascript:showClassDetail('%(cid)s',%(count)s)">Detail</a></td>

    <td>&nbsp;</td>  //保持列數統一，加入空白列

</tr>

 

 

腳本片斷3：

REPORT_TEST_WITH_OUTPUT_TMPL = 「」」 … 「」」 是測試用例展現部分代碼，這段內容是展開測試模塊後進行顯示的

 

   

 REPORT_TEST_WITH_OUTPUT_TMPL = r"""

<tr id='%(tid)s' class='%(Class)s'>

    <td  align='center'>%(caseid)s</td>    //%(caseid)s 是python轉譯html代碼中變量替換方式。caseid 會在python腳本中定義。

    <td class='%(style)s'><div class='testcase'>%(desc)s</div></td>

    <td colspan='5' align='center'>

 

    <!--css div popup start-->

    <a class="popup_link" onfocus='this.blur();' href="javascript:showTestDetail('div_%(tid)s')" >

        %(status)s</a>

 

    <div id='div_%(tid)s' class="popup_window">

        <div style='text-align: right; color:red;cursor:pointer'>

        <a onfocus='this.blur();' onclick="document.getElementById('div_%(tid)s').style.display = 'none' " >

           [x]</a>

        </div>

        <pre>

        %(script)s

        </pre>

    </div>

    <!--css div popup end-->

    </td>

    <td align='center'>

    <a href="%(image)s" title="%(image)s">  //這一列內容加入圖片快照的連接訪問路徑 %(image)s 中替換連接地址

    <img src="..\data\img.png" height=20 width=20 border=0 /></a>  //連接圖標

    </td>

</tr>

 

 

單從HTML界面樣式展現來看，上面全部代碼段中修改都是在每一個<tr>加入兩個<td></td>。

 

這樣咱們的樣式就改完了。而後開始加入數據。

加數據

先想一下咱們要加什麼數據.從樣式中看咱們增長了兩個列，那麼有兩列的數據是須要增長的，具體加什麼呢？想一下？咱們在改樣式的時候加的兩個列中使用到了變量，那麼變量取值是須要實現的。那麼首先定義變量。

 

定義報告輸出兩個變量的取值，放在 REPORT_TEST_OUTPUT_TMPL定義的下面：

腳本片斷4：

    

REPORT_TEST_OUTPUT_TMPL = r"""

%(id)s: %(output)s

"""

<!--添加內容-->

    REPORT_TEST_OUTPUT_IMAGE = r"""

%(screenshot)s

"""

    REPORT_TEST_OUTPUT_CASEID = r"""

%(case_id)s

"""

 

 

而後找到 _generate_report_test 函數，在這個函數中定義咱們要替換html變量，並實現變量的取值。

腳本片斷5：     

<!—在原有的script下面分別添加caseid和image變量並賦值，此處不用在乎爲何怎麼實現的，這麼用就對了，script內容展現的其實就是咱們case執行時 控制檯輸出的內容 因此若是你想獲取本身在case中print出來的數據就這麼作-->

        

script = self.REPORT_TEST_OUTPUT_TMPL % dict(

            id = tid,

            output = saxutils.escape(uo+ue),

        )

        image = self.REPORT_TEST_OUTPUT_IMAGE % dict(

                 screenshot = saxutils.escape(uo+ue)

        )

        caseid = self.REPORT_TEST_OUTPUT_CASEID % dict(

                 case_id = saxutils.escape(uo+ue)

        )

                   <!—html中替換的字符串變量進行詳細取值-->

        row = tmpl % dict(

            tid = tid,

            Class = (n == 0 and 'hiddenRow' or 'none'),

            style = n == 2 and 'errorCase' or (n == 1 and 'failCase' or 'none'),

            desc = desc,

            script = script,

                            <!—由於獲取內容都是字符串，因此只須要進行字符串截取就能夠了-->

            image = image[image.find("image"):(int(image.find("png"))+3)],

                            caseid = caseid[caseid.find("case"):(int(caseid.find("case"))+9)],

            status = self.STATUS[n],

        )

 

上面 image 、caseid 字符串截取位置跟我在控制檯輸出的內容有關係，因此不是通用的，須要自行修改。字符串截取的方式就不講了，方式不少種找本身合適的熟悉的就行。

 

至此修改HTMLtestrunner生成報告模板就修改結束，個人這個方式或許不是你想要的，不是你想展現的，但願能在思路上幫你去解決你的問題。

 

另：有朋友問能不能內容顯示成中文的，看明白了上面內容我想中文的顯示就不是什麼問題了。直接改HTML標籤中顯示的英文內容翻譯爲中文就能夠了。