에피소드 10: 워싱턴주 벨뷰의 스벤 셤 (2020년 1월)
이전 에피소드
Chrome의 테스트 전략은 자동화된 기능적 정확성 테스트와 수동 테스트에 크게 의존하지만, 이 두 가지 방법 모두 경미한 UI 회귀를 안정적으로 포착하지 못합니다. 픽셀 테스트를 사용하여 데스크톱 브라우저 UI 테스트를 자동화합니다.
픽셀 테스트를 작성할 때는 (1) 애니메이션을 사용 중지하고, (2) 모의 데이터를 사용하고, (3) 가능한 최소 표면적을 테스트하여 불안정성을 방지합니다.
다음은 omnibox의 픽셀 정확성을 확인하는 데 사용되는 샘플 이미지입니다.
브라우저가 이 이미지와 일치하는지 확인하는 코드는 다음과 같습니다.
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 골드 픽셀 테스트는 시각적 승인 워크플로를 제공하며 개발자가 여러 골드 이미지를 승인하여 작은 플래크를 수락할 수 있습니다.
현재 테스트 모음은 Windows FYI 봇에서 실행되고 있습니다. 브라우저 테스트 및 뷰 단위 테스트가 지원됩니다.