Як працювати з динамічними веб-таблицями в Selenium
Веб-таблиця в Selenium
В Інтернеті опубліковано два типи таблиць HTML-
- Статичні таблиці: дані статичні, тобто кількість рядків і стовпців фіксована.
- Динамічні таблиці: дані динамічні, тобто кількість рядків і стовпців НЕ фіксована.
Як працювати з динамічною таблицею в Selenium
Нижче наведено приклад динамічної веб-таблиці в Selenium для продажу. На основі фільтрів дати введення кількість рядків буде змінено. Отже, він має динамічний характер.
Працювати зі статичною таблицею легко, але працювати з динамічними таблицями Selenium трохи складніше, оскільки рядки та стовпці непостійні.
Використання X-Path для пошуку елементів веб-таблиці
Перш ніж знайти веб-елемент, давайте розберемося,
Що таке веб-елемент?
Веб-елементи — це не що інше, як елементи HTML, як-от текстове поле, перемикачі спадних меню, кнопки надсилання тощо. Ці елементи HTML написані за допомогою старт і закінчується на an кінець бирка.
Наприклад,
Мій перший HTML-документ.
Кроки для отримання X-шляху веб-елемента, який ми хочемо знайти.
Крок 1) У Chrome перейдіть до https://demo.guru99.com/test/web-table-element.php
Крок 2) Клацніть правою кнопкою миші на веб-елементі, x-path якого потрібно отримати. У нашому випадку клацніть правою кнопкою миші на «Компанія» Виберіть опцію Перевірити. Буде показано наступний екран –
Крок 3) Клацніть правою кнопкою миші на виділеному веб-елементі > виберіть Копіювати -> Параметр Копіювати x-path.
Крок 4) Використовуйте скопійований X-шлях “//*[@id=”leftcontainer”]/table/thead/tr/th [1]” у Selenium WebDriver для пошуку елемента.
Приклад: отримати кількість рядків і стовпців із Dynamic WebTable
Під час обробки динамічної веб-таблиці Selenium, ми не можемо передбачити кількість його рядків і стовпців.
використання Selenium веб-драйвер, ми можемо знайти
- Кількість рядків і стовпців веб-таблиці в Selenium
- Дані рядка X або стовпця Y.
Нижче наведено програму для отримання загальної кількості рядків і стовпців для обробки веб-таблиці Selenium:
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();
}
}
Пояснення коду:
- Тут ми вперше оголосили об’єкт веб-драйвера «wd» і ініціалізували його драйвером Chrome.
- Ми використовуємо List до загальної кількості стовпців у «col».
- Команди findElements повертають список УСІХ елементів, які відповідають указаному локатору
- використовуючи findElements і X-path //*[@id=\”leftcontainer\”]/table/thead/tr/th ми отримуємо всі стовпці
- Аналогічно повторюємо процес для рядів.
вихід:
Приклад: отримати значення комірки певного рядка та стовпця динамічної таблиці
Припустимо, нам потрібно 3rd рядок таблиці та дані її другої клітинки. Дивіться таблицю нижче-
У таблиці вище дані регулярно оновлюються через деякий проміжок часу. Дані, які ви спробуєте отримати, відрізнятимуться від зображеного вище. Однак код залишається незмінним. Ось приклад програми для отримання 3rd рядок і 2nd дані стовпця.
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();
}
}
Пояснення коду:
- Таблиця розташована за допомогою властивості локатора «tagname».
- використання XPath “//*[@id=\”leftcontainer\”]/table/tbody/tr[3]” знайдіть 3rd рядок і отримує його текст за допомогою функції getText ().
- Використовуючи Xpath “//*[@id=\”leftcontainer\”]/table/tbody/tr[3]/td[2]” знайдіть 2-гу клітинку в 3rd рядок і отримує його текст за допомогою функції getText ().
Вихід:
Приклад: отримати максимум усіх значень у стовпці динамічної таблиці
У цьому прикладі ми отримаємо максимальне з усіх значень у певному стовпці.
Зверніться до наступної таблиці –
Ось код
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>
Пояснення коду:
- За допомогою драйвера Chrome ми знаходимо веб-таблицю та отримуємо загальну кількість рядків за допомогою XPath “.//*[@id='leftcontainer']/table/tbody/tr/td[1]”
- Використовуючи цикл for, ми переглядаємо загальну кількість рядків і отримуємо значення одне за іншим. Щоб отримати наступний рядок, ми використовуємо (i+1) у XPath
- Ми порівнюємо старе значення з новим, і максимальне значення друкується в кінці циклу for
Вихід
Приклад: отримати всі значення динамічної таблиці
Розглянемо наступну таблицю: https://demo.guru99.com/test/table.html
Кількість стовпців для кожного рядка різна.
Тут рядки номери 1, 2 і 4 мають 3 клітинки, рядок номер 3 має 2 клітинки, а рядок номер 5 має 1 клітинку.
Нам потрібно отримати значення всіх комірок
Ось код:
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("-------------------------------------------------- ");
}
}
}
Пояснення коду:
- rows_count дає загальну кількість рядків
- для кожного рядка ми отримуємо загальну кількість стовпців за допомогою
rows_table.get(row).findElements(By.tagName("td")); - Ми повторюємо кожен стовпець і кожен рядок і отримуємо значення.
Вихід:
Резюме
- By.xpath() зазвичай використовується для доступу до елементів таблиці.
- Статичні веб-таблиці в Selenium мають послідовний характер. тобто вони мають фіксовану кількість рядків, а також дані клітинки.
- Динамічні веб-таблиці неузгоджені, тобто вони не мають фіксованої кількості рядків і клітинок.
- Використовуючи веб-драйвер selenium, ми можемо легко обробляти динамічні веб-таблиці.
- Selenium Webdriver дозволяє отримати доступ до динамічних веб-таблиць за допомогою їх Х-шлях. Розуміння того, як працювати з веб-таблицею в Selenium, має вирішальне значення для ефективного автоматизованого тестування.















