前言
激動(dòng)人心的 AI 測試系列終于來了，聽過那么多國外有名的 AI 測試工具阴幌，那么你有沒有真的去實(shí)踐學(xué)習(xí)一下呢勺阐？
此號(hào)的初衷就是為了探索 AI 賦能測試，這也同樣是讓我繼續(xù)做測試相關(guān)工作的理由矛双。不過為了避免走彎路浪費(fèi)時(shí)間渊抽，同時(shí)也是抱著學(xué)習(xí)的目的，接下來我會(huì)帶領(lǐng)大家一起體驗(yàn)所有已經(jīng)比較著名的议忽、現(xiàn)成的 AI 測試工具腰吟，做出總結(jié)，最后打造出屬于我們的 AI 測試。希望大家多多支持毛雇。
相信最后所有機(jī)械的測試任務(wù)都能夠被 AI 所完全取代嫉称，這也是 AI 的魅力所在。
正文
什么是 Applitools
簡單來說灵疮，Applitools 是一個(gè) AI 賦能的測試工具织阅，通過視覺 AI 進(jìn)行智能功能和視覺測試，幫助企業(yè)以更低的成本更快地發(fā)布項(xiàng)目震捣。
閑話不多說荔棉，我們進(jìn)入實(shí)踐環(huán)節(jié)。
最佳實(shí)踐
進(jìn)入官網(wǎng)后蒿赢，眼前一亮后我們點(diǎn)擊頁面右上角的 GET STARTED 按鈕润樱。
然后使用 GITHUB 賬號(hào)授權(quán)后來到了這個(gè)頁面。
這個(gè)時(shí)候我們需要點(diǎn)擊右上角頭像中的 My API key 獲取 Api 秘鑰羡棵。
保存好秘鑰后新建個(gè)項(xiàng)目壹若，安裝依賴包：
pip install selenium
pip install eyes-selenium
然后我們需要新建一個(gè) python 文件并寫入以下代碼：
from selenium import webdriver
from applitools.selenium import Eyes, Target
class HelloWorld:
eyes = Eyes()
# 這里填寫你保存的秘鑰
eyes.api_key = 'xxxx'
try:
# Open a Chrome browser.
driver = webdriver.Chrome()
# Start the test and set the browser's viewport size to 800x600.
eyes.open(driver, "Test app", "First test", {'width': 800, 'height': 600})
# Navigate the browser to the "hello world!" web-site.
driver.get('https://demo.applitools.com')
# Visual checkpoint #1.
eyes.check("Login Window test", Target.window())
# End the test.
results = eyes.close(False)
print(results)
finally:
# Close the browser.
driver.quit()
# If the test was aborted before eyes.close was called, ends the test as aborted.
eyes.abort()
運(yùn)行代碼成功后可以看到如下輸出：
New test [TestResults(steps=1, matches=0, mismatches=0, missing=0, url='https://eyes.applitools.com/app/batches/xxxxxxxxxxxxxx/xxxxxxxxxxxxxxx?accountId=xxxxxxxxxxxxxxxxx~~')]
Process finished with exit code 0
這時(shí)候回到之前的 Web 頁面即可看到測試結(jié)果。
嗯皂冰，很神奇（才沒有）店展，至此我們完成了一個(gè)小的 Demo ，下面將揭露 Applitools 智能在何處秃流。
Baseline
在 applitools 中有個(gè)特殊的概念赂蕴，叫做 Baseline。什么是 Baseline 呢舶胀？其實(shí)很簡單概说，我們可以把他當(dāng)作是一條 UI 測試流程的基準(zhǔn)線。打個(gè)比方嚣伐，一段 UI 主流程的測試代碼中對應(yīng)了三個(gè)不同的頁面：登錄頁面糖赔、錯(cuò)誤密碼登錄后的提示頁面，正確密碼登錄成功后跳轉(zhuǎn)的頁面纤控。那么我們就可以把這個(gè)流程當(dāng)作基準(zhǔn)線挂捻，分別在三個(gè)不同的頁面中添加 Checkpoint（驗(yàn)證點(diǎn)）碉纺，當(dāng)設(shè)定好 Baseline 之后船万，下一次的測試執(zhí)行將會(huì)對比當(dāng)前測試流程與 Baseline 之間 Checkpoint 中圖像的差異，并做出通過或者失敗的斷言骨田。
最佳實(shí)踐
我們按照慣例拿百度首頁做試驗(yàn)：
from selenium import webdriver
from applitools.selenium import Eyes, Target
class HelloWorld:
eyes = Eyes()
# 這里填寫你保存的秘鑰
eyes.api_key = 'XXX'
try:
# Open a Chrome browser.
driver = webdriver.Chrome()
# Start the test and set the browser's viewport size to 800x600.
eyes.open(driver, "Test", "Baidu", {'width': 800, 'height': 600})
# 訪問百度首頁
driver.get('https://www.baidu.com')
# Visual checkpoint #1.
eyes.check("Baidu Homepage Test", Target.window())
# End the test.
results = eyes.close(False)
print(results)
finally:
# Close the browser.
driver.quit()
# If the test was aborted before eyes.close was called, ends the test as aborted.
eyes.abort()
代碼運(yùn)行完畢后返回 applitools 的 Web 頁面耿导，可以看到已經(jīng)新增了一條 Baseline：
這時(shí)候我們可以檢驗(yàn)一下 Baseline 中的 Checkpoint 是否生效，再次運(yùn)行相同代碼后返回 Web 頁面：
咦态贤，這是怎么回事舱呻，怎么沒有 PASS？于是我們點(diǎn)進(jìn)去一看：
哈哈，原來這張 checkpoint 中識(shí)別出了百度搜索框中的光標(biāo)箱吕，而 Baseline 中沒有......
那么這種問題要怎么解決呢芥驳？
如何解決判斷圖像差異帶來的后遺癥？
當(dāng) applitools 使用 AI 技術(shù)幫助我們對比當(dāng)前測試與 Baseline 之間 checkpoint 的圖像差異時(shí)茬高，如果發(fā)現(xiàn)了有不同之處兆旬，將會(huì)把當(dāng)前測試打上一個(gè) Unresolved（未解決） 標(biāo)簽。這是因?yàn)?AI 并不知道這個(gè)圖像差異是由新功能導(dǎo)致的還是確實(shí)是個(gè) Bug怎栽。
而這個(gè)時(shí)候丽猬，我們可以人工去給這個(gè)測試結(jié)果打標(biāo)簽（通過 / 不通過）。如果打上了通過的標(biāo)簽熏瞄，下一次測試則會(huì)忽略這個(gè)差異并判斷為通過脚祟。如果打上了失敗的標(biāo)簽，下一次測試中如果出現(xiàn)了同樣的差異將會(huì)自動(dòng)判斷為不通過强饮。
最佳實(shí)踐
我們回到 Web 頁面中給之前 Unresolved 的測試用例點(diǎn)個(gè)贊（打上通過的標(biāo)簽）由桌。
這個(gè)時(shí)候新的 checkpoint 將會(huì)覆蓋原來的 checkpoint，并且當(dāng)前這個(gè)用例將會(huì)判斷為通過胡陪。
以圖像識(shí)別差異的方式去判斷 UI 測試通過與否確實(shí)是有一定的價(jià)值的沥寥，但是其中也有不少的漏洞存在，下面來講解如何解決這個(gè)問題
設(shè)置 Checkpoint 圖像忽略區(qū)域
我們回到之前的 Web 頁面中柠座，在最后的測試結(jié)果的 ANNOTATIONS 標(biāo)簽欄中選擇 ignore regions（可忽略區(qū)域）邑雅，然后我們選中輸入框光標(biāo)所屬區(qū)域，最后點(diǎn)擊保存妈经，如圖所示：
這時(shí)候我們再次運(yùn)行代碼：
from selenium import webdriver
from applitools.selenium import Eyes, Target
class HelloWorld:
eyes = Eyes()
# 這里填寫你保存的秘鑰
eyes.api_key = 'XXX'
try:
# Open a Chrome browser.
driver = webdriver.Chrome()
# Start the test and set the browser's viewport size to 800x600.
eyes.open(driver, "Test", "Baidu", {'width': 800, 'height': 600})
# 訪問百度首頁
driver.get('https://www.baidu.com')
# Visual checkpoint #1.
eyes.check("Baidu Homepage Test", Target.window())
# End the test.
results = eyes.close(False)
print(results)
finally:
# Close the browser.
driver.quit()
# If the test was aborted before eyes.close was called, ends the test as aborted.
eyes.abort()
運(yùn)行完畢后回到 applitools 的 Web主頁面中淮野，發(fā)現(xiàn)多了一條測試通過的用例：
點(diǎn)進(jìn)去后發(fā)現(xiàn) Baseline 與 當(dāng)前測試結(jié)果并不相同，但是由于我們選定了可忽略的區(qū)域吹泡，所以輸入框光標(biāo)存在與否并不會(huì)影響測試結(jié)果：
于是我們完美的解決了之前遇到的問題骤星。
