how take screenshot selenium
Denna handledning förklarar vikten av Selenium Screenshot och hur man använder Ashot för att ta Screenshot i Selenium-applikationen med exempel:
Skärmdumpar används i princip i bugganalys. De hjälper till att förstå om applikationen fungerar enligt användarkraven eller inte.
För varje testfall kan den mottagna utmatningen vara annorlunda, ibland mottas rätt utdata, ibland får vi ett fel, ibland mottas felmeddelande på grund av saknade eller otillräckliga inmatningsdata etc. Skärmdump hjälper till att spåra bevis på åtgärder / utdata mottagen.
=> Kontrollera ALLA Selen-handledning här
I den här handledningen lär vi oss var Selen-skärmdumpar behövs. Vi kommer att diskutera Ashot och hur kan vi använda Ashot i Selenium (installation och konfiguration av ashot ()), lära oss att fånga skärmdumpar i Selenium (för hela webbsidan, för ett enda element på sidan och för ett för närvarande öppet fönster, även jämföra 2 bilder) och titta sedan på några exempel där skärmdumpar ofta tas.
Vad du kommer att lära dig:
Förstå Selen Screenshots
Ovanstående bild är ett exempel på en skärmdump som tagits när du kör kod från Gmail-webbplatsen. Bilden hjälper till att bekräfta att användaren framgångsrikt har loggat in på e-postkontot med rätt användarnamn och lösenord.
Således är skärmdumpar mycket hjälpsamma för att fånga de åtgärder / utdata som tas emot efter att en åtgärd utförts och hjälper därmed till att bekräfta en åtgärd som utförs utan problem.
Selen kan automatiskt ta skärmdumpar; vi måste bara lägga till kod för skärmdump i processen för kodkörning där skärmdumpar behövs.
Var behövs selen skärmdumpar
Följande skulle vara möjligheterna:
- När det är svårt att hitta ett element på en webbsida.
- Där det finns en timeout för att hitta webbelement på en sida.
- När ett fel eller problem uppstår i systemet / applikationen.
- När ett påstående misslyckas.
Vad är Ashot
Ashot () är ett tredjepartsverktyg som stöds av Selenium-webbdrivrutinen för att fånga skärmdumpar.
Ashot () tillhandahåller åtgärder nedan för att fånga skärmdumpar:
- Fångar hela sidan
- Fångar webbelementet
- Jämföra bilder
Låt oss se hur exakt detta fungerar i nästa avsnitt.
Funktioner i Ashot:
- Det är möjligt att ta en skärmdump av hela sidan.
- Det är också möjligt att ta en skärmdump av ett webbelement, som stöds på olika plattformar som Android Emulator Browser, iOS Simulator Mobile Safari, olika skrivbordswebbläsare).
- Ger en flexibel skärmdumpjämförelse.
- Dekorerar skärmdumpar.
Ashot kan ta skärmdumpar i tre steg:
- Tar en skärmdump av hela sidan.
- Hitta elementets storlek och position.
- Beskär den ursprungliga skärmdumpen.
Hur kan vi använda Ashot i selen
Tänk på följande steg för att ladda ner och konfigurera Ashot på din dator:
- Gå till länk.
- Hitta den senaste versionen av jar-filen som finns för Ashot.
- Ladda ner och spara jar-filen vid en specifik sökväg på din maskin.
- Nu för att lägga till jar-filen till ditt projekt i Eclipse – Gå till ditt projekt -> Högerklicka -> gå till egenskaper -> välj Bygg väg -> Bibliotek -> lägg till externa burkar
- Bläddra i sökvägen där den nedladdade jar-filen sparas.
- Välj jar-filen, klicka på Apply och stäng.
Hur man tar skärmdumpar i selen
Selenium erbjuder inbyggd funktionalitet för att fånga skärmdumpar. Enligt kravet, Tar skärmdump gränssnitt används för att ta skärmdumpar medan Selenium-skript körs. Således hjälper Selenium Webdriver till att fånga skärmdumpar medan kod körs.
I avsnittet nedan kommer vi att lära oss om de olika skärmdumpstyperna som fångas.
Följande är typerna:
Ta en skärmdump av:
- Aktuellt öppet fönster
- Hela webbsidan
- Bara ett specifikt webbelement
- Jämförelse av skärmdumpsbild med originalbilden
Låt oss förstå punkterna ovan i detalj.
# 1) Aktuellt öppet fönster
Låt oss titta på implementeringen av kod för hantering av skärmdumpar i Selen för det för närvarande öppna fönstret:
package SeleniumPrograms; import java.io.File; import java.io.IOException; import java.util.concurrent.TimeUnit; import org.apache.commons.io.FileUtils; import org.openqa.selenium.OutputType; import org.openqa.selenium.TakesScreenshot; import org.openqa.selenium.WebDriver; import org.openqa.selenium.firefox.FirefoxDriver; import org.testng.annotations.Test; @Test public class Screenshot { public static void main(String() args) throws IOException { // TODO Auto-generated method stub WebDriver drv = new FirefoxDriver(); drv.manage().window().maximize(); //always write wait code after this drv.manage().timeouts().pageLoadTimeout(10, TimeUnit.SECONDS);//for page load drv.get('https://opensource-demo.orangehrmlive.com/'); //Testing webpage drv.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS); //for Implicit wait //Capturing the screenshot File f = ((TakesScreenshot) drv).getScreenshotAs(OutputType.FILE); FileUtils.copyFile(f, new File('C:/Users/Chait/Desktop/Screenshots/screenshot01.png')); //screenshot copied from buffer is saved at the mentioned path. System.out.println('The Screenshot is captured.'); } }
Nedanstående bild är resultatet av ovanstående kodimplementering. Här är OrangeHRM-webbplatsen öppen och skärmdumpen av inloggningssidan fångas.
(bild källa )
Således kan vi ta skärmdumpar där det behövs när vi kör kod. Skärmdumpen som sparas sparas i en fil med .png eller .jpeg-tillägget. Vi måste ange sökvägen där bildfilen måste sparas.
# 2) Hela webbsidan
Låt oss titta på implementeringskoden nedan för att fånga en skärmdump av hela sidan med hjälp av Ashot i Selenium webdriver. Låt oss överväga exemplet på en sida (Jmeter-användardefinierade variabler) från - softwaretestinghelp.com .
package SeleniumPrograms; import java.io.File; import java.io.IOException; import java.util.ArrayList; import java.util.concurrent.TimeUnit; import javax.imageio.ImageIO; import org.apache.commons.io.FileUtils; import org.openqa.selenium.By; import org.openqa.selenium.JavascriptExecutor; import org.openqa.selenium.OutputType; import org.openqa.selenium.TakesScreenshot; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.firefox.FirefoxDriver; import ru.yandex.qatools.ashot.AShot; import ru.yandex.qatools.ashot.Screenshot; import ru.yandex.qatools.ashot.shooting.ShootingStrategies; public class Screenshot_EntirePage { public static void main(String() args) throws InterruptedException, IOException { WebDriver drv = new FirefoxDriver(); drv.manage().window().maximize(); //always write wait code after this drv.manage().timeouts().pageLoadTimeout(10, TimeUnit.SECONDS); //for page load drv.get('https://www.softwaretestinghelp.com/'); //Testing webpage drv.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS); //for Implicit wait WebElement auto = drv.findElement(By.xpath('//ul(@id='mega-menu-primary')/li(6)')); auto.click(); //click Automation tab WebElement jmeter = drv.findElement(By.linkText('JMeter')); //link to JMeter page jmeter.click(); //scroll down to open a link among various links, in the Video Tutorials section of the page JavascriptExecutor js = (JavascriptExecutor) drv; js.executeScript('window.scrollBy(0,1700)'); //scrolling downwards Thread.sleep(1500); WebElement udv = drv.findElement(By.linkText('User-Defined Variables')); udv.click(); //opening User-Defined Variables link Thread.sleep(1500); //Capturing the Screenshot with the help of ashot() Screenshot screenshot=new AShot().takeScreenshot(drv); ImageIO.write(screenshot.getImage(),'PNG',new File('C:\Users\Chait\Desktop\Screenshots\entirepage.png')); //The screenshot to be captured will be in .png image format and would be saved at above mentioned path. System.out.println('Screenshot for full page is captured successfully!'); } }
Här, den jmeter-användardefinierade variabler sida på vår webbplats: www.softwaretestinghelp.com öppnas och sedan har vi tagit en skärmdump av den här hela webbsidan (med hjälp av ashot () i selen) i .png-format och sparats på önskad väg. På samma sätt kan vi ta en skärmdump av hela sidan för vilken webbsida som helst.
Således, vid implementering av ovanstående kod för att fånga skärmdumpen av hela sidan, är den mottagna utdata som visas i bilden nedan för en komplett skärmdump på webben.
# 3) Ett webbelement
Låt oss titta på nedanstående implementeringskod, med användning av Ashot i Selenium webdriver för att fånga skärmdump av ett specifikt webbelement på webbsidan.
package SeleniumPrograms; import java.io.File; import java.io.IOException; import java.util.concurrent.TimeUnit; import javax.imageio.ImageIO; import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.firefox.FirefoxDriver; import org.testng.annotations.Test; import ru.yandex.qatools.ashot.AShot; import ru.yandex.qatools.ashot.Screenshot; import ru.yandex.qatools.ashot.shooting.ShootingStrategies; @Test public class Screenshot_WebEle_Ashot { public static void main(String() args) throws IOException { // TODO Auto-generated method stub WebDriver drv = new FirefoxDriver(); drv.manage().window().maximize(); //always write wait code after this drv.manage().timeouts().pageLoadTimeout(10, TimeUnit.SECONDS); //for page load drv.get('https://opensource-demo.orangehrmlive.com/'); //Testing webpage drv.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS); //for Implicit wait WebElement uname = drv.findElement(By.id('txtUsername')); //Username....ID.... uname.sendKeys('Admin'); WebElement pword = drv.findElement(By.id('txtPassword')); //Password....ID.... pword.sendKeys('admin123'); WebElement login_b = drv.findElement(By.xpath('//input(@id='btnLogin')')); login_b.click(); //Login button....XPATH.... WebElement ele = drv.findElement(By.linkText('Maintenance')); ele.click(); //opening link for element for which we want screenshot // pass driver as well as the element in takeScreenshot() method. Screenshot Screenshot_webele = new AShot().shootingStrategy(ShootingStrategies.viewportPasting(100)).takeScreenshot(drv, ele); // For saving the screenshot in .png/.jpeg format at the desired location ImageIO.write(Screenshot_webele.getImage(),'png',new File('C:\Users\Chait\Desktop\Screenshots\element.jpeg')); System.out.println('Screenshot for specified element captured successfully!'); } }
Således vid implementering av ovanstående kod för att fånga en skärmdump av ett specifikt element (här fliken Underhåll), den mottagna utgången är som visas i bilden nedan.
Här väljer vi fliken ”Underhåll” som ett element för vilket en skärmdump krävs. Nämn sökvägen där vi vill att skärmdumpen ska sparas. På samma sätt kan vi också fånga en skärmdump för alla andra element på en sådan webbplats.
# 4) Jämföra skärmdump med originalbild
Låt oss titta på implementeringskoden nedan med hjälp av Ashot i Selenium webdriver för att ta en skärmdump av ett logotypelement på webbsidan och jämföra det med originallogotypen.
Låt oss överväga exemplet med naukri.com :
package SeleniumPrograms; import java.awt.image.BufferedImage; import java.io.File; import java.io.IOException; import java.util.concurrent.TimeUnit; import javax.imageio.ImageIO; import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.chrome.ChromeDriver; import org.openqa.selenium.firefox.FirefoxDriver; import ru.yandex.qatools.ashot.AShot; import ru.yandex.qatools.ashot.Screenshot; import ru.yandex.qatools.ashot.comparison.ImageDiff; import ru.yandex.qatools.ashot.comparison.ImageDiffer; public class Screen_Compare { public static void main(String() args) throws IOException { // TODO Auto-generated method stub WebDriver drv = new FirefoxDriver(); drv.manage().window().maximize(); //always write wait code after this drv.manage().timeouts().pageLoadTimeout(10, TimeUnit.SECONDS); //for page load drv.get('https://www.naukri.com/nlogin/login'); //Testing webpage drv.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS); //for Implicit wait // Finding the logo element and capturing its screenshot WebElement logo = drv.findElement(By.xpath('//a(@class='nLogo fl')/img')); Screenshot logoSrcshot = new AShot().takeScreenshot(drv, logo); // Reading the image for comparision BufferedImage expectedImage = ImageIO.read(new File('C:\Users\Chait\Desktop\naukri_Logo.png')); BufferedImage actualImage = logoSrcshot.getImage(); ImageDiffer img_differnece = new ImageDiffer(); // Creating ImageDiffer object and calling the method makeDiff() ImageDiff differnece = img_differnece.makeDiff(actualImage, expectedImage); if (differnece.hasDiff() == true) //Checking the difference using in-built functions) { System.out.println('Both logo images matched') //in case when no difference found } else { System.out.println('The logo images are different'); //in case when difference found } } }
Således vid implementering av ovanstående kod för jämförelse av skärmdumpen för ett logotypelement (här naukri.com-logotyp) är den mottagna utdata som visas i bilden nedan.
Här väljer vi logotypen för “naukri.com”, fångar dess skärmdump och sedan jämförs den med originallogotypen. Skillnaden mellan bilder finns med hjälp av inbyggda funktioner. Om det inte finns någon skillnad i de två logotypbilderna skrivs programmet ut som “ Båda logotypbilderna matchade ”Annat skriver ut” Logotypbilderna är olika ”.
Exempel där skärmdumpar ofta tas
# 1) Bekräftelse för utloggning
För att logga in på en webbplats måste vi ange rätt användarnamn och lösenord varefter vi blir inloggade på webbplatsen. Sedan utför användaren de nödvändiga alternativen och när det är gjort med arbetet loggas användaren ut.
Så om vi tillhandahåller en kod för skärmdump efter att vi har loggat ut, kommer inloggningssidan igen att ses som skulle bekräfta utloggningsåtgärden. Se bilden nedan för mer information:
bästa programmet för att konvertera videofiler
# 2) Bekräftelse av en nyskapad post
Lägga till kod för skärmdump efter att du skapat en ny post bekräftar att posten skapades framgångsrikt. Se skärmdumpen nedan för mer information.
Om posten inte skapas fortsätter koden inte längre för att fånga skärmdump och detta bekräftar att posten inte skapas framgångsrikt.
# 3) Exempel på saknad / felaktig utmatning
Detta exempel inkluderar att skapa en ny post för jobbtitel på OrangeHRM-webbplatsen. Här är fältet Jobbtitel markerat ”*” vilket betyder att det är ett obligatoriskt fält. Så, posten skulle inte skapas förrän de obligatoriska fälten är ifyllda och bara vi skulle kunna spara posten. Se skärmdumpen nedan för mer information.
Slutsats
Således har vi i den här artikeln sett, där Selenium-skärmdumpar behövs, hur vi kan hantera skärmdumpar i Selen, vad är Ashot, hur det kan laddas ner, konfigureras och faktiskt användas i Selen. Vi förstod implementeringen av kod för hantering av skärmdump och såg också några exempel där skärmdumpar ofta fångas.
=> Läs igenom hela Selen-guiden
Rekommenderad läsning
- 30+ bästa selen-självstudier: Lär dig selen med riktiga exempel
- Selen Find Element by Text Tutorial med exempel
- Introduktion till Selen WebDriver - Selen Tutorial # 8
- ChromeDriver Selen Tutorial: Selen Webdriver Tests på Chrome
- Hantering av iFrames med Selenium WebDriver switchTo () -metod
- Hur man skapar Gradle-projekt med selen
- Hur man hanterar varningar / popup-fönster i Selen WebDriver - Selen Tutorial # 16
- Hur man hanterar rullningsfältet i Selen Webdriver