streamalism.org

1. Oversikt

Når vi jobber med automatiserte tester ved bruk av Selen, trenger vi ofte å ta et skjermbilde av en webside eller en del av en webside. Dette kan være nyttig, spesielt når feilsøking av testfeil eller verifisering av applikasjonsatferden vår er konsistent i forskjellige nettlesere.

I denne raske opplæringen, vi tar en titt på et par måter vi kan ta skjermbilder med Selenium WebDriver fra JUnit-testene våre. For å lære mer om testing med selen, sjekk ut vår gode guide til selen.

2. Avhengigheter og konfigurasjon

La oss starte med å legge Selenavhengighet til vår pom.xml:

 org.seleniumhq.selenium selen-java 3.141.59 

Som alltid kan den nyeste versjonen av denne gjenstanden bli funnet i Maven Central.

La oss nå konfigurere driveren til å bruke Chrome fra enhetstesten:

privat statisk ChromeDriver-driver; @BeforeClass offentlig statisk ugyldig setUp () {System.setProperty ("webdriver.chrome.driver", resolResourcePath ("chromedriver.mac")); Evner evner = DesiredCapabilities.chrome (); driver = ny ChromeDriver (evner); driver.manage () .timeouts () .implicitlyWait (5, TimeUnit.SECONDS); driver.get ("// www.google.com/"); }

Som vi kan se, er dette en ganske standard Selen-konfigurasjon for en ChromeDriver som lar oss kontrollere Chrome-nettleseren som kjører på den lokale maskinen vår. Vi konfigurerer også hvor lang tid føreren skal vente når han søker etter et element på siden til fem sekunder.

Til slutt, før noen av testene våre kjører, åpner vi en favoritt webside, www.google.com i det nåværende nettleservinduet.

3. Ta et skjermbilde av det synlige området

I dette første eksemplet tar vi en titt på TarScreenShot grensesnitt, som Selen gir out-of-the-box. Som navnet antyder, kan vi bruke dette grensesnittet til å ta skjermbilder av det synlige området.

La oss lage en enkel metode for å ta skjermbilder ved hjelp av dette grensesnittet:

offentlig ugyldig takeScreenshot (strengbanenavn) kaster IOException {File src = ((TakesScreenshot) driver) .getScreenshotAs (OutputType.FILE); FileUtils.copyFile (src, ny fil (stienavn)); } 

I denne konsise metoden konverterer vi først sjåføren vår til en Tar skjermbilde ved hjelp av en rollebesetning. Så kan vi ringe getScreenshotAs metoden, med den spesifiserte OutputType for å lage en bildefil.

Etter det kan vi kopiere filen til ønsket sted ved hjelp av Apache Commons IO Kopier fil metode. Ganske kult! På bare to linjer kan vi ta skjermbilder.

La oss nå se hvordan vi kan bruke denne metoden fra en enhetstest:

@Test offentlig ugyldig når GoogleIsLoaded_thenCaptureScreenshot () kaster IOException {takeScreenshot (resolutionTestResourcePath ("google-home.png")); assertTrue (ny fil (resolutionTestResourcePath ("google-home.png")). eksisterer ()); }

I denne enhetstesten lagrer vi den resulterende bildefilen til vår test / ressurser mappen ved hjelp av filnavnet google-home.png før du hevder å se om filen eksisterer.

4. Fange et element på siden

I denne neste delen tar vi en titt på hvordan vi kan ta et skjermbilde av et enkelt element på siden. For dette vil vi bruke et bibliotek kalt aShot, et skjermbildeverktøybibliotek som naturlig støttes av Selenium 3 og utover.

Siden aShot er tilgjengelig fra Maven Central, kan vi bare inkludere det i vårt pom.xml:

 ru.yandex.qatools.ashot ashot 1.5.4 

AShot-biblioteket tilbyr et flytende API for å konfigurere hvor nøyaktig vi vil ta skjermbilder.

La oss nå se hvordan vi kan hente logoen fra Googles startside fra en av enhetstestene våre:

@Test offentlig ugyldig når GoogleIsLoaded_thenCaptureLogo () kaster IOException {WebElement logo = driver.findElement (By.id ("hplogo")); Skjermbilde screenshot = nytt AShot (). ShootingStrategy (ShootingStrategies.viewportPasting (1000)) .coordsProvider (ny WebDriverCoordsProvider ()). TaScreenshot (driver, logo); ImageIO.write (screenshot.getImage (), "jpg", ny fil (resolutionTestResourcePath ("google-logo.png"))); assertTrue (ny fil (resolutionTestResourcePath ("google-logo.png")). eksisterer ()); }

Vi starter med å finne en WebElement på siden ved hjelp av id hplogo. Så lager vi et nytt Et skudd forekomst og angi en av de innebygde skytestrategiene - ShootingStrategies.viewportPasting (1000). Denne strategien vil bla i visningsporten mens vi tar skjermbildet i maksimalt ett sekund (1oooms).

Nå har vi policyen for hvordan vi vil ta skjermbildet vårt konfigurert.

Når vi ønsker å fange et bestemt element på siden internt, vil aShot finne elementets størrelse og posisjon og beskjære det originale bildet. For dette kaller vi coordsProvider metode og bestå en WebDriverCoordsProvider klasse som vil bruke WebDriver API for å finne koordinater.

Merk at aShot som standard bruker jQuery for koordinatoppløsning. Men noen drivere har problemer med Javascript.

Nå kan vi kalle takeScreenshot metode som passerer vår sjåfør og logo element som igjen vil gi oss et Skjermbilde objekt som inneholder resultatet av skjermbildet vårt. Som før avslutter vi testen med å skrive en bildefil og verifisere eksistensen.

5. Konklusjon

I denne raske opplæringen har vi sett to tilnærminger for å ta skjermbilder ved hjelp av Selenium WebDriver.

I den første tilnærmingen så vi hvordan du kunne fange hele skjermen ved å bruke Selen direkte. Så lærte vi hvordan vi kunne fange et bestemt element på siden ved hjelp av et flott verktøybibliotek kalt aShot.

En av de viktigste fordelene ved å bruke aShot er at forskjellige WebDrivers oppfører seg annerledes når de tar skjermbilder. Å bruke aShot trekker oss bort fra denne kompleksiteten og gir oss gjennomsiktige resultater uavhengig av driveren vi bruker. Sørg for å sjekke ut den komplette dokumentasjonen for å se alle tilgjengelige funksjoner.

Som alltid er hele kildekoden til artikkelen tilgjengelig på GitHub.