Поиск элемента в Selenium

В этом учебном пособии мы расскажем, как найти нужный элемент на веб-странице, чтобы взаимодействовать с ним при помощи Selenium.

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

Невозможно взаимодействовать с веб-страницей, если тестовый скрипт не в состоянии найти веб-элементы. В этом материале мы рассмотрим, что Selenium Webdriver предоставляет для их поиска.

Скачивайте книги ТОЛЬКО на русском языке у нас в телеграм канале: PythonBooksRU

Содержание

Поиск элемента по имени

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

Ниже приведен фрагмент кода, демонстрирующий использование метода find_element_by_name. Этот код открывает в браузере Google и выполняет текстовый поиск.

from selenium import webdriver
import time
from selenium.webdriver.common.keys import Keys

driver = webdriver.Firefox()
driver.get("http://google.com")
driver.maximize_window()
time.sleep(5)
inputElement = driver.find_element_by_name("q")
inputElement.send_keys("Techbeamers")
inputElement.submit()
time.sleep(20)

driver.close()

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

Как найти элемент по идентификатору

Мы используем этот метод, когда доступен атрибут id для элемента. По сути, это самый надежный и быстрый способ найти конкретный элемент на HTML-странице. Id всегда будет уникальным для любого объекта на странице. Поэтому использование атрибута id для определения местоположения элементов следует предпочесть другим доступным вариантам.

Ниже приведен фрагмент кода, демонстрирующий использование метода find_element_by_id. Этот код открывает в браузере Google и выполняет текстовый поиск.

from selenium import webdriver
import time
from selenium.webdriver.common.keys import Keys

driver = webdriver.Firefox()
driver.get("http://google.com")
driver.maximize_window()
time.sleep(5)
inputElement = driver.find_element_by_id("lst-ib")
inputElement.send_keys("Techbeamers")
inputElement.submit()
time.sleep(20)

driver.close()

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

Этот метод мы используем для поиска гиперссылок на веб-странице. Если несколько элементов имеют одинаковый текст ссылки, то этот метод выбирает первый элемент с совпадением. Он работает только со ссылками (гиперссылками).

Ниже приведен фрагмент кода, демонстрирующий использование метода find_element_by_link_text. Этот код открывает в браузере Google и выполняет текстовый поиск. После этого открывается гиперссылка с текстом ссылки “Python Tutorial”.

from selenium import webdriver
import time
from selenium.webdriver.common.keys import Keys

driver = webdriver.Firefox()
driver.get("http://google.com")
driver.maximize_window()
time.sleep(5)
inputElement = driver.find_element_by_name("q")
inputElement.send_keys("Techbeamers")
inputElement.submit()
time.sleep(5)
elem = driver.find_element_by_link_text("Python Tutorial")
elem.click()
time.sleep(20)

driver.close()

Для определения местоположения элемента по тексту ссылки необходимо, чтобы текст ссылки был полным. А метод частичного текста ссылки позволяет найти гиперссылку, указав только часть текста. Пример:

from selenium import webdriver
import time
from selenium.webdriver.common.keys import Keys

driver = webdriver.Firefox()
driver.get("http://google.com")
driver.maximize_window()
time.sleep(5)
inputElement = driver.find_element_by_name("q")
inputElement.send_keys("Techbeamers")
inputElement.submit()
time.sleep(5)
elem = driver.find_element_by_partial_link_text("Python")
elem.click()
time.sleep(20)

driver.close()

Этот код открывает веб-страницу учебника Python, как в предыдущем разделе.

Поиск элемента по Xpath

Еще одним полезным методом поиска элемента является использование выражения XPath. Мы используем XPath, когда в коде отсутствует соответствующий атрибут id или name для доступа к элементу.

XPath позволяет определить местоположение элемента с помощью абсолютного (не самый предпочтительный способ) или относительного XPath. Абсолютный XPath определяет местоположение объекта от корня (html). Однако использование абсолютного XPath не является эффективным методом.

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

В случае относительного XPath мы пытаемся найти соседний элемент, для которого задан атрибут id или name (в идеале – родительский элемент). После этого мы можем вычислить XPath целевого элемента относительно этого соседнего элемента. Вероятность того, что этот XPath изменится, очень мала, что делает наши тесты более надежными.

Локаторы XPath также могут использовать атрибуты, отличные от id и name, для поиска элемента.

Чтобы понять, что такое абсолютный и относительный путь, рассмотрим следующий HTML-код со страницы входа.

<html>
<body>
<form id="signUpForm">
<input name="emailId/mobileNo" type="text" />
<input name="password" type="password" />
<input name="continue" type="submit" value="SignUp" />
<input name="continue" type="button" value="Clear" />
</form>
</body>
<html>

Теперь мы попробуем найти различные элементы, присутствующие на странице, используя XPath.

Вот XPath, который поможет Selenium Webdriver найти элемент формы.

form_element = driver.find_element_by_xpath("/html/body/form[1]")

Это абсолютный путь. Он не сработает, если мы внесем критические изменения в структуру HTML-кода.

Теперь приведем относительный путь.

form_element = driver.find_element_by_xpath("//form[1]")

Он обозначает первый элемент формы.

form_element = driver.find_element_by_xpath("//form[@id='signUpForm']")

Для поиска элемента используется атрибут id со значением signUpForm.

Мы можем найти элемент emailId/mobileNo аналогичным образом.

email_input = driver.find_element_by_xpath("//form[input/@name='emailId/mobileNo']")

Будет возвращен первый элемент формы, имеющий дочерний элемент input. Этот элемент input имеет атрибут name со значением emailId/mobileNo.

email_input = driver.find_element_by_xpath("//form[@id='loginForm']/input[1]")

Будет выбран первый дочерний элемент input элемента form, где элемент формы имеет атрибут id и значение signUpForm.

email_input= driver.find_element_by_xpath("//input[@name='emailId/mobileNo']")

Это непосредственное обращение к элементу input, имеющему атрибут name со значением emailId/mobileNo.

Примечание редакции. Вас также может заинтересовать статья “Как нажать на кнопку с помощью Selenium”.

Как найти элемент по CSS-селектору

Данный метод позволяет находить элементы по атрибуту class.

Метод вернет первый элемент, соответствующий входному атрибуту. Если поиск не увенчается успехом, метод вызовет исключение NoSuchElementException.

Для иллюстрации возьмем приведенный ниже HTML-код:

<html>
<body>
<div class="round-button">Click Here</p>
</body>
<html>

В этом коде имеется один элемент div с классом round-button. Для доступа к классу CSS можно использовать символ точки ".". Приведенный ниже синтаксис представляет собой CSS-селектор для класса round-button.

div.round-button

С помощью следующего кода вы можете найти целевой элемент div, используя стратегию CSS-локатора.

get_div = driver.find_element_by_css_selector('div.round-button')

Поиск элемента по имени тега

Данный метод позволяет найти web-элемент по названию тега.

Он вернет первый элемент, который соответствует заданному значению. Если поиск не увенчался успехом, то метод выбросит исключение NoSuchElementException.

Для примера возьмем приведенный ниже HTML-код:

<html>
<body>
<title>Hello Python</title>
<p>Learn test automation using Python</p>
</body>
<html>

Здесь имеется тег title с некоторым текстом. Найти его можно так:

get_div = driver.find_element_by_tag_name('title')

Как найти элемент по имени класса

Данный метод позволяет находить элементы по имени класса.

Он вернет первый элемент с заданным именем класса. Если поиск не увенчался успехом, то метод выбросит исключение NoSuchElementException.

В качестве иллюстрации приведем следующий HTML-код:

<html>
<body>
<div class="round-button">Click Here</div>
</body>
<html>

Здесь имеется класс с именем "round-button". Найти его можно так:

get_div = driver.find_element_by_class_name('round-button')

Перевод статьи «Learn to Locate Elements using Selenium Python with Examples».

1 комментарий к “Поиск элемента в Selenium”

  1. Пингбэк: Прокрутка страницы в Selenium

Оставьте комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *