How to identify tooltip by using WebDriver?

1.	How to identify tooltip by using WebDriver?
Answer» Tooltip is also known as the Help text. Tooltip is a text that appears when the mouse hovers over an object like a LINK, button image, etc. Sometimes it is a requirement of a project to address tooltip text. This tooltip text provides information RELATED to the object on which it appears. Objects have various attributes in HTML i.e object properties and one of them is “title” which contains tooltip text. SELENIUM’s purpose is to read that text of the object. Tooltip can appear in two ways - Static and Dynamic ways and both can be seen by mouse hover on the object. 1. Static Tooltip: Selenium can capture the Static tooltip by calling getAttribute(‘title’) method of WebElement and return the text of title which will be nothing but the tooltip. We will use the class attribute to make the image object(WebElement) and then we will use the getAttribute method. import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.chrome.ChromeDriver; public class staticToolTip { public static void main(String[] args) { //Keep the chromedriver at project path location in eclipse System.setProperty("WebDriver.chrome.driver", System.getProperty("user.dir")+"/chromedriver"); WebDriver driver = new ChromeDriver(); driver.get("https://nikasio.com"); //Find the element by using class name WebElement edit = driver.findElement(By.id("header_logo")); String tooltiptext = edit.getAttribute("title"); System.out.println(tooltiptext); driver.quit(); } } 2. Dynamic Tooltip: Dynamic Tooltip in applications is usually created by jQuery/javascript plugins. When we hover mouse on the object, tooltip object appears in HTML and as soon as the mouse is moved the object text DISAPPEARS. The getAttribute(‘title’) will not simply work. In the case of Dynamic tooltip, you have to use the ‘Actions class’ of Selenium. In the above image, you will see object related to this link but nothing for tooltip Once you will hover the mouse over the link, you will see a new entry in HTML(div tag ) which is nothing but the tooltip and when you will take the mouse out of the link, below div tag will disappear. import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.chrome.ChromeDriver; import org.openqa.selenium.interactions.Actions; public class dynamictoolTip { public static void main(String[] args) throws InterruptedException { System.setProperty("WebDriver.chrome.driver", System.getProperty("user.dir")+"/chromedriver"); WebDriver driver = new ChromeDriver(); driver.get("https://nikasio.com"); //Create object for link WebElement exampleLink = driver.findElement(By.class("avatar user-1-avatar avatar-150 photo")); //Create the Actions class Actions act = new Actions(driver); act.moveToElement(exampleLink).build().perform(); //Create object for inner div WebElement toolTip = driver.findElement(By.className("header_logo")); //Get the text of Tooltip String tooltiptext = toolTip.getText(); System.out.println(tooltiptext); driver.quit(); } }

Answer»

Tooltip is also known as the Help text. Tooltip is a text that appears when the mouse hovers over an object like a LINK, button image, etc. Sometimes it is a requirement of a project to address tooltip text. This tooltip text provides information RELATED to the object on which it appears. Objects have various attributes in HTML i.e object properties and one of them is “title” which contains tooltip text. SELENIUM’s purpose is to read that text of the object. Tooltip can appear in two ways - Static and Dynamic ways and both can be seen by mouse hover on the object.

1. Static Tooltip:

Selenium can capture the Static tooltip by calling getAttribute(‘title’) method of WebElement and return the text of title which will be nothing but the tooltip.

We will use the class attribute to make the image object(WebElement) and then we will use the getAttribute method.

import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.chrome.ChromeDriver; public class staticToolTip { public static void main(String[] args) { //Keep the chromedriver at project path location in eclipse System.setProperty("WebDriver.chrome.driver", System.getProperty("user.dir")+"/chromedriver"); WebDriver driver = new ChromeDriver(); driver.get("https://nikasio.com"); //Find the element by using class name WebElement edit = driver.findElement(By.id("header_logo")); String tooltiptext = edit.getAttribute("title"); System.out.println(tooltiptext); driver.quit(); } }

2. Dynamic Tooltip:

Dynamic Tooltip in applications is usually created by jQuery/javascript plugins. When we hover mouse on the object, tooltip object appears in HTML and as soon as the mouse is moved the object text DISAPPEARS. The getAttribute(‘title’) will not simply work. In the case of Dynamic tooltip, you have to use the ‘Actions class’ of Selenium.

In the above image, you will see object related to this link but nothing for tooltip

Once you will hover the mouse over the link, you will see a new entry in HTML(div tag ) which is nothing but the tooltip and when you will take the mouse out of the link, below div tag will disappear.

import org.openqa.selenium.By;

import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.WebElement; import org.openqa.selenium.chrome.ChromeDriver; import org.openqa.selenium.interactions.Actions; public class dynamictoolTip { public static void main(String[] args) throws InterruptedException { System.setProperty("WebDriver.chrome.driver", System.getProperty("user.dir")+"/chromedriver"); WebDriver driver = new ChromeDriver(); driver.get("https://nikasio.com"); //Create object for link WebElement exampleLink = driver.findElement(By.class("avatar user-1-avatar avatar-150 photo")); //Create the Actions class Actions act = new Actions(driver); act.moveToElement(exampleLink).build().perform(); //Create object for inner div WebElement toolTip = driver.findElement(By.className("header_logo")); //Get the text of Tooltip String tooltiptext = toolTip.getText(); System.out.println(tooltiptext); driver.quit(); } }

How to identify tooltip by using WebDriver?

Discussion

No Comment Found

Related InterviewSolutions

Reply to Comment