Episode 10: oleh Sven Zheng di Bellevue, WA (Januari 2020)
Episode sebelumnya
Strategi pengujian Chrome sangat bergantung pada pengujian akurasi fungsional otomatis dan pengujian manual, tetapi tidak satu pun dari keduanya yang dapat mendeteksi regresi UI minor dengan andal. Gunakan pengujian piksel untuk mengotomatiskan pengujian UI browser desktop Anda.
Saat menulis pengujian piksel, hindari ketidakstabilan dengan: (1) menonaktifkan animasi, (2) menggunakan data tiruan, dan (3) menguji luas permukaan minimum.
Berikut adalah contoh gambar yang digunakan untuk memverifikasi kebenaran piksel untuk omnibox:
Dan kode untuk memverifikasi browser cocok dengan gambar ini:
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);
}
Kode ini berada di chrome/test/pixel/demo/skia_gold_demo_pixeltest.cc.
Header yang relevan adalah skia_gold_pixel_diff.h
untuk pengujian unit dan
browser_skia_gold_pixel_diff.h
untuk pengujian browser.
Perbedaan piksel dan proses persetujuan didukung oleh Skia Gold. Pengujian piksel Skia Gold memberikan alur kerja persetujuan visual, dan memungkinkan developer menerima flake kecil dengan menyetujui beberapa gambar gold.
Saat ini, rangkaian pengujian berjalan di bot FYI Windows. Pengujian browser dan pengujian unit View didukung.