Selenium WebDriver - Mouse Events

Quiz

Selenium Webdriver can be used to perform mouse events operations like right click, left click, double click, mouse hovering, and movements using the Actions class. The methods contextClick(), doubleClick(), click(), and moveToElement() are used to perform these operations.

Basic Methods of Mouse Events in Actions Class

There are multiple methods to perform Mouse events available in the Actions class.

click() − This method is used to perform click at the present location of the mouse.
build() − This method is used to create a combination of actions having all the actions to be carried on.
perform() − This method is used to perform actions without invoking the build() first.
release() − This method is used to release mouse action at the present location of the mouse.
release(WebElement e) − This method is used to release mouse action at the middle of the webElement e passed as a parameter.
click(WebElement e) − This method is used to perform click at the middle of the webElement e passed as a parameter.
doubleClick() − This method is used to perform double click at the present location of the mouse.
doubleClick(WebElement e) − This method is used to perform double click at the middle of the webElement e passed as a parameter.
contextClick() − This method is used to perform a right click at the present location of the mouse.
contextClick(WebElement e) − This method is used to perform a right click at the middle of the webElement e passed as a parameter.
moveToElement(WebElement e) − This method is used to move the mouse to the middle of the webElement e passed as a parameter.
moveToElement(WebElement e, int x-offset, int y-offset) − This method is used to move the mouse to an offset from the element in view point. The webelement e, x, and y offset values are passed as parameters.
clickAndHold() − This method is used to perform click(without releasing) at the present location of the mouse.
clickAndHold(WebElement e) − This method is used to perform click(without releasing) at the middle of the webElement e passed as a parameter.

Example 1 - Click, Right Click, Double Click

Let us take an example of the below page, where we would perform click, right click, and double click by clicking on the Click Me, Right Click Me, and Double Click Me buttons respectively on the web page.

On performing the Click Me, Right Click Me, and Double Click Me buttons respectively, we would get a message You have a dynamic click and You have double clicked messages on the page respectively.

Code Implementation

package org.example;

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;
import java.util.concurrent.TimeUnit;

public class ActionsMouse {
   public static void main(String[] args) throws InterruptedException {

      // Initiate the Webdriver
      WebDriver driver = new ChromeDriver();

      // adding implicit wait of 15 secs
      driver.manage().timeouts().implicitlyWait(15, TimeUnit.SECONDS);

      // Opening the webpage
      driver.get("https://www.tutorialspoint.com/selenium/practice/buttons.php");

      // identify element with xpath for click
      WebElement m = driver.findElement
         (By.xpath("/html/body/main/div/div/div[2]/button[1]"));

      // object of Actions class to move then click
      Actions a = new Actions(driver);
      a.moveToElement(m).click().build().perform();

      // get text after click
      WebElement t = driver.findElement(By.xpath("//*[@id='welcomeDiv']"));
      System.out.println("Text after click: " + t.getText());

      // identify element with xpath for double click
      WebElement n = driver.findElement
         (By.xpath("/html/body/main/div/div/div[2]/button[3]"));

      // double click
      a.moveToElement(n).doubleClick().build().perform();

      // get text after double click
      WebElement x = driver.findElement(By.xpath("//*[@id='doublec']"));
      System.out.println("Text after double click: " + x.getText());

      // identify element with xpath for right click
      WebElement y = driver.findElement
         (By.xpath("/html/body/main/div/div/div[2]/button[2]"));

      // right click
      a.moveToElement(y).contextClick().build().perform();

      // Closing browser
      driver.quit();
   }
}

Output

Text after click: You have done a dynamic click
Text after double click: You have Double clicked

Process finished with exit code 0

In the above example, we had performed click, double click, and right click and then received the messages in the console - Text after click: You have done a dynamic click and Text after double click: You have Double clicked.

Finally, the message Process finished with exit code 0 was received, signifying successful execution of the code.

Example 2 - Mouse Hover on Element

Let us take another example, where initially the menu Navbar has a black color.

However, on hovering and holding on it, the menu Navbar changes color as shown in the below image.

Code Implementation

package org.example;

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;
import java.util.concurrent.TimeUnit;

public class ActionsClickandHold {
   public static void main(String[] args) throws InterruptedException {

      // Initiate the Webdriver
      WebDriver driver = new ChromeDriver();

      // adding implicit wait of 15 secs
      driver.manage().timeouts().implicitlyWait(15, TimeUnit.SECONDS);

      // Opening the webpage
      driver.get("https://www.tutorialspoint.com/selenium/practice/menu.php#");

      // identify element with xpath for click and hold
      WebElement m = driver.findElement
         (By.xpath("/html/body/main/div/div/div[2]/nav/div/a"));

      // get element color in rgba format
      String s = m.getCssValue("color");
      System.out.println("rgba code for color element: " + s );

      // object of Actions class to click and hold
      Actions a = new Actions(driver);
      a.clickAndHold(m).build().perform();

      // get element color in rgba format
      String c = m.getCssValue("color");
      System.out.println("rgba code for color for element after click and hold: " + c);

      // Closing browser
      driver.quit();
   }
}

Output

rgba code for color element: rgba(51, 51, 51, 1)
rgba code for color for element after click and hold: rgba(64, 169, 68, 1)

Process finished with exit code 0

Example 3 - Click Menu and Sub-Menus of an Element

Let us take another example, where we would click on the menu Dropdown. On clicking on that, all the sub-menus - Actions, Another action, and Something else would be displayed.

Code Implementation

package org.example;

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;
import java.util.List;
import java.util.concurrent.TimeUnit;

public class ActionsMenu {
   public static void main(String[] args) throws InterruptedException {

      // Initiate the Webdriver
      WebDriver driver = new ChromeDriver();

      // adding implicit wait of 15 secs
      driver.manage().timeouts().implicitlyWait(15, TimeUnit.SECONDS);

      // Opening the webpage
      driver.get("https://www.tutorialspoint.com/selenium/practice/menu.php#");

      // identify element with xpath for menu
      WebElement m = driver.findElement
         (By.xpath("//*[@id='navbarSupportedContent']/ul/li[3]/a"));

      // object of Actions class to click and hold
      Actions a = new Actions(driver);
      a.moveToElement(m).click().build().perform();

      // identify  all sub-menu under main menu
      List<WebElement> l= driver.findElements
         (By.xpath("//*[@id='navbarSupportedContent']/ul/li[3]/ul/li"));
      for(int i = 0; i < l.size(); i++){
         System.out.println("Sub-menus are: " + l.get(i).getText());
      }

      // Closing browser
      driver.quit();
   }
}

Output

Sub-menus are: Action
Sub-menus are: Another action
Sub-menus are: 
Sub-menus are: Something else here

Process finished with exit code 0

In the above example, we had clicked on a menu after which we got all the sub-menus with the message in the console - Sub-menus are: Action, Sub-menus are: Another action, Sub-menus are:, and Sub-menus are: Something else here.

Finally, the message Process finished with exit code 0 was received, signifying successful execution of the code.

This concludes our comprehensive take on the tutorial on Selenium Webdriver - Mouse Events. Weve started with describing basic methods of mouse events in Actions class, and examples to illustrate how to handle mouse events in Selenium Webdriver. This equips you with in-depth knowledge of the Selenium Webdriver - Mouse Events. It is wise to keep practicing what youve learned and exploring others relevant to Selenium to deepen your understanding and expand your horizons.

Print Page