Как обрабатывать веб-таблицу в Selenium Вебдрайвер

Чтение веб-таблицы HTML

Бывают случаи, когда нам нужно получить доступ к элементам (обычно текстам), которые находятся в таблицах HTML. Однако веб-дизайнер очень редко предоставляет атрибут id или name для определенной ячейки в таблице. Поэтому мы не можем использовать обычные методы, такие как «By.id()», «By.name()» или «By.cssSelector()». В этом случае наиболее надежным вариантом будет доступ к ним с помощью метода «By.xpath()».

Как обрабатывать веб-таблицу в Selenium

Рассмотрим приведенный ниже HTML-код для обработки веб-таблиц в Selenium.

Мы будем использовать XPath чтобы получить внутренний текст ячейки, содержащей текст «четвертая ячейка».

Шаг 1 – Установите родительский элемент (таблицу)

Локаторы XPath в WebDriver всегда начинаются с двойной косой черты «//», за которой следует родительский элемент.. Поскольку мы имеем дело с веб-таблицами в Selenium, родительский элемент всегда должен быть ярлык. Первая порция нашего Selenium Поэтому локатор таблицы XPath должен начинаться с «//table».

Шаг 2 – Добавьте дочерние элементы

Элемент непосредственно под является поэтому мы можем сказать это является «дитя» . А также, является «родителем» . Все дочерние элементы в XPath размещаются справа от родительского элемента, разделяясь одной косой чертой «/», как показано в коде ниже.

Шаг 3 – Добавьте предикаты

элемент содержит два теги. Теперь мы можем сказать, что эти двое теги являются «детями» . Следовательно, мы можем сказать, что является родителем обоих элементы.

Еще один вывод, который мы можем сделать, это то, что эти два элементы являются братьями и сестрами. Братья и сестры относятся к дочерним элементам, имеющим одного и того же родителя..

Чтобы добраться до к которому мы хотим получить доступ (тот, у которого есть текст «четвертая ячейка»), мы должны сначала получить доступ к второй и не первый. Если мы просто напишем «//table/tbody/tr», то мы получим доступ к первому ярлык.

Итак, как нам получить доступ ко второму затем? Ответ на этот вопрос — использовать Предикаты.

Предикаты — это числа или атрибуты HTML, заключенные в пару квадратных скобок «[ ]», которые отличают дочерний элемент от его братьев и сестер.. Поскольку нам нужен доступ ко второму, мы будем использовать «[2]» в качестве предиката.

Если мы не будем использовать какой-либо предикат, XPath получит доступ к первому брату. Таким образом, мы можем получить доступ к первому используя любой из этих кодов XPath.

Шаг 4. Добавьте последующие дочерние элементы, используя соответствующие предикаты

Следующий элемент, к которому нам нужно получить доступ, — это второй . Применяя принципы, которые мы изучили на шагах 2 и 3, мы доработаем наш код XPath, как показано ниже.

Теперь, когда у нас есть правильный локатор XPath, мы уже можем получить доступ к нужной ячейке и получить ее внутренний текст, используя приведенный ниже код. Предполагается, что вы сохранили приведенный выше HTML-код как «newhtml.html» на диске C.

public static void main(String[] args) {
	String baseUrl = "http://demo.guru99.com/test/write-xpath-table.html";
	WebDriver driver = new FirefoxDriver();

	driver.get(baseUrl);
	String innerText = driver.findElement(
		By.xpath("//table/tbody/tr[2]/td[2]")).getText(); 	
        System.out.println(innerText); 
	driver.quit();
	}
}

Доступ к вложенным таблицам

Те же принципы, которые обсуждались выше, применимы и к вложенным таблицам. Вложенные таблицы — это таблицы, расположенные внутри другой таблицы.. Пример показан ниже.

Чтобы получить доступ к ячейке с текстом «4-5-6», используя «//parent/child» и концепции предикатов из предыдущего раздела, мы должны иметь возможность придумать код XPath ниже.

Приведенный ниже код WebDriver должен иметь возможность получать внутренний текст ячейки, к которой мы обращаемся.

public static void main(String[] args) {
	String baseUrl = "http://demo.guru99.com/test/accessing-nested-table.html";
	WebDriver driver = new FirefoxDriver();

	driver.get(baseUrl);
	String innerText = driver.findElement(
		By.xpath("//table/tbody/tr[2]/td[2]/table/tbody/tr/td[2]")).getText(); 		
        System.out.println(innerText); 
	driver.quit();
}

Вывод ниже подтверждает, что доступ к внутренней таблице был успешен.

Использование атрибутов в качестве предикатов

Если элемент написан глубоко внутри HTML-кода, так что число, используемое для предиката, очень сложно определить, вместо этого мы можем использовать уникальный атрибут этого элемента.

В приведенном ниже примере ячейка «Нью-Йорк — Чикаго» расположена глубоко в Mercury HTML-код главной страницы Tours.

В этом случае мы можем использовать уникальный атрибут таблицы (width="270") в качестве предиката. Атрибуты используются в качестве предикатов путем добавления к ним префикса @.. В приведенном выше примере ячейка «Нью-Йорк — Чикаго» расположена в первом четвертого , и поэтому наш XPath должен быть таким, как показано ниже.

Помните, что когда мы помещаем код XPath в Java, мы должны использовать экранирующий символ обратную косую черту «\» для двойных кавычек по обе стороны от «270», чтобы строковый аргумент By.xpath() не был завершен преждевременно.

Теперь мы готовы получить доступ к этой ячейке, используя приведенный ниже код.

public static void main(String[] args) {
	String baseUrl = "http://demo.guru99.com/test/newtours/";
	WebDriver driver = new FirefoxDriver();

	driver.get(baseUrl);
	String innerText = driver.findElement(By
		.xpath("//table[@width=\"270\"]/tbody/tr[4]/td"))
		.getText(); 		
	System.out.println(innerText); 
	driver.quit();
}

Ярлык: используйте Inspect Element для доступа к таблицам в Selenium

Если номер или атрибут элемента получить чрезвычайно сложно или невозможно, самый быстрый способ сгенерировать код XPath — использовать Inspect Element.

Рассмотрим пример ниже из Mercury Домашняя страница туров.

Шаг 1

Используйте Firebug для получения кода XPath.

Шаг 2

Найдите первый родительский элемент «таблица» и удалите все слева от него.

Шаг 3

Добавьте к оставшейся части кода двойную косую черту «//» и скопируйте ее в код WebDriver.

Приведенный ниже код WebDriver сможет успешно получить внутренний текст элемента, к которому мы обращаемся.

public static void main(String[] args) {
	String baseUrl = "http://demo.guru99.com/test/newtours/";
	WebDriver driver = new FirefoxDriver();

	driver.get(baseUrl);
	String innerText = driver.findElement(By
		.xpath("//table/tbody/tr/td[2]"
		+ "//table/tbody/tr[4]/td/"
		+ "table/tbody/tr/td[2]/"
		+ "table/tbody/tr[2]/td[1]/"
		+ "table[2]/tbody/tr[3]/td[2]/font"))
		.getText(); 		
	System.out.println(innerText); 
	driver.quit();
}

Итого

• By.xpath() обычно используется для доступа к элементам WebTable в Selenium.
• Если элемент написан глубоко внутри HTML-кода, поэтому очень сложно определить число, используемое для предиката, вместо этого мы можем использовать уникальный атрибут этого элемента для Selenium получить элемент таблицы.
• Атрибуты используются в качестве предикатов путем добавления к ним префикса @.
• Используйте элемент проверки для доступа к веб-таблице в Selenium