Μενού

Πώς να τραβήξετε στιγμιότυπο οθόνης στο σελήνιο

  • Κύριος
  • Αλλα
  • Πώς να τραβήξετε στιγμιότυπο οθόνης στο σελήνιο

how take screenshot selenium

Δοκιμάστε Το Όργανο Μας Για Την Εξάλειψη Των Προβλημάτων

Αυτό το σεμινάριο εξηγεί τη σημασία του Selenium Screenshot και τον τρόπο χρήσης του Ashot για λήψη Screenshot στην εφαρμογή Selenium με παραδείγματα:

Τα στιγμιότυπα οθόνης χρησιμοποιούνται βασικά στην ανάλυση σφαλμάτων. Βοηθούν στην κατανόηση του κατά πόσον η εφαρμογή λειτουργεί σύμφωνα με τις απαιτήσεις του χρήστη ή όχι.

Για κάθε περίπτωση δοκιμής, η έξοδος που λαμβάνεται μπορεί να είναι διαφορετική, μερικές φορές λαμβάνεται η σωστή έξοδος, μερικές φορές λαμβάνουμε σφάλμα, μερικές φορές λαμβάνεται μήνυμα σφάλματος λόγω ελλιπούς ή ανεπαρκούς δεδομένων εισόδου κ.λπ. Το στιγμιότυπο οθόνης βοηθά στην παρακολούθηση των αποδείξεων ενεργειών / εξόδων έλαβε.

=> Δείτε όλα τα σεμινάρια σεληνίου εδώ

Στιγμιότυπα οθόνης σεληνίου

Σε αυτό το σεμινάριο, θα μάθουμε πού χρειάζονται στιγμιότυπα οθόνης σεληνίου. Θα συζητήσουμε το Ashot και πώς μπορούμε να χρησιμοποιήσουμε το Ashot στο Selenium (εγκατάσταση και διαμόρφωση του ashot ()), να μάθουμε να τραβάμε στιγμιότυπα οθόνης στο Selenium (για ολόκληρη την ιστοσελίδα, για ένα μόνο στοιχείο στη σελίδα και για ένα τρέχον ανοιχτό παράθυρο, συγκρίνοντας επίσης 2 εικόνες) και, στη συνέχεια, ρίξτε μια ματιά σε μερικά παραδείγματα όπου συλλαμβάνονται συχνά στιγμιότυπα οθόνης.

Τι θα μάθετε:

Κατανόηση Screenshots Selenium

Σύνδεση Gmail

Η παραπάνω εικόνα είναι ένα παράδειγμα λήψης στιγμιότυπου οθόνης κατά την εκτέλεση κώδικα από τον ιστότοπο του Gmail. Η εικόνα βοηθά στην επιβεβαίωση ότι ο χρήστης έχει συνδεθεί επιτυχώς στο λογαριασμό email με το σωστό όνομα χρήστη και κωδικό πρόσβασης.

Έτσι, τα στιγμιότυπα οθόνης είναι πολύ χρήσιμα στην καταγραφή των ενεργειών / εξόδων που λαμβάνονται μετά την εκτέλεση μιας ενέργειας και ως εκ τούτου βοηθά στην επιβεβαίωση μιας δράσης που εκτελείται χωρίς κανένα πρόβλημα.

Το σελήνιο μπορεί να τραβήξει αυτόματα στιγμιότυπα οθόνης. πρέπει να προσθέσουμε κώδικα για στιγμιότυπο οθόνης στη διαδικασία οποιασδήποτε εκτέλεσης κώδικα όπου χρειάζονται στιγμιότυπα οθόνης.

Πού χρειάζονται στιγμιότυπα οθόνης σεληνίου

Ακολουθούν οι δυνατότητες:

  • Όταν υπάρχει πρόβλημα στην εύρεση ενός στοιχείου σε μια ιστοσελίδα.
  • Όπου υπάρχει χρονικό όριο για την εύρεση στοιχείων ιστού σε μια σελίδα.
  • Όταν παρουσιαστεί σφάλμα ή πρόβλημα στο σύστημα / εφαρμογή.
  • Όταν αντιμετωπίζεται μια αποτυχία ισχυρισμού.

Τι είναι το Ashot

Το Ashot () είναι ένα βοηθητικό πρόγραμμα τρίτων που υποστηρίζεται από το πρόγραμμα οδήγησης ιστού Selenium για τη λήψη στιγμιότυπων οθόνης.

Το Ashot () παρέχει τις παρακάτω λειτουργίες για τη λήψη στιγμιότυπων οθόνης:

  • Λήψη ολόκληρης της σελίδας
  • Σύλληψη του στοιχείου ιστού
  • Σύγκριση εικόνων

Ας δούμε πώς ακριβώς λειτουργεί αυτό στην επόμενη ενότητα.

Χαρακτηριστικά του Ashot:

  • Είναι δυνατόν να τραβήξετε ένα στιγμιότυπο οθόνης ολόκληρης της σελίδας.
  • Μπορείτε επίσης να τραβήξετε ένα στιγμιότυπο οθόνης ενός στοιχείου ιστού, το οποίο υποστηρίζεται σε διάφορες πλατφόρμες όπως το Android Emulator Browser, το iOS Simulator Mobile Safari, τα διάφορα προγράμματα περιήγησης για επιτραπέζιους υπολογιστές).
  • Παρέχει μια ευέλικτη σύγκριση οθόνης.
  • Διακοσμητικά στιγμιότυπα οθόνης.

Η Ashot μπορεί να τραβήξει στιγμιότυπα οθόνης σε τρία βήματα:

  • Καταγράφει ένα στιγμιότυπο οθόνης ολόκληρης της σελίδας.
  • Βρείτε το μέγεθος και τη θέση του στοιχείου.
  • Περικοπεί το αρχικό στιγμιότυπο οθόνης.

Πώς μπορούμε να χρησιμοποιήσουμε το Ashot στο Σελήνιο

Εξετάστε τα παρακάτω βήματα για τη λήψη και τη διαμόρφωση του Ashot στον υπολογιστή σας:

  1. μεταβείτε στο Σύνδεσμος.
  2. Βρείτε την τελευταία έκδοση του αρχείου βάζου που υπάρχει για το Ashot.
  3. Πραγματοποιήστε λήψη και αποθήκευση του αρχείου βάζου σε μια συγκεκριμένη διαδρομή στο μηχάνημά σας.
  4. Τώρα για την προσθήκη του αρχείου βάζου στο έργο σας στο Eclipse - Μεταβείτε στο έργο σας -> Κάντε δεξί κλικ -> μεταβείτε στις ιδιότητες -> επιλέξτε Build Path -> Βιβλιοθήκες -> προσθέστε εξωτερικά βάζα
  5. Περιηγηθείτε στη διαδρομή όπου αποθηκεύεται το αρχείο βάζου που έχετε κατεβάσει.
  6. Επιλέξτε το αρχείο βάζου, κάντε κλικ στο Εφαρμογή και κλείστε.

Πώς να καταγράψετε στιγμιότυπα οθόνης στο σελήνιο

Το Selenium παρέχει ενσωματωμένη λειτουργικότητα για τη λήψη στιγμιότυπων οθόνης. Σύμφωνα με την απαίτηση, Λήψη στιγμιότυπου οθόνης διεπαφή χρησιμοποιείται για τη λήψη στιγμιότυπων οθόνης, κατά την εκτέλεση των σεναρίων Selenium. Έτσι, το Selenium Webdriver βοηθά στη λήψη στιγμιότυπων οθόνης κατά την εκτέλεση κώδικα.

Στην παρακάτω ενότητα, θα μάθουμε για τους διαφορετικούς τύπους στιγμιότυπου οθόνης που καταγράφονται.

Ακολουθούν οι τύποι:

Λήψη στιγμιότυπου οθόνης:

  • Τρέχον ανοιχτό παράθυρο
  • Ολόκληρη η ιστοσελίδα
  • Μόνο ένα συγκεκριμένο στοιχείο ιστού
  • Σύγκριση εικόνας στιγμιότυπου οθόνης με την αρχική εικόνα

Ας κατανοήσουμε λεπτομερώς τα παραπάνω σημεία.

# 1) Τρέχον ανοιχτό παράθυρο

Ας δούμε την εφαρμογή κώδικα για το χειρισμό στιγμιότυπων οθόνης στο Σελήνιο για το τρέχον ανοιχτό παράθυρο:

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

Η παρακάτω εικόνα είναι το αποτέλεσμα της εφαρμογής του παραπάνω κώδικα. Εδώ, ο ιστότοπος OrangeHRM είναι ανοιχτός και καταγράφεται το στιγμιότυπο οθόνης της σελίδας σύνδεσης.

Τρέχον ανοιχτό παράθυρο

(εικόνα πηγή )

Έτσι, μπορούμε να τραβήξουμε στιγμιότυπα οθόνης όπου απαιτείται ποτέ κατά την εκτέλεση κώδικα. Το στιγμιότυπο οθόνης που τραβήχτηκε αποθηκεύεται σε αρχείο με επέκταση .png ή .jpeg. Πρέπει να δώσουμε τη διαδρομή όπου πρέπει να αποθηκευτεί το αρχείο εικόνας.

# 2) Ολόκληρη η ιστοσελίδα

Ας δούμε τον παρακάτω κώδικα εφαρμογής για τη λήψη ενός στιγμιότυπου οθόνης ολόκληρης της σελίδας, με τη βοήθεια του Ashot στο Selenium webdriver. Για αυτό ας εξετάσουμε το παράδειγμα μιας σελίδας (μεταβλητές που καθορίζονται από τον χρήστη Jmeter) από - 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!'); } }

Εδώ, το jmeter-χρήστη-καθορισμένες-μεταβλητές σελίδα του ιστότοπού μας: www.softwaretestinghelp.com ανοίγει και στη συνέχεια έχουμε τραβήξει ένα στιγμιότυπο οθόνης αυτής της πλήρους ιστοσελίδας (με τη βοήθεια του ashot () σε σελήνιο) σε μορφή .png και αποθηκεύτηκε στην επιθυμητή διαδρομή. Με τον ίδιο τρόπο μπορούμε να τραβήξουμε ένα στιγμιότυπο οθόνης ολόκληρης της σελίδας για οποιαδήποτε ιστοσελίδα.

Έτσι, κατά την εφαρμογή του παραπάνω κώδικα για τη λήψη του στιγμιότυπου οθόνης ολόκληρης της σελίδας, η έξοδος που λαμβάνεται είναι όπως φαίνεται στην παρακάτω εικόνα για ένα πλήρες στιγμιότυπο οθόνης ιστοσελίδας.

Ολόκληρη η σελίδα

# 3) Στοιχείο Ιστού

Ας ρίξουμε μια ματιά στον παρακάτω κώδικα εφαρμογής, με τη χρήση του Ashot στο πρόγραμμα οδήγησης web Selenium για τη λήψη στιγμιότυπου οθόνης ενός συγκεκριμένου στοιχείου ιστού στην ιστοσελίδα.

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

Έτσι κατά την εφαρμογή του παραπάνω κώδικα για τη λήψη στιγμιότυπου οθόνης ενός συγκεκριμένου στοιχείου (εδώ καρτέλα Συντήρηση), Η έξοδος που λαμβάνεται είναι όπως φαίνεται στην παρακάτω εικόνα.

Συντήρηση_WebElement 1

Εδώ, επιλέγουμε την καρτέλα 'Συντήρηση' ως στοιχείο για το οποίο απαιτείται ένα στιγμιότυπο οθόνης. Αναφέρετε τη διαδρομή όπου θέλουμε να αποθηκευτεί το στιγμιότυπο οθόνης. Με τον ίδιο τρόπο μπορούμε να τραβήξουμε ένα στιγμιότυπο οθόνης για οποιοδήποτε άλλο στοιχείο επίσης σε οποιονδήποτε τέτοιο ιστότοπο.

# 4) Σύγκριση στιγμιότυπου οθόνης με αρχική εικόνα

Ας ρίξουμε μια ματιά στον παρακάτω κώδικα εφαρμογής με τη χρήση του Ashot στο πρόγραμμα οδήγησης web Selenium για τη λήψη στιγμιότυπου οθόνης ενός στοιχείου λογότυπου στην ιστοσελίδα και τη σύγκριση του με το αρχικό λογότυπο.

Για αυτό ας εξετάσουμε το παράδειγμα του 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 } } }

Έτσι κατά την εφαρμογή του παραπάνω κώδικα για σύγκριση του στιγμιότυπου οθόνης ενός στοιχείου λογότυπου (εδώ το λογότυπο naukri.com), η έξοδος που λαμβάνεται είναι όπως φαίνεται στην παρακάτω εικόνα.

λογότυπο naukri

Εδώ, επιλέγουμε το λογότυπο του 'naukri.com', καταγράφουμε το στιγμιότυπό του και στη συνέχεια συγκρίνεται με το αρχικό λογότυπο. Η διαφορά μεταξύ των εικόνων βρίσκεται χρησιμοποιώντας ενσωματωμένες λειτουργίες. Εάν δεν βρεθεί διαφορά στις 2 εικόνες λογότυπου, το πρόγραμμα εκτυπώνει την έξοδο ως ' Και οι δύο εικόνες λογότυπων ταιριάζουν 'Αλλες εκτυπώσεις' Οι εικόνες λογότυπου είναι διαφορετικές '.

Παραδείγματα όπου συλλαμβάνονται συχνά στιγμιότυπα οθόνης

# 1) Επιβεβαίωση αποσύνδεσης

Για να συνδεθούμε σε έναν ιστότοπο, πρέπει να εισαγάγουμε το σωστό όνομα χρήστη και τον κωδικό πρόσβασης μετά από τον οποίο συνδεόμαστε στον ιστότοπο. Στη συνέχεια, ο χρήστης εκτελεί τις απαιτούμενες επιλογές και μόλις ολοκληρωθεί η εργασία, ο χρήστης αποσυνδέεται.

Έτσι, εάν παρέχουμε έναν κωδικό για στιγμιότυπο οθόνης μετά την αποσύνδεση, θα εμφανιστεί ξανά μια σελίδα σύνδεσης που θα επιβεβαιώνει την ενέργεια αποσύνδεσης. Για περισσότερες λεπτομέρειες, ανατρέξτε στην παρακάτω εικόνα:

επιβεβαίωση αποσύνδεσης

# 2) Επιβεβαίωση νέας εγγραφής

Η προσθήκη κώδικα για στιγμιότυπο οθόνης μετά τη δημιουργία μιας νέας εγγραφής επιβεβαιώνει ότι η εγγραφή δημιουργήθηκε με επιτυχία. Δείτε το παρακάτω στιγμιότυπο οθόνης για περισσότερες λεπτομέρειες.

Επιβεβαίωση νέας εγγραφής

Σε περίπτωση που δεν δημιουργηθεί η εγγραφή, ο κώδικας δεν θα προχωρήσει περαιτέρω για τη λήψη στιγμιότυπου οθόνης και αυτό θα επιβεβαιώσει ότι η εγγραφή δεν δημιουργείται με επιτυχία.

πώς να ανοίξετε ένα αρχείο xml στη λέξη

# 3) Παράδειγμα ελλιπούς / λανθασμένης εξόδου

Αυτό το παράδειγμα περιλαμβάνει τη δημιουργία μιας νέας εγγραφής για τον Τίτλο εργασίας στον ιστότοπο OrangeHRM. Εδώ, το πεδίο Τίτλος εργασίας επισημαίνεται με «*» που σημαίνει ότι είναι υποχρεωτικό πεδίο. Έτσι, η εγγραφή δεν θα δημιουργηθεί έως ότου συμπληρωθούν τα απαιτούμενα πεδία και μόνο τότε θα μπορούσαμε να αποθηκεύσουμε την εγγραφή. Δείτε το παρακάτω στιγμιότυπο οθόνης για περισσότερες λεπτομέρειες.

Παράδειγμα ελλιπούς / λανθασμένης εξόδου

συμπέρασμα

Έτσι, σε αυτό το άρθρο έχουμε δει, όπου χρειάζονται στιγμιότυπα οθόνης Selenium, τότε πώς μπορούμε να χειριστούμε στιγμιότυπα οθόνης στο Selenium, τι είναι το Ashot, πώς μπορεί να ληφθεί, να ρυθμιστεί και να χρησιμοποιηθεί πραγματικά στο Selenium. Κατανοήσαμε την εφαρμογή του κώδικα για το χειρισμό του στιγμιότυπου οθόνης και είδαμε επίσης μερικά παραδείγματα όπου συλλαμβάνονται συχνά στιγμιότυπα οθόνης.

=> Διαβάστε ολόκληρο τον οδηγό σεληνίου

Συνιστώμενη ανάγνωση

^