How to perform Mouse Hover Action in Selenium

An application has different Web Elements like buttons, text boxes, checkboxes, menus, sliders, and more. While testing using Selenium, you can simulate certain scenarios by automating low-level interactions with the WebElement(s) in the DOM, such as keypresses and mouse button operations (such as click, double click, and right-click). One such action is Mouse hover over a web element. 

Moving the cursor over an element in a graphical user interface (GUI) without clicking is called hovering. In web design, hovering is frequently used to show more details or options related to an element. For instance, a submenu displaying more options may emerge when you hover over a menu item. 

In this blog, we’d see how to perform mouse hover actions in Selenium WebDriver.

Let’s get started!

What is a Mouse Hover Action?

In Selenium, you can simulate a mouse hover action to test an element’s behavior when it has hovered over. This involves using the Actions class to create a new Actions object and then using the moveToElement method to move the mouse cursor over the element. The perform method is then used to execute the mouse hover action.

Importance of Mouse Hover Actions in GUI Testing

This type of interaction is common in many web applications and is used to display additional information or options associated with an element. 

By testing the behavior of elements during mouse hover actions, you can verify that the application’s GUI is functioning as intended and that the user experience is consistent and intuitive. This is particularly important for applications that rely heavily on hover-based interactions, such as those with complex navigation menus or dynamic product displays.

Automating mouse hover actions in Selenium also helps to catch subtle bugs and design issues that may not be immediately apparent. For example, if the submenu appears in the wrong location or does not display the expected options, these issues can be identified and addressed before the application is released.

Understanding the Actions Class in Selenium

Overview of the Actions Class

The Actions class in Selenium is a class used to simulate user interactions with a web page. It provides a way to perform advanced mouse and keyboard interactions, such as moving the mouse over an element, clicking and holding an element, and dragging and dropping elements. The Actions class is part of the org.openqa.selenium.interactions package in Selenium and can be used with the WebDriver API.

The Actions class has several methods and properties that allow you to simulate a wide range of user interactions. For example, the click method can be used to simulate a mouse click, the moveToElement method can be used to move the mouse over an element, and the keyDown method can be used to simulate a key press.

To use the Actions class, you must first create a new Actions object and then chain together the desired actions using the methods provided by the class. Once you have defined the actions you want to perform, you can use the perform method to execute the actions.

In summary, the Actions class in Selenium provides a powerful and flexible way to simulate advanced user interactions with a web page. It is an essential tool for performing mouse hover actions and other types of interactions in Selenium testing.

Methods and Properties of the Actions Class

The Actions class in Selenium has several methods and properties that can be used to simulate user interactions with a web page. Some of the most commonly used methods and properties are listed below:

Methods:

• click: Simulates a mouse click on an element.
• clickAndHold: Clicks and holds down the mouse button on an element.
• doubleClick: Performs a double-click on an element.
• keyDown: Simulates pressing a key on the keyboard.
• keyUp: Simulates releasing a key on the keyboard.
• moveToElement: Moves the mouse cursor over an element.
• release: Releases the mouse button.
• sendKeys: Simulates typing text on the keyboard.
• perform: Executes the defined actions.

How to implement Mouse Hover in Selenium using the Actions Class?

In Selenium, the Actions class can be used to perform mouse hover actions. Here’s how you can perform a mouse hover using the Actions class in Selenium:

Syntax:

moveToElement​(WebElement element) – Move the mouse to the middle of the element (i.e. element) which is passed to the method

Step by Step explanation

1. Set the chrome driver path

System.setProperty(“webdriver.chrome.driver”, “/path/to/chromedriver”);

2. Instantiate the browser driver

WebDriver driver = new ChromeDriver();

3. Launch the browser and website

driver.get(“https://www.example.com”); WebElement element = driver.findElement(By.id(“locatorvalue”));

4. Create an instance of an Actions class

Actions actions = new Actions(driver);

5. Perform the Mouse hover action

actions.moveToElement(element).build().perform();

Code Snippet: 

package demo; 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 MouseHover { public static void main(String[] args) throws Exception { // Set the path of the ChromeDriver System.setProperty(“webdriver.chrome.driver”, “.\\chromedriver.exe”); // Instantiate the Chrome driver WebDriver driver = new ChromeDriver(); // Launch a website driver.get(“https://testsigma.com/”); driver.manage().window().maximize(); // Identify the element to be hovered WebElement element = driver.findElement(By.xpath(“//a[text()=’Resources’]”)); // Instantiate the Actions class Actions actions = new Actions(driver); // Perform the mouse hover action actions.moveToElement(element).build().perform(); // close the browser driver.close(); } }

How can I position the mouse cursor at an offset element?

In Selenium, the Actions class can be used to move the mouse cursor to a specific offset relative to an element. Here’s how you can perform this action using the Actions class in Selenium:

Syntax:

moveToElement​(WebElement, X, Y) – Move to an offset (x_Offset and y_Offset) from the WebElement’s in canter viewpoint.

Code Snippet:

package demo; 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 MouseHoverByOffset { public static void main(String[] args) throws Exception { //Set the path of the Chromedriver path System.setProperty(“webdriver.chrome.driver”, “C:\\Users\\sgokhru\\Downloads\\chromedriver_win32\\chromedriver.exe”); //Instantiate the Chrome driver WebDriver driver = new ChromeDriver(); //Launch the website driver.get(“https://testsigma.com/”); driver.manage().window().maximize(); //Identify the element to be hovered WebElement element = driver.findElement(By.xpath(“//a[text()=’Resources’]”)); //Instantiate of the Actions class Actions actions = new Actions(driver); // Perform the mouse hover action actions.moveToElement(element, 10, 20).build().perform(); Thread.sleep(3000); //close the browser driver.close(); } }

In this example, the Chrome driver is being used, so the path to the chromedriver executable must be set. The element_id is the id of the element on the page to which you want to move the mouse cursor. The Actions class is used to simulate mouse events, and the moveToElement method is used to move the mouse to a specific offset relative to the specified element.

The first argument to the moveToElement method is the element, and the second and third arguments are the x and y offsets, respectively. The build method is used to compile the actions into a single step, and the perform method is used to execute the actions.

Conclusion

In conclusion, mouse hover is a commonly used interaction in web applications and can be easily simulated using the Actions class in Selenium. The Actions class provides a way to simulate mouse and keyboard events in the browser, and the moveToElement method can be used to perform mouse hover actions. You can also move the mouse cursor to a specific offset relative to an element by using the moveToElement method with x and y offset arguments.

It’s important to note that mouse hover actions can be used to uncover hidden elements or drop-down menus and can be useful in navigating and testing web applications. 

Frequently Asked Questions

 How to mouse hover and click in selenium?

You can perform a mouse hover and click action in Selenium using the following steps in Java:

• Locate the element: First, you need to locate the element you want to perform the mouse hover and click action on. You can locate the element using its id, class name, xpath, or any other method supported by Selenium.


• Import the Actions class: In order to perform mouse actions, you need to import the Actions class from the org.openqa.selenium.interactions.Actions package.


• Create an instance of Actions: After importing the Actions class, create an instance of Actions and pass the web driver instance as the parameter.


• Mouse hover: Use the moveToElement method of the Actions class to move the mouse cursor over the element you want to hover.


• Click: To perform the click action, use the click method of the Actions class.

Syntax :

WebElement element = driver.findElement(By.id(“element-id”)); Actions actions = new Actions(driver); actions.moveToElement(element).perform(); actions.click(element).perform();

How to get hover text in Selenium?

In Selenium, you can get the text displayed on an element when you hover over element by using the following steps in Java:

• Locate the element: First, you need to locate the element you want to get the hover text from. You can locate the element using its id, class name, xpath, or any other method supported by Selenium.


• Import the Actions class: In order to perform mouse actions, you need to import the Actions class from the org.openqa.selenium.interactions.Actions package.


• Create an instance of Actions: After importing the Actions class, create an instance of Actions and pass the web driver instance as the parameter.


• Mouse hover: Use the moveToElement method of the Actions class to move the mouse cursor over the element you want to hover.


• Get the hover text: To get the hover text, you can use the getAttribute method of the WebElement class and pass the title as the argument. The title attribute contains the text displayed when you hover over the element.

Syntax:

WebElement element = driver.findElement(By.id(“element-id”)); Actions actions = new Actions(driver); actions.moveToElement(element).perform(); String hoverText = element.getAttribute(“title”); System.out.println(“Hover text: ” + hoverText);

How to perform mouse actions in selenium?

In Selenium, you can perform mouse actions (such as hover, click, right-click, double-click, etc.) in Java by using the Actions class. Here’s how you can do it:

• Import the Actions class: Import the Actions class from the org.openqa.selenium.interactions.Actions package.


• Create an instance of Actions: Create an instance of Actions and pass the web driver instance as the parameter.


• Locate the element: Locate the element you want to perform the mouse action on.


• Perform the mouse action: Use the appropriate method of the Actions class to perform the mouse action. For example, to perform a mouse hover, use the moveToElement method. To click an element, use the click method. To right-click an element, use the contextClick method. To double-click, an element, use the doubleClick method.


• Build and perform the action: After performing the mouse action, you need to call the build method of the Actions class and then call the perform method to execute the action.

Here’s an example that demonstrates how to perform a double click in Selenium:

Syntax:

WebElement element = driver.findElement(By.id(“element-id”)); Actions actions = new Actions(driver); actions.doubleClick(element ).perform();