自動化測試如何進行畫面圖形比對
這篇文章主要說明如何對於圖形做比對。這樣的圖形比對通常應用在畫面的驗證工作。
事先準備一張預期結果的畫面擷取，之後測試的過程中再將執行結果擷取畫面，
將這兩張圖形做比對，就會得到兩張圖形差異的結果。
| 圖形1 | 圖形2 | 差異結果 |
 |
 |
 |
適用情境
- 當整個畫面比較圖形，但是每次執行結果都會有預期相同的畫面時
- 語言翻譯的頁面。透過這個方法可以知道網頁畫面上是否有新增或是修改的翻譯文字。
工具主角： ImageMagic
http://www.imagemagick.org/script/index.php
要做到圖形比對，我們就利用到這個工具集，ImageMagic
除了可以做圖形比對之外，另外也支援PDF，而且免費。
使用上僅需給兩個圖形檔，這個工具就會幫忙分析產生出兩個圖形檔案(Image1.png與Image2.png)差異的部分(diff.png)。
compare image1.png image2.png -compose src diff.png
compare image1.png image2.png -compose src diff.pdf
這個工具集可以在這裡下載，其中我們主要用到的是 “compare.exe”
http://www.imagemagick.org/script/binary-releases.php
要注意的是這兩個圖形檔一定要一模一樣大小。如果大小尺寸不一樣的話，那麼就無法做比對的動作。
結語
自動化測試的驗證方式有許多種，這篇文章介紹的方法主要是直接對整個畫面的擷取圖檔做比對。
優點是可以直接比對出一些細微的差異，例如網頁上文字部分修改，顏色微調、位置的更動等。這些人工看不一定會察覺。
缺點是這樣的圖形比對僅適用在那些畫面不會經常變動的部分。
另外，因為兩張圖形要比對，如何選取一張預期的結果，如何選取一張執行結果的畫面擷取，這兩個都是關鍵的要素
這兩張圖形檔案大小必須一致，才能夠進行畫面圖形的比對。