Menü

Selenium'da Ekran Görüntüsü Nasıl Alınır

  • Ana
  • Diğer
  • Selenium'da Ekran Görüntüsü Nasıl Alınır

how take screenshot selenium

Sorunları Ortadan Kaldırmak Için Enstrümanımızı Deneyin

Bu eğitici, Selenium Ekran Görüntüsü'nin önemini ve Selenium uygulamasında Ekran Görüntüsü almak için Ashot'un nasıl kullanılacağını örneklerle açıklar:

Ekran görüntüleri temelde hata analizinde kullanılır. Uygulamanın kullanıcı gereksinimlerine göre çalışıp çalışmadığını anlamaya yardımcı olurlar.

Her test senaryosu için, alınan çıktı farklı olabilir, bazen doğru çıktı alınır, bazen bir hata alırız, bazen eksik veya yetersiz girdi verileri nedeniyle hata mesajı alınır, vb. Ekran görüntüsü, eylemlerin / çıktıların kanıtlarının izlenmesine yardımcı olur Alınan.

=> TÜM Selenium Öğreticilerini Buradan Kontrol Edin

Selenium Ekran Görüntüleri

Bu eğitimde Selenium ekran görüntülerinin nerede gerekli olduğunu öğreneceğiz. Ashot'u ve Ashot'u Selenium'da nasıl kullanabileceğimizi (ashot () kurulumu ve yapılandırması), Selenium'da ekran görüntülerini yakalamayı öğreneceğiz (tüm web sayfası için, sayfadaki tek bir öğe için ve şu anda açık olan bir pencere için) 2 resim) ve ardından ekran görüntülerinin genellikle yakalandığı birkaç örneğe bakın.

Ne öğreneceksin:

Selenium Ekran Görüntülerini Anlamak

Gmail giriş

Yukarıdaki resim, Gmail web sitesinden kod çalıştırılırken yakalanan bir ekran görüntüsü örneğidir. Görüntü, kullanıcının e-posta hesabına doğru kullanıcı adı ve şifre ile başarıyla giriş yaptığını onaylamaya yardımcı olur.

Bu nedenle, ekran görüntüleri, bir eylem gerçekleştirildikten sonra alınan eylemleri / çıktıları yakalamada çok yararlıdır ve bu nedenle, herhangi bir sorun olmadan gerçekleştirilen bir eylemi onaylamaya yardımcı olur.

Selenium otomatik olarak ekran görüntüsü alabilir; ekran görüntülerinin gerekli olduğu herhangi bir kod yürütme sürecinde sadece ekran görüntüsü için kod eklememiz gerekir.

Selenium Ekran Görüntülerine Nerelerde İhtiyaç Duyulur?

Olasılıklar aşağıdadır:

  • Bir web sayfasında bir öğe bulmada sorun olduğunda.
  • Bir sayfadaki web öğelerini bulmada zaman aşımı olduğu yerde.
  • Sistemde / uygulamada bir hata veya sorun meydana geldiğinde.
  • Bir onaylama hatasıyla karşılaşıldığında.

Ashot Nedir

Ashot (), ekran görüntülerini yakalamak için Selenium web sürücüsü tarafından desteklenen üçüncü taraf bir yardımcı programdır.

dat dosyası mac nedir

Ashot (), ekran görüntülerini yakalamada aşağıdaki işlemleri sağlar:

  • Tam sayfayı yakalama
  • Web öğesini yakalama
  • Görüntüleri karşılaştırma

Bir sonraki bölümde bunun tam olarak nasıl çalıştığını görelim.

Ashot'un Özellikleri:

  • Tüm sayfanın ekran görüntüsünü almak mümkündür.
  • Android Emulator Browser, iOS Simulator Mobile Safari, farklı masaüstü tarayıcıları gibi çeşitli platformlarda desteklenen bir web öğesinin ekran görüntüsünü de almak mümkündür.
  • Esnek bir ekran görüntüsü karşılaştırması sağlar.
  • Ekran görüntülerini dekore eder.

Ashot, üç adımda ekran görüntüsü alabilir:

  • Tam sayfanın ekran görüntüsünü alır.
  • Öğenin boyutunu ve konumunu bulun.
  • Orijinal ekran görüntüsünü kırpar.

Selenyumda Ashot'u Nasıl Kullanabiliriz?

Ashot'u makinenize indirmek ve yapılandırmak için aşağıdaki adımları göz önünde bulundurun:

  1. Şuraya git bağlantı.
  2. Ashot için mevcut olan jar dosyasının en son sürümünü bulun.
  3. Jar dosyasını makinenizde belirli bir yola indirin ve kaydedin.
  4. Şimdi Eclipse'deki projenize jar dosyasını eklemek için - Projenize gidin -> Sağ tıklayın -> özelliklere gidin -> Yol Oluştur'u seçin -> Kitaplıklar -> Harici kavanozlar ekleyin
  5. İndirilen jar dosyasının kaydedildiği yola göz atın.
  6. Jar dosyasını seçin, Uygula'ya tıklayın ve kapatın.

Selenium'da Ekran Görüntüleri Nasıl Yakalanır

Selenium, ekran görüntülerini yakalamak için yerleşik işlevsellik sağlar. İhtiyaca göre, Ekran Görüntüsü Alır arabirim, Selenium komut dosyalarını çalıştırırken ekran görüntüsü almak için kullanılır. Böylece, Selenium Webdriver, kod yürütülürken ekran görüntülerinin yakalanmasına yardımcı olur.

Aşağıdaki bölümde, yakalanan farklı ekran görüntüsü türleri hakkında bilgi edineceğiz.

Türler şunlardır:

Aşağıdakilerin ekran görüntüsünü almak:

  • Mevcut açık pencere
  • Web sayfasının tamamı
  • Yalnızca belirli bir web öğesi
  • Ekran görüntüsü görüntüsünün orijinal görüntü ile karşılaştırılması

Yukarıdaki noktaları ayrıntılı olarak anlayalım.

# 1) Mevcut Açık Pencere

Şu anda açık pencere için Selenium'da ekran görüntülerini işlemek için kodun uygulanmasına bakalım:

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.'); } }

Aşağıdaki görüntü, yukarıdaki kod uygulamasının çıktısıdır. Burada OrangeHRM sitesi açılır ve giriş sayfasının ekran görüntüsü alınır.

Mevcut Açık Pencere

(resim kaynak )

Böylece, kodu çalıştırırken gerekli olan her yerde ekran görüntüsü yakalayabiliriz. Yakalanan ekran görüntüsü .png veya .jpeg uzantılı bir dosyaya kaydedilir. Görüntü dosyasının kaydedilmesi gereken yolu vermemiz gerekiyor.

# 2) Tüm Web Sayfası

Ashot'un Selenium webdriver'ın yardımıyla tüm sayfanın ekran görüntüsünü almak için aşağıdaki uygulama koduna bakalım. Bunun için bir sayfa örneğini (Jmeter-kullanıcı-tanımlı-değişkenler) - 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!'); } }

Burada jmeter-kullanıcı tanımlı değişkenler web sitemizin sayfası: www.softwaretestinghelp.com açılır ve sonra bu tam web sayfasının ekran görüntüsünü (selenyumda ashot () yardımıyla) .png formatında aldık ve istenen yola kaydettik. Aynı şekilde, herhangi bir web sayfası için tüm sayfanın ekran görüntüsünü alabiliriz.

Bu nedenle, tüm sayfanın ekran görüntüsünü yakalamak için yukarıdaki kodu uygularken, alınan çıktı, tam bir web sayfası ekran görüntüsü için aşağıdaki resimde gösterildiği gibidir.

Entire_Page

# 3) Bir Web Öğesi

Web sayfasındaki belirli bir web öğesinin ekran görüntüsünü almak için Selenium web sürücüsünde Ashot kullanımıyla aşağıdaki uygulama koduna bakalım.

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!'); } }

Bu nedenle, belirli bir öğenin ekran görüntüsünü yakalamak için yukarıdaki kodu uygularken (burada Bakım sekmesi), alınan çıktı aşağıdaki resimde gösterildiği gibidir.

Maintenance_WebElement 1

Burada, ekran görüntüsünün gerekli olduğu bir öğe olarak 'Bakım' sekmesini seçiyoruz. Ekran görüntüsünün kaydedilmesini istediğimiz yolu belirtin. Aynı şekilde, herhangi bir web sitesinde başka herhangi bir unsur için de bir ekran görüntüsü alabiliriz.

# 4) Ekran Görüntüsünü Orijinal Görüntü ile Karşılaştırma

Web sayfasındaki bir logo öğesinin ekran görüntüsünü almak ve bunu orijinal logo ile karşılaştırmak için Ashot in Selenium webdriver kullanımıyla aşağıdaki uygulama koduna bir göz atalım.

Bunun için örneğini ele alalım 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 } } }

Bu nedenle, bir logo öğesinin (burada naukri.com logosu) ekran görüntüsünün karşılaştırılması için yukarıdaki kodun uygulanmasında, alınan çıktı aşağıdaki resimde gösterildiği gibidir.

naukri logosu

Burada 'naukri.com' logosunu seçiyoruz, ekran görüntüsünü alıyoruz ve ardından orijinal logo ile karşılaştırılıyor. Görüntüler arasındaki fark, yerleşik işlevler kullanılarak bulunur. 2 logo görüntüsünde hiçbir fark bulunmazsa, program çıktıyı ' Her iki logo resmi eşleşti 'Aksi takdirde' Logo resimleri farklı ”.

Ekran Görüntülerinin Sıklıkla Yakalandığı Örnekler

# 1) Çıkış onayı

Bir web sitesine giriş yapmak için, doğru kullanıcı adı ve şifreyi girmemiz ve ardından web sitesine giriş yapmamız gerekir. Daha sonra kullanıcı gerekli seçenekleri gerçekleştirir ve işi tamamladıktan sonra kullanıcı oturumu kapatır.

Bu nedenle, çıkış yaptıktan sonra ekran görüntüsü için bir kod sağlarsak, çıkış işlemini onaylayacak giriş sayfası tekrar görülecektir. Daha fazla ayrıntı için lütfen aşağıdaki resme bakın:

çıkış onayı

ikili ağaç java'da düğüm ekle

# 2) Yeni oluşturulan bir kaydın onayı

Yeni bir kayıt oluşturduktan sonra ekran görüntüsü için kod eklemek, kaydın başarıyla oluşturulduğunu onaylar. Daha fazla ayrıntı için lütfen aşağıdaki ekran görüntüsüne bakın.

Yeni oluşturulan bir kaydın onayı

Kaydın oluşturulmadığı durumda, kod ekran görüntüsünü yakalamak için daha fazla ilerlemeyecek ve bu, kaydın başarıyla oluşturulmadığını onaylayacaktır.

# 3) Eksik / yanlış çıktı örneği

Bu örnek, OrangeHRM web sitesinde İş Unvanı için yeni bir kayıt oluşturmayı içerir. Burada, İş Unvanı alanı '*' ile işaretlenmiştir, bu da zorunlu bir alan olduğu anlamına gelir. Bu nedenle, gerekli alanlar doldurulana kadar kayıt oluşturulmaz ve o zaman kaydı yalnızca biz kaydedebiliriz. Daha fazla ayrıntı için lütfen aşağıdaki ekran görüntüsüne bakın.

Eksik / yanlış çıktı örneği

Sonuç

Böylece bu yazıda Selenium ekran görüntülerine nerede ihtiyaç duyulduğunu, ardından Selenium'da Ekran görüntülerini nasıl işleyebileceğimizi, Ashot nedir, nasıl indirilebileceğini, yapılandırılabileceğini ve Selenium'da nasıl kullanılabileceğini gördük. Ekran görüntüsünü işlemek için kodun uygulanmasını anladık ve ayrıca ekran görüntülerinin sıklıkla yakalandığı birkaç örnek gördük.

=> Tam Selenyum Kılavuzunu Okuyun

Önerilen Kaynaklar

^