前言:去官網(wǎng)或者npm官網(wǎng)找 backstopjs (https://www.npmjs.com/package/backstopjs).
1.安裝:npm install -g backstopjs
2.backstop init 初始化
3.打開backstop.json 文件薪前,將width全蝶、height改為ui制作的psd原圖的長寬狂男,并在 scenarios下找到url設(shè)置要測試頁面路徑古沥。
4.執(zhí)行命令:backstop test
5.在backstop_data目錄下有個文件夾bitmaps_test秒赤,進(jìn)去后看到測試工具已將頁面截圖保存下來址晕。然后復(fù)制該頁面的名稱。(也可直接在backstop.json 修改要報(bào)存的名稱)
6.在baskstop_data 目錄下新建名稱為 bitmaps_reference的文件夾仅仆。放入ui圖器赞,并將圖名稱修改為第5步復(fù)制好的名稱。
7.執(zhí)行命令:backstop test 進(jìn)行測試墓拜。
還有另外一種UI還原的工具:phantomCSS
圖片.png
圖片.png