Come verificare la descrizione comando in Selenium webdriver

Descrizione comando inserita Selenium

A Descrizione comando inserita Selenium è un testo che appare quando il mouse passa sopra un oggetto in una pagina web. L'oggetto può essere un collegamento, un'immagine, un pulsante, un'area di testo, ecc. Il testo del tooltip spesso fornisce ulteriori informazioni sull'oggetto su cui l'utente posiziona il cursore del mouse.

I tooltip venivano tradizionalmente implementati come attributo "titolo" di un elemento. Il valore di questo attributo veniva mostrato come descrizione comando al passaggio del mouse. Questo è un testo statico che fornisce informazioni sull'elemento senza stile.

Ora sono disponibili molti plugin per l'implementazione dei "tooltips". Vengono implementate descrizioni comandi avanzate con stile, rendering, immagini e collegamenti JavaPlug-in script/jQuery o utilizzo di tooltip CSS.

Per accedere o verificare i tooltip statici implementati utilizzando l'attributo HTML “title”, possiamo semplicemente utilizzare il metodo getAttribute (“title”) del WebElement. Il valore restituito da questo metodo (che è il testo della descrizione comando) viene confrontato con un valore previsto per la verifica.
Per altre forme di implementazioni di tooltip, dovremo utilizzare l'"API Interazioni utente avanzate" fornita dal Web Driver per creare l'effetto al passaggio del mouse e quindi recuperare il tooltip per l'elemento.

Una breve descrizione dell'API Advanced User Interactions

L'API Advanced User Interactions fornisce l'API per le azioni dell'utente come trascinamento della selezione, passaggio del mouse, selezione multipla, pressione e rilascio di tasti e altre azioni utilizzando la tastiera o il mouse su una pagina Web.

Puoi fare riferimento a questo link per maggiori dettagli sull'API.

Qui vediamo come utilizzare un paio di classi e metodi di cui avremmo bisogno per spostare un elemento slider di un offset.

Passo 1) Per utilizzare l'API, è necessario importare i seguenti pacchetti/classi:

Passo 2) Crea un oggetto della classe "Azioni" e costruisci la sequenza delle azioni dell'utente. La classe Actions viene utilizzata per creare la sequenza di azioni dell'utente come moveToElement(), dragAndDrop() ecc. Vari metodi relativi alle azioni dell'utente sono forniti dall'API.

L'oggetto driver viene fornito come parametro al relativo costruttore.

Passo 3) Crea un oggetto azione utilizzando il metodo build() della classe "Azioni". Chiama il metodo perform() per eseguire tutte le azioni create dall'oggetto Actions (builder qui).

Abbiamo visto come utilizzare alcuni dei metodi User Actions forniti dall'API – clickAndHold(element), moveByOffset(10,0), release(). L'API fornisce molti di questi metodi.

Fare riferimento a link per ulteriori dettagli.

Come verificare (gestire) la descrizione comando in Selenium

Vediamo la dimostrazione dell'accesso e della verifica dei suggerimenti nello scenario semplice

Scenario 1: la descrizione comando viene implementata utilizzando l'attributo "titolo".
Scenario 2: la descrizione comando viene implementata utilizzando un plug-in jQuery.

Scenario 1: attributo HTML "titolo".

In questo caso, prendiamo il sito di esempio: https://demo.guru99.com/test/social-icon.html.

Cercheremo di verificare il tooltip dell'icona “github” in alto a destra della pagina.

Per fare ciò, troveremo prima l'elemento, otterremo il suo attributo 'titolo' e verificheremo con il testo del suggerimento previsto.

Dato che presupponiamo che il suggerimento sia nell'attributo "titolo", non stiamo nemmeno automatizzando l'effetto del passaggio del mouse ma stiamo semplicemente recuperando il valore dell'attributo utilizzando il metodo "getAttribute()".

Ecco il codice

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]"));	
        
        //get the value of the "title" attribute of the github icon		
        String actualTooltip = github.getAttribute("title");	
        
        //Assert the tooltip's value is as expected 		
        System.out.println("Actual Title of Tool Tip"+actualTooltip);							
        if(actualTooltip.equals(expectedTooltip)) {							
            System.out.println("Test Case Passed");					
        }		
        driver.close();			
   }		
}

Spiegazione del codice

Trova il WebElement che rappresenta l'icona "github".
Ottieni il suo attributo "titolo" utilizzando il metodo getAttribute().
Dichiarare il valore rispetto al valore della descrizione comando previsto.

Scenario 2: plugin JQuery

Sono disponibili numerosi plugin JQuery per implementare i tooltip e ognuno ha una forma di implementazione leggermente diversa.

Alcuni plugin si aspettano che il tooltip HTML sia sempre presente accanto all'elemento per il quale è applicabile il tooltip, mentre gli altri creano un tag "div" dinamico, che appare al volo mentre si passa sopra l'elemento.

Per la nostra dimostrazione, consideriamo il metodo "jQuery Tools Tooltip" per l'implementazione del tooltip.

Qui nell'URL – https://demo.guru99.com/test/tooltip.html puoi vedere la demo in cui passando il mouse su "Scarica ora", otteniamo un suggerimento avanzato con un'immagine, uno sfondo di richiamo, una tabella e un collegamento al suo interno su cui è possibile fare clic.

Se guardi la fonte qui sotto, puoi vedere che il tag div che rappresenta il tooltip è sempre presente accanto al tag del collegamento "Scarica ora". Tuttavia, il codice all'interno del tag script sottostante controlla quando deve apparire.

Proviamo a verificare solo il testo del collegamento nel tooltip per la nostra dimostrazione qui.

Troveremo innanzitutto il WebElement corrispondente alla voce “Scarica ora”. Quindi, utilizzando l'API Interactions, ci sposteremo sull'elemento (al passaggio del mouse). Successivamente, troveremo il WebElement che corrisponde al collegamento all'interno del tooltip visualizzato e lo verificheremo rispetto al testo previsto.

Ecco il codice

import org.openqa.selenium.interactions.Action;		
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);							

        builder.clickAndHold().moveToElement(download);					
        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();			
   }		
}

Spiegazione del codice

Trova il WebElement che corrisponde all'elemento "scarica ora" su cui passeremo il mouse.
Utilizzando l'API Interazioni, passa il mouse su "Scarica ora".
Supponendo che venga visualizzato il tooltip, trova il WebElement che corrisponde al collegamento all'interno del tooltip, ovvero il tag "a".
Verifica il testo della descrizione comando del collegamento recuperato utilizzando getText() rispetto a un valore previsto che abbiamo memorizzato in "expectedToolTip"

Sommario

In questo tutorial hai imparato come accedere alle descrizioni comandi utilizzando Selenium Driver Web.

I suggerimenti sugli strumenti sono implementati in diversi modi:

L'implementazione di base si basa sull'attributo "titolo" dell'HTML. getAttribute(title) ottiene il valore del tooltip.
Altre implementazioni di suggerimenti come JQuery, i suggerimenti CSS richiedono l'API Interazioni per creare l'effetto al passaggio del mouse

API Interazioni utente avanzate–

moveToElement(elemento) della classe Actions viene utilizzato per posizionare il mouse su un elemento.
Il metodo Build() della classe Actions crea la sequenza di azioni dell'utente in un oggetto Action.
Perform() della classe Action esegue tutta la sequenza di azioni dell'utente contemporaneamente.

Per verificare un tooltip, dobbiamo prima posizionare il mouse sull'elemento, quindi trovare l'elemento che corrisponde al tooltip e ottenere il suo testo o altri valori da verificare rispetto ai valori attesi.

Potrebbe piacerti: