Как проверить всплывающую подсказку в Selenium

Подсказка в Selenium

A Подсказка в Selenium — это текст, который появляется при наведении курсора мыши на объект на веб-странице. Объектом может быть ссылка, изображение, кнопка, текстовая область и т. д. Текст всплывающей подсказки часто дает дополнительную информацию об объекте, на который пользователь наводит курсор мыши.

Подсказки традиционно реализовывались как атрибут «заголовок» элемента. Значение этого атрибута отображалось в виде всплывающей подсказки при наведении курсора мыши. Это статический текст, предоставляющий информацию об элементе без стилей.

Сейчас существует множество плагинов для реализации «подсказок». Расширенные всплывающие подсказки со стилем, рендерингом, изображениями и ссылками реализуются с использованием JavaПлагины Script/JQuery или использование CSS-подсказок.

Для доступа или проверки статических всплывающих подсказок, которые реализованы с использованием атрибута HTML «title», мы можем просто использовать метод getAttribute («title») WebElement. Возвращаемое значение этого метода (текст всплывающей подсказки) сравнивается с ожидаемым значением для проверки.
Для других форм реализации всплывающих подсказок нам придется использовать «API расширенного взаимодействия с пользователем», предоставляемый веб-драйвером, чтобы создать эффект наведения мыши, а затем получить всплывающую подсказку для элемента.

Краткое описание API расширенного взаимодействия с пользователем

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

Вы можете сослаться на это ссылке. для получения более подробной информации об API.

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

Шаг 1) Чтобы использовать API, необходимо импортировать следующие пакеты/классы:

Шаг 2) Создайте объект класса «Действия» и постройте Последовательность действий пользователя. Класс Actions используется для построения последовательности действий пользователя, таких как moveToElement(), dragAndDrop() и т. д. API предоставляет различные методы, связанные с действиями пользователя.

Объект драйвера предоставляется в качестве параметра его конструктору.

Шаг 3) Создайте объект действия, используя метод build() класса «Действия». Вызовите метод Perform(), чтобы выполнить все действия, созданные объектом Actions (конструктор здесь).

Мы увидели, как использовать некоторые методы пользовательских действий, предоставляемые API: clickAndHold(element), moveByOffset(10,0), Release(). API предоставляет множество таких методов.

См. ссылке. Больше подробностей.

Как проверить (обработать) всплывающую подсказку в Selenium

Давайте посмотрим демонстрацию доступа и проверки подсказок инструментов в простом сценарии.

Сценарий 1. Всплывающая подсказка реализована с использованием атрибута «title».
Сценарий 2. Всплывающая подсказка реализована с помощью плагина jQuery.

Сценарий 1: HTML-атрибут title

В данном случае возьмем пример сайта – https://demo.guru99.com/test/social-icon.html.

Мы попытаемся проверить всплывающую подсказку значка «github» в правом верхнем углу страницы.

Чтобы сделать это, мы сначала найдем элемент, получим его атрибут «заголовок» и сверим его с ожидаемым текстом подсказки.

Поскольку мы предполагаем, что подсказка находится в атрибуте «title», мы даже не автоматизируем эффект наведения мыши, а просто получаем значение атрибута с помощью метода «getAttribute()».

Вот код

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();			
   }		
}

Объяснение кода

Найдите WebElement, представляющий значок «github».
Получите его атрибут «title», используя метод getAttribute().
Утвердите значение в соответствии с ожидаемым значением всплывающей подсказки.

Сценарий 2: Плагин JQuery

Существует множество плагинов JQuery для реализации всплывающих подсказок, и каждый из них имеет немного разную форму реализации.

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

Для нашей демонстрации давайте рассмотрим способ реализации всплывающей подсказки «jQuery Tools Tooltip».

Здесь в URL – https://demo.guru99.com/test/tooltip.html вы можете увидеть демо-версию, где при наведении курсора мыши на «Загрузить сейчас» мы получаем расширенную всплывающую подсказку с изображением, фоном выноски, таблицей и ссылкой внутри нее, на которую можно щелкнуть.

Если вы посмотрите на исходный код ниже, вы увидите, что тег div, представляющий всплывающую подсказку, всегда присутствует рядом с тегом ссылки «Загрузить сейчас». Но код внутри тега скрипта ниже контролирует, когда оно должно появиться.

Давайте попробуем проверить только текст ссылки во всплывающей подсказке для нашей демонстрации здесь.

Сначала мы найдем веб-элемент, соответствующий «Загрузить сейчас». Затем, используя API взаимодействий, мы перейдем к элементу (наведение курсора мыши). Затем мы найдем WebElement, соответствующий ссылке внутри отображаемой всплывающей подсказки, и проверим его на соответствие ожидаемому тексту.

Вот код

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();			
   }		
}

Код Пояснение

Найдите WebElement, соответствующий элементу «загрузить сейчас», на который мы наведем указатель мыши.
Используя API взаимодействия, наведите курсор мыши на «Загрузить сейчас».
Предполагая, что всплывающая подсказка отображается, найдите WebElement, соответствующий ссылке внутри всплывающей подсказки, то есть тегу «a».
Проверьте текст всплывающей подсказки ссылки, полученный с помощью getText(), на соответствие ожидаемому значению, которое мы сохранили в «expectedToolTip».

Резюме

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

Подсказки инструментов реализованы по-разному:

Базовая реализация основана на атрибуте HTML «title». getAttribute(title) получает значение всплывающей подсказки.
Другие реализации подсказок, такие как JQuery и CSS, требуют API-интерфейсов Interactions для создания эффекта наведения мыши.

API расширенного взаимодействия с пользователем –

moveToElement(element) класса Actions используется для наведения курсора мыши на элемент.
Метод Build() класса Actions объединяет последовательность действий пользователя в объект Action.
Perform() класса Action выполняет всю последовательность действий пользователя одновременно.

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

Подсказка в Selenium

Краткое описание API расширенного взаимодействия с пользователем

Как проверить (обработать) всплывающую подсказку в Selenium

Сценарий 1: HTML-атрибут title

Сценарий 2: Плагин JQuery

СТАТЬИ ПО ТЕМЕ

Резюме

Подпишитесь на рассылку