Πώς να επαληθεύσετε την επεξήγηση εργαλείου Selenium

⚡ Έξυπνη Σύνοψη

Επαλήθευση συμβουλής εργαλείου σε Selenium Το WebDriver καλύπτει δύο αξιόπιστα μοτίβα για την επαλήθευση κειμένου tooltip: την άμεση ανάγνωση του χαρακτηριστικού HTML title και τη χρήση του Actions API για την τοποθέτηση του δείκτη του ποντικιού πάνω από στοιχεία που αποδίδουν δυναμικά. JavaΕπεξηγήσεις εργαλείων script ή jQuery.

💡 Βασική Αρχή: Μια συμβουλή εργαλείου είναι κείμενο που εκτίθεται όταν τοποθετείτε τον δείκτη του ποντικιού, επομένως η στρατηγική επαλήθευσης εξαρτάται από το πού αποθηκεύει το πρόγραμμα περιήγησης αυτό το κείμενο στο DOM.
🏷️ Στατικές συμβουλές εργαλείων: Για συμβουλές εργαλείων που βασίζονται σε τίτλους HTML, καλέστε getAttribute("title") or getDomAttribute("title") και συγκρίνετε με την αναμενόμενη συμβολοσειρά.
🖱️ Δυναμικές συμβουλές εργαλείων: Για συμβουλές εργαλείων jQuery, CSS ή plugin, χρησιμοποιήστε την κλάση Actions με moveToElement(target).build().perform() πριν διαβάσετε το στοιχείο συμβουλής εργαλείου.
️ καλύτερη πρακτική: Περιμένετε να γίνει ορατό το κοντέινερ συμβουλής εργαλείου μετά την τοποθέτηση του δείκτη του ποντικιού και, στη συνέχεια, επιβεβαιώστε το κείμενο με getText() για να αποφύγετε παλιές ή κενές αναγνώσεις.
🚀 Selenium Συμβουλή για το 4: Ζεύγος Selenium Διαχειριστής με σαφείς αναμονές αντί για Thread.sleep για σταθερούς ελέγχους συμβουλών χωρίς διαδρομή προγράμματος οδήγησης.

Περισσότερα

Επεξήγηση εργαλείου Selenium

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

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

Σήμερα, πολλά πρόσθετα (plugins) είναι διαθέσιμα για την υλοποίηση tooltip. Οι προηγμένες tooltips με στυλ, απόδοση, εικόνες και συνδέσμους δημιουργούνται χρησιμοποιώντας JavaΠρόσθετα script ή jQuery ή με συμβουλές εργαλείων μόνο για CSS.

Για να αποκτήσετε πρόσβαση ή να επαληθεύσετε στατικές συμβουλές εργαλείων που έχουν υλοποιηθεί μέσω του χαρακτηριστικού HTML "title", χρησιμοποιήστε το getAttribute("title") μέθοδος στο WebElement. Η τιμή που επιστρέφεται (το κείμενο της συμβουλής εργαλείου) συγκρίνεται με μια αναμενόμενη τιμή για επαλήθευση.
Για άλλες υλοποιήσεις συμβουλών εργαλείου, χρησιμοποιήστε το "API για προχωρημένους αλληλεπιδράσεις χρήστη" που παρέχεται από το WebDriver για να δημιουργήσετε το εφέ τοποθέτησης του ποντικιού και, στη συνέχεια, να ανακτήσετε την συμβουλή εργαλείου για το στοιχείο.

Σύντομη περιγραφή του API Advanced User Interactions

Το API για προχωρημένους αλληλεπιδράσεις χρήστη (Advanced User Interactions API) εμφανίζει ενέργειες χρήστη όπως μεταφορά και απόθεση, τοποθέτηση του δείκτη του ποντικιού, πολλαπλή επιλογή, πάτημα και απελευθέρωση πλήκτρων και άλλες ενέργειες πληκτρολογίου ή ποντικιού σε μια ιστοσελίδα.

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

Πριν το άλμαping σε σενάρια, ας δούμε τις κλάσεις και τις μεθόδους που χρειαζόμαστε για να μετακινήσουμε ένα στοιχείο slider κατά μια μετατόπιση.

Βήμα 1) Για να χρησιμοποιήσετε το API, εισαγάγετε τα ακόλουθα πακέτα και κλάσεις:

Βήμα 2) Δημιουργήστε ένα αντικείμενο της κλάσης "Actions" και δημιουργήστε την ακολουθία ενεργειών χρήστη. Η κλάση Actions δημιουργεί αλυσιδωτές ενέργειες όπως moveToElement() και dragAndDrop(). Το αντικείμενο driver διαβιβάζεται ως παράμετρος στον κατασκευαστή του.

Βήμα 3) Δημιουργήστε ένα αντικείμενο Action χρησιμοποιώντας τη μέθοδο build() της κλάσης "Actions". Καλέστε τη μέθοδο perform() για να εκτελέσετε κάθε ενέργεια που βρίσκεται σε ουρά στο εργαλείο δημιουργίας.

Έχουμε δει πώς να χρησιμοποιούμε μερικές από τις μεθόδους Ενεργειών χρήστη που παρέχονται από το API: clickAndHold(element), moveByOffset(10, 0) και release(). Το API αποκαλύπτει πολλές περισσότερες.

Υλοποίηση Tooltip vs. Selenium Προσέγγιση επαλήθευσης

Τύπος συμβουλής εργαλείου	Πώς αποδίδεται	Selenium Προσέγγιση
Χαρακτηριστικό τίτλου HTML	Κείμενο αποθηκευμένο στο ίδιο το στοιχείο. Το πρόγραμμα περιήγησης εμφανίζεται όταν τοποθετείτε τον δείκτη του ποντικιού.	Διαβάστε με `getAttribute("title")` or `getDomAttribute("title")`Δεν χρειάζεται τοποθέτηση του δείκτη του ποντικιού.
Πρόσθετο jQuery / JS	Το dedicated div εμφανίζεται δίπλα στο στοιχείο όταν τοποθετείτε το ποντίκι πάνω από αυτό.	Χρήση ενεργειών `moveToElement(target).perform()`, περιμένετε και, στη συνέχεια, διαβάστε το στοιχείο συμβουλής εργαλείου με `getText()`.
Επεξήγηση εργαλείου μόνο για CSS	Ψευδοστοιχείο ή siblit div εναλλάσσεται με `:hover`.	Ενεργοποιήστε την τοποθέτηση του δείκτη του ποντικιού με την επιλογή Ενέργειες και διαβάστε το κείμενο που αποδόθηκε ή το υπολογισμένο στυλ.

Πώς να επαληθεύσετε (χειριστείτε) την επεξήγηση εργαλείου Selenium

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

Σενάριο 1: Η συμβουλή εργαλείου υλοποιείται χρησιμοποιώντας το χαρακτηριστικό "title".
Σενάριο 2: Το Tooltip υλοποιείται χρησιμοποιώντας ένα πρόσθετο jQuery.

Σενάριο 1: Χαρακτηριστικό HTML “title”

Για αυτήν την περίπτωση, χρησιμοποιούμε τον ιστότοπο-παράδειγμα https://demo.guru99.com/test/social-icon.html και επαληθεύστε την επεξήγηση του εικονιδίου "github" επάνω δεξιά στη σελίδα.

Αρχικά εντοπίζουμε το στοιχείο, στη συνέχεια διαβάζουμε την ιδιότητά του "title" και το συγκρίνουμε με το αναμενόμενο κείμενο συμβουλής εργαλείου.

Επειδή η συμβουλή εργαλείου βρίσκεται στο χαρακτηριστικό "title", δεν αυτοματοποιούμε καν την τοποθέτηση του ποντικιού κατά την τοποθέτηση του δείκτη του ποντικιού. Απλώς ανακτούμε την τιμή του χαρακτηριστικού με τη μέθοδο getAttribute().

Εδώ είναι ο κωδικός:

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.*;

public class ToolTip {
    public static void main(String[] args) {

        String baseUrl = "https://demo.guru99.com/test/social-icon.html";
        System.setProperty("webdriver.chrome.driver", "G:\\chromedriver.exe");
        WebDriver driver = new ChromeDriver();
        driver.get(baseUrl);
        String expectedTooltip = "Github";

        // Find the Github icon at the top right of the header
        WebElement github = driver.findElement(By.xpath(".//*[@class='soc-ico show-round']/a[4]"));

        // Read the "title" attribute value of the Github icon
        String actualTooltip = github.getAttribute("title");

        // Assert that the tooltip value matches the expected one
        System.out.println("Actual Title of Tool Tip " + actualTooltip);
        if (actualTooltip.equals(expectedTooltip)) {
            System.out.println("Test Case Passed");
        }
        driver.close();
    }
}

Επεξήγηση κωδικού:

Βρείτε το WebElement που αντιπροσωπεύει το εικονίδιο "github".
Διαβάστε το χαρακτηριστικό "title" με τη μέθοδο getAttribute().
Ορίστε την τιμή σε σχέση με το αναμενόμενο κείμενο συμβουλής εργαλείου.

Selenium 4 συμβουλή: Προτιμώ getDomAttribute("title") για το χαρακτηριστικό literal HTML, και έστω Selenium Ο διαχειριστής επιλύει το πρόγραμμα οδήγησης αντί για σκληρό κώδικα chromedriver.exe.

Σενάριο 2: Πρόσθετο jQuery

Πολλά πρόσθετα (plugins) jQuery εφαρμόζουν tooltips και το καθένα αποδίδεται ελαφρώς διαφορετικά.

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

Για αυτήν την επίδειξη, χρησιμοποιούμε το στυλ "jQuery Tools Tooltip".

Ανοικτό https://demo.guru99.com/test/tooltip.html; τοποθετώντας τον δείκτη του ποντικιού πάνω από την επιλογή "Λήψη τώρα" αποκαλύπτεται μια προηγμένη επεξήγηση εργαλείου με μια εικόνα, ένα φόντο επεξήγησης, έναν μικρό πίνακα και έναν σύνδεσμο με δυνατότητα κλικ.

Αν ελέγξετε την πηγή, το div που αντιπροσωπεύει την συμβουλή εργαλείου βρίσκεται ήδη δίπλα στον σύνδεσμο "Λήψη τώρα". Η ετικέτα script παρακάτω ελέγχει πότε εμφανίζεται.

Τώρα επαληθεύουμε το κείμενο του συνδέσμου που εμφανίζεται μέσα στην επεξήγηση εργαλείου.

Αρχικά, εντοπίστε το WebElement για την επιλογή "Λήψη τώρα". Χρησιμοποιήστε το Interactions API για να μετακινηθείτε στο στοιχείο (τοποθέτηση ποντικιού). Στη συνέχεια, βρείτε το WebElement που αντιστοιχεί στον σύνδεσμο μέσα στην εμφανιζόμενη συμβουλή εργαλείου και επαληθεύστε το κείμενό του σε σχέση με την αναμενόμενη τιμή.

Εδώ είναι ο κωδικός:

import org.openqa.selenium.interactions.Actions;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.*;

public class JqueryToolTip {
    public static void main(String[] args) {

        String baseUrl = "https://demo.guru99.com/test/tooltip.html";
        System.setProperty("webdriver.chrome.driver", "G:\\chromedriver.exe");

        WebDriver driver = new ChromeDriver();
        String expectedTooltip = "What's new in 3.2";
        driver.get(baseUrl);

        WebElement download = driver.findElement(By.xpath(".//*[@id='download_now']"));
        Actions builder = new Actions(driver);

        // Hover over the "Download now" link to reveal the tooltip
        builder.moveToElement(download).build().perform();

        WebElement toolTipElement = driver.findElement(By.xpath(".//*[@class='box']/div/a"));
        String actualTooltip = toolTipElement.getText();

        System.out.println("Actual Title of Tool Tip " + actualTooltip);
        if (actualTooltip.equals(expectedTooltip)) {
            System.out.println("Test Case Passed");
        }
        driver.close();
    }
}

Code Επεξήγηση:

Εντοπίστε το WebElement που αντιστοιχεί στο στοιχείο "Λήψη τώρα" στο οποίο θα τοποθετήσετε το ποντίκι.
Χρησιμοποιήστε το Interactions API για να τοποθετήσετε τον κέρσορα στο "Λήψη τώρα".
Μόλις η συμβουλή εργαλείου είναι ορατή, εντοπίστε το WebElement που αντιπροσωπεύει τον σύνδεσμο μέσα στην συμβουλή εργαλείου (την ετικέτα "a").
Διαβάστε το κείμενο της συμβουλής εργαλείου με getText() και συγκρίνετέ το με την αναμενόμενη τιμή που είναι αποθηκευμένη στο expectedTooltip.

Συχνές Ερωτήσεις

Εάν η συμβουλή εργαλείου έχει δημιουργηθεί χρησιμοποιώντας το χαρακτηριστικό HTML title, καλέστε την getAttribute(“title”) ή την getDomAttribute(“title”) στο WebElement και συγκρίνετε το κείμενο που επιστράφηκε με την αναμενόμενη τιμή.

Χρησιμοποιήστε την κλάση Actions για να moveToElement(target).perform(), περιμένετε μέχρι να γίνει ορατό το στοιχείο tooltip και, στη συνέχεια, διαβάστε το κείμενο ή το χαρακτηριστικό του με την getText() και επιβεβαιώστε την τιμή.

Επιστρέφει null όταν το στοιχείο δεν έχει χαρακτηριστικό title ή το κείμενο της συμβουλής εργαλείου αποδίδεται δυναμικά μέσω ξεχωριστού div. Επιθεωρήστε το DOM και στοχεύστε το πραγματικό κοντέινερ της συμβουλής εργαλείου.

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

Ναι. Οι σύγχρονοι βοηθοί τεχνητής νοημοσύνης σαρώνουν τη σελίδα, ανιχνεύουν στοιχεία που μπορούν να τοποθετηθούν σε αιωρούμενο χώρο και δημιουργούν αρχεία έτοιμα προς εκτέλεση. Selenium σενάρια με ισχυρισμούς, μειώνοντας σημαντικά την προσπάθεια χειροκίνητης δημιουργίας σεναρίων για την κάλυψη των tooltip.