project_path: /blog/_project.yaml book_path: /_book.yaml page_type: blog refresh_date: 2020-02-05 beschrijving: De teststrategie van Chrome is sterk afhankelijk van geautomatiseerde functionele correctheidstests en handmatige tests, maar geen van deze kan op betrouwbare wijze kleine UI-regressies opvangen. Gebruik pixeltests om het testen van de gebruikersinterface van uw desktopbrowser te automatiseren. image_path: ../images/chromiumchronicle.jpg trefwoorden: docType:Blog,chromiumchronicle
Aflevering 10: door Sven Zheng in Bellevue, WA (januari 2020)
Vorige afleveringen
De teststrategie van Chrome is sterk afhankelijk van geautomatiseerde functionele correctheidstests en handmatige tests, maar geen van deze kan op betrouwbare wijze kleine UI-regressies detecteren. Gebruik pixeltests om het testen van de gebruikersinterface van uw desktopbrowser te automatiseren.
Vermijd bij het schrijven van een pixeltest schilfering door: (1) animatie uit te schakelen, (2) nepgegevens te gebruiken en (3) een zo klein mogelijk oppervlak te testen.
Hier is een voorbeeldafbeelding die wordt gebruikt om de pixelcorrectheid voor de omnibox te verifiëren:
En de code om de browser te verifiëren komt overeen met deze afbeelding:
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);
}
Deze code staat op chrome/test/pixel/demo/skia_gold_demo_pixeltest.cc . De relevante headers zijn skia_gold_pixel_diff.h voor unit-tests en browser_skia_gold_pixel_diff.h voor browsertests.
Het pixelverschil- en goedkeuringsproces wordt mogelijk gemaakt door Skia Gold. Skia Gold-pixeltests bieden een visuele goedkeuringsworkflow en stellen ontwikkelaars in staat kleine vlokken te accepteren door meerdere goudafbeeldingen goed te keuren.
Momenteel draait het testpakket op de Windows FYI-bot. Browsertests en Views-eenheidstests worden ondersteund.