project_path：/blog/_project.yaml Book_path：/_book.yaml page_type：blog update_date：2020-02-05 說明：Chrome 的測試策略極度仰賴自動化功能正確性測試和手動測試，但這兩者都無法穩定偵測出微小的 UI 迴歸問題。使用像素測試自動測試電腦版瀏覽器使用者介面。 image_path：../images/chromiumchronicle.jpg 關鍵字：docType:Blog,chromiumchronicle
第 10 集：Sven Zheng 在華盛頓州貝爾維格 (2020 年 1 月)
上一集
Chrome 的測試策略極度仰賴自動化功能正確性 測試和手動測試，但都無法輕易找出次要 UI 迴歸問題使用像素測試自動測試電腦版瀏覽器使用者介面。
編寫像素測試時，請透過以下做法避免出現不流暢的情況：(1) 停用動畫。 (2) 使用模擬資料，以及 (3) 測試最小可能的表面積。
以下圖片範例可用於驗證網址列的像素正確性：
而用來驗證瀏覽器的程式碼是否與這張圖片相符：
IN_PROC_BROWSER_TEST_F(SkiaGoldDemoPixelTest, TestOmnibox) {
// Always disable animation for stability.
ui::ScopedAnimationDurationScaleMode disable_animation(
ui::ScopedAnimationDurationScaleMode::ZERO_DURATION);
GURL url("chrome://bookmarks");
AddTabAtIndex(0, url, ui::PageTransition::PAGE_TRANSITION_FIRST);
auto* const browser_view = BrowserView::GetBrowserViewForBrowser(browser());
// CompareScreenshot() takes a screenshot and compares it with the
// golden image, which was previously human-approved, is stored
// server-side, and is managed by Skia Gold. If any pixels differ, the
// test will fail and output a link for the author to triage the
// new image.
bool ret = GetPixelDiff().CompareScreenshot("omnibox",
browser_view->GetLocationBarView());
EXPECT_TRUE(ret);
}
這個代碼位於 chrome/test/pixel/demo/skia_gold_demo_pixeltest.cc。
相關標頭為單元測試的 skia_gold_pixel_diff.h，以及
browser_skia_gold_pixel_diff.h，用於瀏覽器測試。
像素差異和核准程序是由 Skia Gold 提供。Skia Gold Pixel 測試提供視覺核准工作流程，並讓開發人員接受 拍攝多部金礦的圖片
測試套件目前是在 Windows FYI 機器人上執行。瀏覽器測試 以及 View 單元測試