Come gestire le tabelle Web dinamiche in Selenium

By: Krishna rungta Krishna rungta
Hours aggiornato

⚡ Riepilogo intelligente

Gestire le tabelle Web dinamiche in Selenium WebDriver insegna come iterare, leggere e convalidare tabelle le cui righe o colonne cambiano in fase di esecuzione, coprendo identificazione, XPath, lookping, ed esempi.

  • 📋 Tabelle dinamiche: Tabelle che caricano il numero di righe e il contenuto in fase di esecuzione.
  • 🧭 Strategia di localizzazione: Crea un percorso XPath con segnaposto per righe e colonne.
  • 🔁 Itera le righe: Eseguire un ciclo findElements senza specificare manualmente il numero di righe.
  • 📊 Valori di lettura: Utilizzare getText() per estract e verificare i dati delle celle.
  • ⏳ Attese intelligenti: WebDriverWait si mette in pausa fino al completamento del rendering delle righe.
  • 🤖 Assistenza AI: Gli strumenti di intelligenza artificiale rilevano automaticamente la struttura e si auto-riparano.
Scopri di più

Come gestire le tabelle Web dinamiche in Selenium

Tabella Web in Selenium

Esistono due tipi di tabelle HTML pubblicate sul Web:

  1. Tabelle statiche: I dati sono statici, ovvero il numero di righe e colonne è fisso.
  2. Tabelle dinamiche: I dati sono dinamici, ovvero il numero di righe e colonne NON è fisso.

Come gestire la tabella dinamica in Selenium

Di seguito è riportato un esempio di tabella Web dinamica in Selenium per le vendite. In base ai filtri della data di input, il numero di righe verrà modificato. Quindi è di natura dinamica.

Gestisci la tabella dinamica in Selenium

Gestire la tabella statica è semplice, ma gestire le tabelle dinamiche in Selenium è un po' difficile poiché le righe e le colonne non sono costanti.

Utilizzo di X-Path per individuare gli elementi della tabella Web

Prima di individuare l'elemento web, capiamo innanzitutto:

Cos'è un elemento web?

Gli elementi Web non sono altro che elementi HTML come caselle di testo, pulsanti di scelta rapida a discesa, pulsanti di invio, ecc. Questi elementi HTML sono scritti con inizia a tag e termina con un fine etichetta.

Per esempio,

Il mio primo documento HTML.

Passaggi per ottenere il percorso X dell'elemento web che vogliamo individuare.

Passo 1) In Chrome, vai a https://demo.guru99.com/test/web-table-element.php

Utilizzo di X-Path per individuare gli elementi della tabella Web

Passo 2) Fare clic con il tasto destro sull'elemento web il cui x-path deve essere recuperato. Nel nostro caso, fare clic con il tasto destro su "Company" Selezionare l'opzione Inspect. Verrà visualizzata la seguente schermata:

Utilizzo di X-Path per individuare gli elementi della tabella Web

Passo 3) Fare clic con il tasto destro sull'elemento Web evidenziato > Seleziona Copia -> Copia l'opzione x-path.

Utilizzo di X-Path per individuare gli elementi della tabella Web

Passo 4) Utilizzare il percorso X copiato “//*[@id=”leftcontainer”]/table/thead/tr/th [1]” in Selenium WebDriver per individuare l'elemento.

Esempio: recuperare il numero di righe e colonne dalla tabella Web dinamica

Durante la gestione della tabella Web dinamica in Selenium, non possiamo prevederne il numero di righe e colonne.

utilizzando Selenium driver web, possiamo trovare

  • Numero di righe e colonne della tabella Web in Selenium
  • Dati della riga X o della colonna Y.

Di seguito è riportato il programma per recuperare il numero totale di righe e colonne per la gestione della tabella Web Selenium:

Recupera il numero di righe e colonne

import java.text.ParseException;
import java.util.List;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
public class Noofrowsandcols {
    
public static void main(String[] args) throws ParseException {
    	WebDriver wd;
	  System.setProperty("webdriver.chrome.">driver","G://chromedriver.exe");
	  wd= new ChromeDriver();
        wd.get("https://demo.guru99.com/test/web-table-">element.php");         
        //No.of Columns
        List <webelement> col = wd.findElements(By.xpath(".//*[@id=\"leftcontainer\"]/table/thead/tr/th"));
        System.out.println("No of cols are : " +col.size()); 
        //No.of rows 
        List <webelement> rows = wd.findElements(By.xpath(".//*[@id='leftcontainer']/table/tbody/tr/td[1]")); 
        System.out.println("No of rows are : " + rows.size());
        wd.close();
    }
}

Code Spiegazione:

  • Qui abbiamo prima dichiarato l'oggetto Web Driver "wd" e lo abbiamo inizializzato sul driver Chrome.
  • Usiamo Lista al numero totale di colonne in “col”.
  • I comandi findElements restituiscono un elenco di TUTTI gli elementi che corrispondono al localizzatore specificato
  • utilizzando findElements e X-path //*[@id=\”leftcontainer\”]/table/thead/tr/th otteniamo tutte le colonne
  • Allo stesso modo, ripetiamo il processo per le righe.

Produzione:

Recupera il numero di righe e colonne

ARTICOLI CORRELATI

Esempio: recuperare il valore della cella di una particolare riga e colonna della tabella dinamica

Supponiamo che ce ne servano 3rd riga della tabella e i dati della sua seconda cella. Vedi la tabella qui sotto-

Recupera il valore della cella di una particolare riga e colonna

Nella tabella sopra, i dati vengono aggiornati regolarmente dopo un certo periodo di tempo. I dati che proverai a recuperare saranno diversi dallo screenshot sopra. Tuttavia, il codice rimane lo stesso. Ecco un programma di esempio per ottenere il 3rd riga e 2nd i dati della colonna.

Recupera il valore della cella di una particolare riga e colonna

import java.text.ParseException;
import java.util.List;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import java.util.concurrent.TimeUnit;


public class RowandCell {
    public static void main(String[] args) throws ParseException {
    	WebDriver wd;
		System.setProperty("webdriver.chrome.">driver","G://chromedriver.exe");
		 wd= new ChromeDriver();
		 wd.get("https://demo.guru99.com/test/web-table-">element.php"); 
		 wd.manage().timeouts().implicitlyWait(20, TimeUnit.SECONDS);
		 WebElement baseTable = wd.findElement(By.tagName("table"));
		  
		 //To find third row of table
		 WebElement tableRow = baseTable.findElement(By.xpath("//*[@id=\"leftcontainer\"]/table/tbody/tr[3]"));
         String rowtext = tableRow.getText();
		 System.out.println("Third row of table : "+rowtext);
		    
		    //to get 3rd row's 2nd column data
		    WebElement cellIneed = tableRow.findElement(By.xpath("//*[@id=\"leftcontainer\"]/table/tbody/tr[3]/td[2]"));
		    String valueIneed = cellIneed.getText();
		    System.out.println("Cell value is : " + valueIneed); 
		    wd.close();
    }
}

Code Spiegazione:

  • La tabella viene individuata utilizzando la proprietà locator "tagname".
  • utilizzando XPath “//*[@id=\”leftcontainer\”]/table/tbody/tr[3]” trova i 3rd row e ne ottiene il testo utilizzando la funzione getText()
  • Utilizzando Xpath “//*[@id=\”leftcontainer\”]/table/tbody/tr[3]/td[2]” trova la seconda cella in 2rd row e ne ottiene il testo utilizzando la funzione getText()

Uscita:

Recupera il valore della cella di una particolare riga e colonna della tabella dinamica

Esempio: ottenere il massimo di tutti i valori in una colonna della tabella dinamica

In questo esempio, otterremo il massimo di tutti i valori in una particolare colonna.

Fare riferimento alla seguente tabella:

Ottieni il massimo di tutti i valori in una colonna della tabella dinamica

Ecco il codice

Ottieni il massimo di tutti i valori in una colonna della tabella dinamica

import java.text.ParseException;
import java.util.List;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import java.text.NumberFormat;


public class MaxFromTable {
    public static void main(String[] args) throws ParseException {
    	WebDriver wd;
		System.setProperty("webdriver.chrome.">driver","G://chromedriver.exe");
		 wd= new ChromeDriver();
		 wd.get("https://demo.guru99.com/test/web-table-">element.php"); 
		 String max;
	     double m=0,r=0;
		 
	       //No. of Columns
	        List <webelement> col = wd.findElements(By.xpath(".//*[@id='leftcontainer']/table/thead/tr/th"));
	        System.out.println("Total No of columns are : " +col.size());
	        //No.of rows
	        List <webelement> rows = wd.findElements(By.xpath (".//*[@id='leftcontainer']/table/tbody/tr/td[1]"));
	        System.out.println("Total No of rows are : " + rows.size());
	        for (int i =1;i<rows.size();i++)
	        {    
	            max= wd.findElement(By.xpath("html/body/div[1]/div[5]/table/tbody/tr[" + (i+1)+ "]/td[4]")).getText();
	            NumberFormat f =NumberFormat.getNumberInstance(); 
	            Number num = f.parse(max);
	            max = num.toString();
	            m = Double.parseDouble(max);
	            if(m>r)
	             {    
	                r=m;
	             }
	        }
	        System.out.println("Maximum current price is : "+ r);
    }
}

</webelement></webelement>

Code Spiegazione:

  • Utilizzando il driver Chrome individuiamo la tabella Web e otteniamo il numero totale di righe utilizzando XPath “.//*[@id='leftcontainer']/table/tbody/tr/td[1]”
  • Utilizzando il ciclo for, iteriamo sul numero totale di righe e recuperiamo i valori uno per uno. Per ottenere la riga successiva utilizziamo (i+1) in XPath
  • Confrontiamo il vecchio valore con il nuovo valore e il valore massimo viene stampato alla fine del ciclo for

Produzione

Ottieni il massimo di tutti i valori in una colonna della tabella dinamica

Esempio: ottenere tutti i valori di una tabella dinamica

Considera la seguente tabella: https://demo.guru99.com/test/table.html

Ottieni tutti i valori di una tabella dinamica

Il numero di colonne per ciascuna riga è diverso.

Qui la riga numero 1, 2 e 4 ha 3 celle, la riga numero 3 ha 2 celle e la riga numero 5 ha 1 cella.

Dobbiamo ottenere i valori di tutte le celle

Ecco il codice:

Ottieni tutti i valori di una tabella dinamica

import java.text.ParseException;
import java.util.List;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import java.util.concurrent.TimeUnit;
import org.openqa.selenium.chrome.ChromeDriver;



public class NofRowsColmns {
    public static void main(String[] args) throws ParseException {
    	WebDriver wd;
    	System.setProperty("webdriver.chrome.">driver","G://chromedriver.exe");
    	wd = new ChromeDriver();
    	wd.manage().timeouts().implicitlyWait(5, TimeUnit.SECONDS);
    	wd.get("https://demo.guru99.com/test/table.html");
    	//To locate table.
    	WebElement mytable = wd.findElement(By.xpath("/html/body/table/tbody"));
    	//To locate rows of table. 
    	List < WebElement > rows_table = mytable.findElements(By.tagName("tr"));
    	//To calculate no of rows In table.
    	int rows_count = rows_table.size();
    	//Loop will execute till the last row of table.
    	for (int row = 0; row < rows_count; row++) {
    	    //To locate columns(cells) of that specific row.
    	    List < WebElement > Columns_row = rows_table.get(row).findElements(By.tagName("td"));
    	    //To calculate no of columns (cells). In that specific row.
    	    int columns_count = Columns_row.size();
    	    System.out.println("Number of cells In Row " + row + " are " + columns_count);
    	    //Loop will execute till the last cell of that specific row.
    	    for (int column = 0; column < columns_count; column++) {
    	        // To retrieve text from that specific cell.
    	        String celtext = Columns_row.get(column).getText();
    	        System.out.println("Cell Value of row number " + row + " and column number " + column + " Is " + celtext);
    	    }
    	    System.out.println("-------------------------------------------------- ");
    	}
   	}
}

Code Spiegazione:

  • rows_count fornisce il numero totale di righe
  • per ogni riga otteniamo il numero totale di colonne utilizzando rows_table.get(row).findElements(By.tagName("td"));
  • Iteriamo attraverso ogni colonna e ogni riga e recuperiamo i valori.

Uscita:

Ottieni tutti i valori di una tabella dinamica

DOMANDE FREQUENTI

Una tabella con righe o colonne che cambiano in fase di esecuzione tramite AJAX o filtri.

L'IA rileva automaticamente la struttura, genera XPath e corregge automaticamente i selettori quando le colonne si spostano.

Sì. Copilot genera XPath riga-ciclo, getText extraczione e asserzioni.

//table[@id]//tr[ROW]/td[COL] con i segnaposto sostituiti all'interno dei cicli.

Utilizzare WebDriverWait con visibilityOfElementLocated sulla tabella.

Scorri ogni cella della colonna, analizza il testo, track il valore più alto.

La tabella è stata ri-renderizzata. Riposizionare gli elementi all'interno del ciclo.

Utilizzare driver.findElements(By.xpath(“//table//tr”)).size().

Riassumi questo post con: