本文章轉(zhuǎn)載于搜狗測試
在互聯(lián)網(wǎng)應用高速發(fā)展的時代,為了提供高可用、安全物舒、高效的服務色洞，發(fā)布應用前會從技術(shù)的角度對后臺服務進行壓力測試、穩(wěn)定測試冠胯、安全測試火诸、接口測試、容錯測試等一系列測試環(huán)節(jié)荠察。如何從實際用戶的角度對服務器的一致性和穩(wěn)定性進行測試呢置蜀？本文基于phantomjs、opencv圖像處理悉盆、Javascript及Web開發(fā)等技術(shù)盯荤，從用戶角度出發(fā)設(shè)計了一套針對服務一致性和穩(wěn)定性測試的解決方案。
方案概述
本方案通過自主研發(fā)的測試機器狗Tigo驅(qū)動瀏覽器焕盟，用同樣的請求參數(shù)在短暫時間內(nèi)訪問服務,同時截取瀏覽器全屏或特定區(qū)域的圖像秋秤，然后對相應的一組圖片進行相似性對比分析,最終實現(xiàn)對服務一致性和穩(wěn)定性的測試。
技術(shù)特點
利用JavaScript技術(shù)脚翘，可以忽略掉頁面中不感興趣的區(qū)域灼卢，只針對目標區(qū)域進行圖像相似度對比。比如當頁面中存在調(diào)試信息時堰怨，為了保證截圖易于觀察且避免調(diào)試信息影響圖像對比結(jié)果芥玉，截取屏幕圖像前會隱藏調(diào)試信息,同時為了方便發(fā)現(xiàn)、跟蹤問題备图，現(xiàn)場又會恢復調(diào)試信息的展現(xiàn)灿巧；利用opencv技術(shù)對判斷為不一致的圖片進行分塊標紅,大大提高人工手動測試效率赶袄；當測試人員查看報告時张咳，可放大對應測試組的截圖以方便其閱讀能真；平臺化的使用入口月而。
測試報告
報告可以通過郵件和網(wǎng)頁的形式展現(xiàn)狠裹，報告中統(tǒng)計了一致圖片扛芽、不一致圖片和相似圖片的比例挽唉∨２福可從整體上獲得本次被測服務的穩(wěn)定性情況蟆豫。通過點擊結(jié)果詳情零院，可以分別查看相應測試的對比截圖效果溉跃、抓取時間、現(xiàn)場html頁面以及服務訪問url告抄。
適用場景
1）多次訪問部署在同一主機的服務撰茎，對服務進行穩(wěn)定性測試。
2）對部署在不同主機上的相同服務進行訪問,進行一致性測試打洼。
方案收益
1）與人工驗證相比龄糊，大大提高了測試效率。當對2個環(huán)境分別執(zhí)行2700個用例募疮，進行一致性測試時炫惩。完成本次測試任務，通過tigo機器人耗時大概1個半小時阿浓；而通過人工手動則需要一個測試人員耗費幾十個小時他嚷。
2）與通過人眼判斷網(wǎng)頁渲染結(jié)果是否一致相比,基于圖像處理技術(shù)的方法提高了一致性測試的正確性。
實現(xiàn)細節(jié)
PhantomJS是一個基于webkit內(nèi)核無界面瀏覽器,可通過selenium進行驅(qū)動打開網(wǎng)頁芭毙、截取圖片,截圖前可以注入javascript代碼隱藏或只渲染關(guān)注的頁面區(qū)域,通過document.querySelectorAll找到元素爸舒，再動態(tài)設(shè)置對element.style.display=None進行設(shè)置以達到隱藏目的。利用opencv技術(shù)可以對截取的圖像進行相似性分析.整體流程如圖一所示:
圖一測試流程
如何去判斷兩張截圖是否一致呢稿蹲？從機器學習的角度來說，要先選取圖像的特征鹊奖，然后在進行比對苛聘。很顯然，在我們的項目中忠聚，并沒有對圖像進行過訓練（即沒有建立某種模型）设哗，圖像的像素值因此成為了計算機最容易識別到的特征,于是本文選擇了利用opencv技術(shù)進行圖像對比分析。
從肉眼的角度來說两蟀，兩張相似圖片的直方圖也是比較重合的网梢，因此通過計算兩張圖像直方圖的重合度，就可以得出這兩張圖像的相似程度（相似度為1.0代表兩張圖像完全一致）赂毯。但是战虏，基于直方圖的圖像對比有一個明顯的缺點拣宰，即它是按照顏色的全局分布來看的，無法描述顏色的局部分布和色彩所處的位置烦感。因此巡社，本文結(jié)合使用了另一種圖像對比技術(shù)：平均哈希算法。該算法是通過比較灰度圖每個像素與平均值來實現(xiàn)的手趣，最后的結(jié)果為漢明距離（漢明距離為0晌该，代表兩張圖像完全一致）。本文通過設(shè)定灰度直方圖相似度與漢明距離雙閾值（閾值可以根據(jù)實際需要調(diào)整）的方法绿渣，給出兩張截圖相似度結(jié)果（一致朝群，相似，不一致）中符。該算法的簡單流程圖二：
圖二圖片對比流程
郵件報告輸出如下
一致的case詳情如下:
不一致的case詳情如下:
對應帶有調(diào)試信息的現(xiàn)場html頁面如下:
