Selenium Locators: Προσδιορισμός στοιχείων Web χρησιμοποιώντας XPath στο Selenium (παραδείγματα)

selenium locators identify web elements using xpath selenium

Tutorial Selenium Locators: Μάθετε πώς να αναγνωρίζετε στοιχεία Web χρησιμοποιώντας το XPath στο Selenium με παραδείγματα

Στο προηγούμενο σεμινάριο , σας παρουσιάσαμε σε ένα άλλο εργαλείο δοκιμής αυτοματισμού που ονομάζεται Firebug. Δημιουργήσαμε επίσης το δικό μας σενάριο αυτοματοποίησης χρησιμοποιώντας το Firebug και τις δυνατότητές του. Μάθαμε επίσης να τοποθετούμε τις επιθυμητές τροποποιήσεις στο σενάριό μας.

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

Αυτό είναι δικό μας 5ο σεμινάριο στο Selenium Tutorial σειρά.

Τι είναι το Locator;

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

Υπάρχει ένα ευρύ φάσμα στοιχείων ιστού. Τα πιο συνηθισμένα μεταξύ τους είναι:

• Πλαίσιο κειμένου
• Κουμπί
• Πτώση
• Υπερσύνδεσμος
• Πλαίσιο ελέγχου
• Κουμπί ραδιοφώνου

Τι θα μάθετε:

• Τύποι εντοπιστών
• Χρήση αναγνωριστικού ως εντοπισμού
• Χρήση του ClassName ως εντοπισμού
• Χρησιμοποιώντας το όνομα ως εντοπιστής
• Χρήση κειμένου συνδέσμου ως εντοπισμού
• Χρήση του XPath ως εντοπισμού
• συμπέρασμα
• Συνιστώμενη ανάγνωση

Τύποι εντοπιστών

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

Τώρα ας κατανοήσουμε περαιτέρω ασκώντας το καθένα ανεξάρτητα.

Προτού ξεκινήσουμε με τους εντοπιστές, επιτρέψτε μου να αφιερώσω λίγο χρόνο για να παρουσιάσω την υπό δοκιμή εφαρμογή. Θα χρησιμοποιούσαμε το 'https://accounts.google.com/' για τον εντοπισμό διαφορετικών τύπων στοιχείων ιστού χρησιμοποιώντας διαφορετικούς τύπους εντοπισμού.

Χρήση αναγνωριστικού ως εντοπισμού

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

Σε αυτό το δείγμα, θα έχουμε πρόσβαση στο πλαίσιο κειμένου 'Email' που υπάρχει στη φόρμα σύνδεσης στο gmail.com.

Εύρεση αναγνωριστικού στοιχείου ιστού χρησιμοποιώντας το Firebug

τι είναι το stringstream στο c ++

Βήμα 1 : Εκκινήστε το πρόγραμμα περιήγησης ιστού (Firefox) και μεταβείτε στη διεύθυνση 'https://accounts.google.com/'.

Βήμα 2 : Ανοίξτε το firebug (είτε πατώντας F12 είτε μέσω εργαλείων).

Βήμα 3 : Κάντε κλικ στο εικονίδιο επιθεώρησης για να προσδιορίσετε το στοιχείο ιστού.

Βήμα 4 : Τοποθετήστε το δείκτη στο στοιχείο ιστού (πλαίσιο κειμένου ηλεκτρονικού ταχυδρομείου στην περίπτωσή μας) στο οποίο θέλουμε να εκτελέσουμε κάποια ενέργεια. Στην ενότητα firebug, μπορεί κανείς να δει τις αντίστοιχες ετικέτες HTML να επισημαίνονται.

Βήμα 5 : Γνωρίστε το χαρακτηριστικό ID και σημειώστε το. Τώρα πρέπει να επαληθεύσουμε εάν το αναγνωριστικό που αναγνωρίζεται είναι ικανό να βρει το στοιχείο μοναδικά και άψογα.

Σύνταξη : id = id του στοιχείου

Στην περίπτωσή μας, το αναγνωριστικό είναι 'Email'.

Εναλλακτική προσέγγιση:

Αντί να ακολουθήσουμε τα βήματα 2 έως 4, μπορούμε να εντοπίσουμε / επιθεωρήσουμε άμεσα το στοιχείο ιστού κάνοντας δεξί κλικ στο στοιχείο ιστού (Email Textbox) του οποίου η τιμή εντοπισμού πρέπει να ελέγξουμε και κάνοντας κλικ στην επιλογή 'Επιθεώρηση στοιχείου με Firebug'. Έτσι, αυτό το συμβάν κλικ ενεργοποιεί την επέκταση της ενότητας firebug και θα επισημανθεί η αντίστοιχη ετικέτα HTML.

Επαληθεύστε την τιμή εντοπισμού

Υποθέτοντας ότι το πρόγραμμα περιήγησης είναι ανοιχτό και επαναπροσανατολίζεται στη διεύθυνση 'https://accounts.google.com/'.

Βήμα 1 : Εκκινήστε το Selenium IDE.

Βήμα 2 : Κάντε κλικ στην πρώτη σειρά στην ενότητα του προγράμματος επεξεργασίας.

Βήμα 3 : Πληκτρολογήστε 'id = Email', δηλαδή την τιμή εντοπισμού στο πλαίσιο προορισμού.

Βήμα 4 : Κάντε κλικ στο κουμπί Εύρεση. Εάν η παρεχόμενη τιμή εντοπισμού είναι νόμιμη, τότε το πλαίσιο κειμένου Email θα επισημανθεί με κίτρινο χρώμα με πράσινο φθορίζον περίγραμμα γύρω από το πεδίο. Εάν η παρεχόμενη τιμή εντοπισμού είναι λανθασμένη, θα εκτυπωθεί ένα μήνυμα σφάλματος στο παράθυρο καταγραφής στο κάτω μέρος του Selenium IDE.

Περίπτωση 1 - Τιμή εντοπισμού = Σωστό

Περίπτωση 2 - Τιμή εντοπισμού = Λανθασμένη

Βήμα 5 : Για να επαληθεύσει περαιτέρω, ένας χρήστης μπορεί επίσης να εκτελέσει την εντολή 'type' ενάντια στον δεδομένο στόχο παρέχοντας κάποια τιμή στο πεδίο 'Value'. Εάν η εκτέλεση της εντολής εισαγάγει την καθορισμένη τιμή στο πλαίσιο κειμένου Email που σημαίνει ότι ο προσδιορισμένος τύπος εντοπισμού είναι σωστός και προσβάσιμος.

Χρήση του ClassName ως εντοπισμού

Υπάρχει μόνο μια λεπτή διαφορά μεταξύ της χρήσης αναγνωριστικού ως εντοπισμού και της χρήσης του ονόματος τάξης ως εντοπιστής.

Σε αυτό το δείγμα, θα έχουμε πρόσβαση στο 'Need Help;' υπάρχει υπερσύνδεσμος στο κάτω μέρος της φόρμας σύνδεσης στο gmail.com.

Εύρεση ονόματος κλάσης ενός στοιχείου ιστού χρησιμοποιώντας το Firebug

Βήμα 1 : Εντοπίστε / επιθεωρήστε το στοιχείο ιστού (σύνδεσμος 'Χρειάζεστε βοήθεια;') κάνοντας δεξί κλικ στο στοιχείο ιστού του οποίου η τιμή εντοπισμού πρέπει να επιθεωρήσουμε και κάνοντας κλικ στην επιλογή 'Επιθεώρηση στοιχείου με Firebug'.

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

Σύνταξη: class = classname του στοιχείου

Στην περίπτωσή μας, το όνομα κλάσης είναι 'ανάγκη-βοήθεια-αντίστροφη'

Επαληθεύστε την τιμή εντοπισμού

Βήμα 1 : Πληκτρολογήστε 'class = need-help-reverse' στο πλαίσιο στόχου στο Selenium IDE.

Βήμα 2 : Κάντε κλικ στο κουμπί Εύρεση. Παρατηρήστε ότι ο υπερσύνδεσμος θα επισημανθεί με κίτρινο χρώμα με πράσινο φθορίζον περίγραμμα γύρω από το πεδίο.

(Κάντε κλικ για προβολή μεγεθυμένης εικόνας)

Χρησιμοποιώντας το όνομα ως εντοπιστής

Ο εντοπισμός ενός στοιχείου ιστού χρησιμοποιώντας το όνομα είναι πολύ ανάλογος με τους προηγούμενους δύο τύπους εντοπισμού. Η μόνη διαφορά έγκειται στη σύνταξη.

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

Σύνταξη: name = όνομα του στοιχείου

Στην περίπτωσή μας, το όνομα είναι 'Passwd'.

Επαληθεύστε την τιμή εντοπισμού

Βήμα 1 : Πληκτρολογήστε 'name = Passwd' στο πλαίσιο προορισμού και κάντε κλικ στο κουμπί Εύρεση. Σημειώστε ότι το πλαίσιο κειμένου 'Κωδικός πρόσβασης' θα επισημανθεί.

Χρήση κειμένου συνδέσμου ως εντοπισμού

Όλοι οι υπερσύνδεσμοι σε μια ιστοσελίδα μπορούν να αναγνωριστούν χρησιμοποιώντας το Κείμενο Σύνδεσης. Οι σύνδεσμοι σε μια ιστοσελίδα μπορούν να καθοριστούν με τη βοήθεια της ετικέτας αγκύρωσης ( ). Η ετικέτα αγκύρωσης χρησιμοποιείται για τη δημιουργία των υπερσυνδέσμων σε μια ιστοσελίδα και το κείμενο μεταξύ του ανοίγματος και του κλεισίματος των ετικετών αγκύρωσης αποτελεί το κείμενο του συνδέσμου ( Κάποιο κείμενο ).

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

Εύρεση κειμένου συνδέσμου ενός στοιχείου ιστού χρησιμοποιώντας το Firebug

Βήμα 1 : Εντοπίστε / επιθεωρήστε το στοιχείο ιστού (σύνδεσμος 'Δημιουργία λογαριασμού' στην περίπτωσή μας) κάνοντας δεξί κλικ στο στοιχείο ιστού του οποίου η τιμή εντοπισμού πρέπει να επιθεωρήσουμε και κάνοντας κλικ στην επιλογή 'Επιθεώρηση στοιχείου με Firebug'.

Βήμα 2 : Να είστε ενήμεροι για το κείμενο που υπάρχει στο ετικέτες και σημειώστε το. Ως εκ τούτου, αυτό το κείμενο θα χρησιμοποιηθεί για τον μοναδικό προσδιορισμό του συνδέσμου σε μια ιστοσελίδα.

πώς να ανοίξετε το αρχείο eps στα Windows 10

(Κάντε κλικ για προβολή μεγεθυμένης εικόνας)

Σύνταξη: link = κείμενο συνδέσμου του στοιχείου

Στην περίπτωσή μας, το κείμενο του συνδέσμου είναι 'Δημιουργία λογαριασμού'.

Επαληθεύστε την τιμή εντοπισμού

Βήμα 1 : Πληκτρολογήστε 'link = Δημιουργία λογαριασμού', δηλαδή την τιμή εντοπισμού στο πλαίσιο προορισμού στο Selenium IDE.

Βήμα 2 : Κάντε κλικ στο κουμπί Εύρεση. Παρατηρήστε ότι ο σύνδεσμος θα επισημανθεί με κίτρινο χρώμα με πράσινο φθορίζον περίγραμμα γύρω από το χωράφι.

Χρήση του XPath ως εντοπισμού

Το Xpath χρησιμοποιείται για τον εντοπισμό ενός στοιχείου ιστού βάσει της διαδρομής XML του. Το XML σημαίνει Extensible Markup Language και χρησιμοποιείται για την αποθήκευση, οργάνωση και μεταφορά αυθαίρετων δεδομένων. Αποθηκεύει δεδομένα σε ένα ζεύγος κλειδιών-τιμών που μοιάζει πολύ με τις ετικέτες HTML. Και οι δύο είναι οι γλώσσες σήμανσης και δεδομένου ότι εμπίπτουν στην ίδια ομπρέλα, το xpath μπορεί να χρησιμοποιηθεί για τον εντοπισμό στοιχείων HTML.

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

Το Xpath μπορεί να δημιουργηθεί με δύο τρόπους:

Σχετικό Xpath

Το σχετικό Xpath ξεκινά από την τρέχουσα τοποθεσία και προτίθεται με ένα '//'.

Για παράδειγμα: // span (@ class = «Email»)

Απόλυτο Xpath

Το απόλυτο Xpath ξεκινά με μια διαδρομή ρίζας και προτίθεται με ένα '/'.

Για παράδειγμα: / HTML / body / div / div (@ id = «Email»)

κορυφαίες εταιρείες ανάπτυξης ιστοσελίδων στην Ινδία

Βασικά σημεία:

• Το ποσοστό επιτυχίας εύρεσης ενός στοιχείου χρησιμοποιώντας το Xpath είναι πολύ υψηλό. Μαζί με την προηγούμενη δήλωση, το Xpath μπορεί να βρει σχετικά όλα τα στοιχεία σε μια ιστοσελίδα. Έτσι, τα Xpaths μπορούν να χρησιμοποιηθούν για τον εντοπισμό στοιχείων που δεν έχουν αναγνωριστικό, κλάση ή όνομα.
• Η δημιουργία ενός έγκυρου Xpath είναι μια δύσκολη και περίπλοκη διαδικασία. Υπάρχουν διαθέσιμες προσθήκες για τη δημιουργία Xpath, αλλά τις περισσότερες φορές, οι δημιουργημένες Xpaths δεν αναγνωρίζουν σωστά το στοιχείο ιστού.
• Κατά τη δημιουργία του xpath, ο χρήστης πρέπει να γνωρίζει τις διάφορες ονοματολογίες και τα πρωτόκολλα.

Παραδείγματα Selenium XPath:

Έλεγχος Xpath

Η δημιουργία του Xpath γίνεται λίγο πιο απλή χρησιμοποιώντας το Xpath Checker. Το Xpath Checker είναι ένα πρόσθετο του Firefox για αυτόματη δημιουργία Xpath για ένα στοιχείο ιστού. Το πρόσθετο μπορεί να ληφθεί και να εγκατασταθεί όπως οποιοδήποτε άλλο πρόσθετο. Μπορείτε να κατεβάσετε την προσθήκη από το 'https://addons.mozilla.org/en-US/firefox/addon/xpath-checker/'.

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

Κάντε κλικ στο 'Προβολή Xpath' για να δείτε την έκφραση του στοιχείου Xpath. Θα εμφανιστεί ένα παράθυρο προγράμματος επεξεργασίας με την παραγόμενη έκφραση Xpath. Τώρα ο χρήστης έχει την ελευθερία να επεξεργάζεται και να τροποποιεί την παραγόμενη έκφραση Xpath. Τα αντίστοιχα αποτελέσματα θα ενημερωθούν σωρευτικά.

Σημειώστε ότι το XPath Checker είναι διαθέσιμο και για άλλα προγράμματα περιήγησης.

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

Σε αυτό το δείγμα, θα έχουμε πρόσβαση στην εικόνα 'Google' που βρίσκεται στην κορυφή της φόρμας σύνδεσης στο gmail.com.

Δημιουργία Xpath ενός στοιχείου ιστού

Βήμα 1 : Πληκτρολογήστε “// img (@ class =’ logo ’)”, δηλαδή την τιμή εντοπισμού στο πλαίσιο προορισμού εντός του Selenium IDE.

Σύνταξη: Xpath του στοιχείου

Βήμα 2 : Κάντε κλικ στο κουμπί Εύρεση. Παρατηρήστε ότι η εικόνα θα επισημανθεί με κίτρινο χρώμα με πράσινο φθορίζον περίγραμμα γύρω από το πεδίο.

συμπέρασμα

Εδώ είναι οι βασικές αρχές αυτού του άρθρου.

• Οι εντοπιστές είναι οι ιδιότητες HTML ενός στοιχείου ιστού που ενημερώνει το Σελήνιο για το στοιχείο ιστού στο οποίο χρειάζεται να εκτελέσει ενέργειες.
• Υπάρχει ένα ευρύ φάσμα στοιχείων ιστού με τα οποία ένας χρήστης μπορεί να αλληλεπιδρά σε τακτική βάση. Μερικά από αυτά είναι: Textbox, Button, Drop Down, Hyperlink, CheckBox και Radio Button.
• Με το ποικίλο εύρος στοιχείων ιστού έρχεται μια τεράστια επαρχία στρατηγικών / προσεγγίσεων για τον εντοπισμό αυτών των στοιχείων ιστού.
• Μερικοί από τους ευρέως χρησιμοποιούμενους τύπους εντοπισμού είναι ID, ClassName, Link Text, XPath, CSS Selectors και Name.

Σημείωση: Λόγω του γεγονότος ότι η δημιουργία CSS Selector και XPath απαιτεί πολλές προσπάθειες και πρακτική, έτσι η διαδικασία ασκείται μόνο από πιο εξελιγμένους και εκπαιδευμένους χρήστες.

Σε αυτό το σεμινάριο, μάθαμε διαφορετικούς τύπους εντοπιστών, συμπεριλαμβανομένου του Selenium Xpath.

Επόμενο σεμινάριο # 6 : Σε συνέχεια με αυτό το σεμινάριο τύπων Selenium Locator θα μάθουμε πώς να το χρησιμοποιούμε Επιλογέας CSS ως εντοπιστής.

Έχετε απορίες; Ενημερώστε μας στα σχόλια. Θα προσπαθήσουμε να επιλύσουμε όλα.

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

• Selenium Find Element By Text Tutorial με παραδείγματα
• 30+ καλύτερα σεμινάρια σεληνίου: Μάθετε το σελήνιο με πραγματικά παραδείγματα
• Πώς να εντοπίσετε στοιχεία σε προγράμματα περιήγησης Chrome και IE για τη δημιουργία σεναρίων σεληνίου - Σεμινάριο Tutorial # 7
• Χειρισμός Πινάκων Ιστού, Πλαισίων και Δυναμικών Στοιχείων σεναρίου Σεληνίου - Εκπαιδευτικό Σελήνιο # 18
• Χρήση του Selenium Select Class για το χειρισμό των αναπτυσσόμενων στοιχείων σε μια ιστοσελίδα - Selenium Tutorial # 13
• Cucumber Selenium Tutorial: Αγγούρι Java Selenium WebDriver Integration
• Πώς να χρησιμοποιήσετε το CSS Selector για τον προσδιορισμό στοιχείων Web για σενάρια Selenium - Selenium Tutorial # 6
• Ελέγξτε την ορατότητα των στοιχείων Web χρησιμοποιώντας διάφορους τύπους εντολών WebDriver - Selenium Tutorial # 14