自動化測試|錄製回放效果差別檢測

概述

  迴歸測試是指修改了舊代碼後，從新進行測試以確認修改沒有引入新的錯誤或致使其餘的代碼出現錯誤。傳統的自動化迴歸測試須要手動編寫腳本得到頁面元素的視圖樹，與原有的元素視圖樹進行比對。當功能進行頻繁迭代時，測試同窗維護這些視圖元素驗證點比較繁雜。所以在自動化迴歸測試過程當中，直接比較代碼修改前錄製的頁面和代碼修改後回放的頁面差別，能夠快速定位代碼產生的缺陷，從而提升測試同窗的工做效率。

  以閒魚應用舉例，錄製和回放頁面差別檢測存在的一些難點包括：圖像上，閒魚頁面由頂部固定區域、中間可滾動區域、底部固定區域組成，須要對頁面進行版面切割，以後分別對每個區域進行處理。另外錄製和回放頁面中一些圖標或者圖片紋理複雜的區域每每像素值分佈不一樣，可是語義層面又是同一個物體，所以須要從語義層面進行檢測識別。業務上，兩張頁面中間區域由於滾動帶來的差別不須要檢測出來，而且一些特殊的標記差別(好比一張頁面某個位置有光標，另外一張頁面同一位置沒有光標)不須要檢測出來。

  如上圖四組錄製和回放頁面所示，其中每組圖左邊爲錄製頁面，右邊是回放頁面。a)中由於中間區域的滾動帶來了文字和圖標的差別，b)中價格組件「¥69」右邊的光標帶來了差別，c)中輸入框裏的文字不同，d)中「庫存」那一欄的圖標具備語義差異。其中a)和b)中的差別不須要檢測出來，c)和d)中的差別須要檢測出來。

方法

算法流程

  整個算法流程以下圖所示：

1. 輸入的錄製和回放頁面圖像灰度化後進行版面切割，提取頂部區域、中間區域、底部區域
2. 兩張頁面的中間滾動區域進行對齊
3. 兩張頁面的每一個區域分別進行類似度計算並排除無效的差別框
4. 兩張頁面中分別標記最終的差別框
   

版面切割

  閒魚大部分的頁面是由頂部固定區域、中間可滾動區域、底部固定區域組成，版面切割的目的是找到中間可滾動區域的上下邊界，即將頁面切割爲三塊區域，以後對每塊區域分別進行處理。

  版面切割只針對中間區域有滾動的狀況，對於中間區域無滾動的狀況便可用整張圖進行後續處理。考慮到錄製和回放頁面在滾動區域上下邊界處會產生明顯的差別，所以分別從圖像的第一行和最後一行開始進行比較，比較對應行的結構類似度指數(SSIM)，當對應行的結構類似度指數小於給定的閾值，則終止。

  結構類似度指數是一種衡量兩幅圖像類似度的指標，其從圖像組成的角度將結構信息定義爲獨立於亮度、對比度的反映物體結構的屬性，用均值做爲亮度的估計，標準差做爲對比度的估計，協方差做爲結構類似程度的度量。具體公式以下：

其中(x,y)分別爲錄製和回放圖像，ux,uy,σx2,σy2,σxy分別表示圖像的均值、方差和協方差，c1,c2,c3爲小的正常數，避免分母爲零而出現不穩定，利用參數α,β,γ調整三個成分所佔的比重。在實際工程中，通常設定α=β=γ=1，以及c3=c2/2，能夠將SSIM簡化爲：

  SSIM爲介於0到1之間的一個值，值越大代表兩幅圖越類似。下圖a)b)爲高2001像素、寬1125像素的錄製和回放頁面圖像，選取SSIM閾值爲0.95，計算獲得的滾動區域的上邊界爲192，下邊界爲1832，如c)所示。

滾動區域對齊

  對齊錄製和回放圖像的滾動區域後即可對比同一位置的差別，本文采用基於特徵點的圖像對齊方法， 即檢測錄製圖像的一組稀疏特徵點來匹配回放圖像的一組稀疏特徵點，經過兩組特徵點的匹配來計算一個轉換矩陣，這個轉換矩陣能變換對齊兩幅圖像的滾動區域。因爲滾動區域只在垂直方向有位移，所以採用通常的剛性配準方法，以下式:

  錄製圖像座標(x,y)經過一個3x3的位移矩陣轉換到回放圖像座標(x',y')。位移轉換矩陣能夠經過對齊兩幅圖像的特徵點來求取。在計算機視覺中，常見的特徵點描述方法有SIFT、SURF、ORB等等，本文采用ORB方法，由於相比於SIFT和SURF方法，ORB在知足足夠高的準確性前提下，速度更快而且使用不受專利約束。

  ORB全稱是Oriented FAST and Rotated BRIEF，便是由FAST特徵點檢測和BRIEF特徵點描述組成，而且在二者基礎上加入了圖像金字塔和圖像重心方向等改進措施使得ORB對尺度和旋轉不敏感。

  滾動區域對齊的具體步驟爲：

1. 輸入錄製和回放滾動區域。當上一步版面切割沒有計算出滾動區域時，輸入整幅圖像的中間部分<br>
2. 檢測特徵點。使用ORB檢測兩幅圖像的角點。工程實現時能夠設置每幅圖像最多需檢測出的特徵點數<br>
3. 匹配特徵點。利用hamming距離來衡量兩組特徵點的類似性以及Brute Force暴力法嘗試全部特徵點來找到最佳匹配。基於匹配的特徵點距離值進行排序，選取距離值較小的一部分特徵點<br>
4. 計算轉換矩陣。輸入兩組特徵點座標位置經過最小二乘求解最優的轉換矩陣<br>
5. 對齊圖像。應用轉換矩陣將回放圖像滾動區域映射對齊錄製圖像滾動區域<br>

  下圖爲匹配的兩組特徵點，計算出來的轉換矩陣中tx=0，ty=-96

類似度計算及後處理

  對錄製和回放頁面的頂部區域、底部區域和對齊的滾動區域分別計算結構類似度SSIM(若是圖像不存在滾動區域，則對整圖計算SSIM)，差別的地方用矩形框標識，後續經過必定的後處理排除掉無效的差別。具體步驟以下：

  差別檢測。對頂部區域、底部區域和對齊的滾動區域每一個像素在必定的領域範圍內計算SSIM，獲得同等尺寸的SSIM結果圖；再對SSIM結果圖用大津法獲得二值化的SSIM結果圖，其中有差別的地方爲1，沒有差別的地方爲0；接着提取二值化SSIM差別部分的外接輪廓；以後再計算輪廓的最小外接矩形框。獲得的結果以下紅框所示：



  後處理。上圖紅框顯示的是對齊滾動區域帶來的差別，經過判斷每一個框是否落到特定區域範圍內來進行排除，這個特定區域在垂直方向上以滾動區域上邊界起始，向下移動ty行結束或者以滾動區域下邊界起始，向上移動ty行結束。另外對於一些噪聲點帶來的差別，能夠經過限制差別框包含的面積進行排除。對上圖使用以上兩步後處理後，紅框所有被排除。其餘一些錄製和回放圖像中的特殊標記(好比光標)差別在業務層面須要排除，或者一些紋理豐富的圖標/圖像雖然像素層面存在差別，但語義層面屬於同一類，即便SSIM計算不類似，也須要排除。

  上圖a)顯示光標差別模式，b)顯示紋理豐富的圖標/圖像差別模式，c)顯示其餘差別模式。這些差別模式是對應位置差別框絕對差獲得的結果，其中a)和b)須要排除，c)須要保留。分析這幾種不一樣模式類型，設計了一種以下圖所示CNN二分類網絡。圖像縮放到64x64大小，而後輸入到三層conv+pooling+relu的卷積結構中，後接128個節點和2個節點的全鏈接層，以softmax做爲類別斷定輸出。經過分類網絡即可將業務層面或像素層面的差別進行排除。

結果

  一些差別檢測的結果以下，其中紅框標示的是在錄製和回放頁面中存在差別的部分。a)只有中間區域滾動帶來的差別，業務上不須要檢測出來； b)和c)能將頁面中存在語義差別的部分檢測出來而且沒有誤檢和漏檢； d)兩張頁面不存在語義差別，但底部有個文字區域出現了誤檢，分析緣由是頁面在沒有滾動的狀況下，誤檢區域沒有上下嚴格對齊，致使計算的SSIM值偏小，認爲此處存在差別。

總結

  本文以閒魚自動化迴歸測試應用舉例，實現了一種版面切割、滾動區域對齊、類似度計算及後處理的錄製和回放頁面差別檢測方法。這種方法在使用過程當中達到了檢出語義差別的預期，而且方法具備普適性，對其餘app的自動化迴歸測試具備必定的參考意義。固然本方法也存在着一些不足，對於像素分佈不一樣但語義相同的差別模式會有一部分誤檢，這是因爲SSIM在計算類似度時對於局部像素值的變化比較敏感，將來可對頁面中的文字和圖片獨立提取出來進行進一步的語義分析優化。

原文連接