Mastering User Interactions with the Actions Class in Selenium WebDriver


1. Introduction

Selenium WebDriver is a widely used framework for automating web browser interactions. In this tutorial, we will cover the initial setup required to start using Selenium WebDriver, creating instances of the Actions class, and performing various mouse actions using Selenium. Let's dive in!

Table of Contents

  1. Introduction
    • 1.1. What is Actions Class?
    • 1.2. Benefits of Using Actions Class
  2. Getting Started with Actions Class
    • 2.1. Creating an instance of the Actions class
  3. Performing Mouse Actions 3.1 Mouse Hover 3.2 Clicking and Double Clicking 3.3 Right Click (Context Click) 3.4 Drag and Drop
  4. Performing Keyboard Actions 4.1 Key Down and Key Up 4.2 Sending Keys
  5. Handling Complex User Interactions 5.1 Chaining multiple actions together 5.2 Performing actions on nested elements 5.3 Waiting for specific conditions before performing actions
  6. Advanced Techniques with the Actions Class 6.1 Handling dynamic elements during actions 6.2 Integrating with explicit waits for synchronization 6.3 Leveraging the Page Object Model (POM) design pattern
  7. Real-World Use Cases
     7.1. Practical examples of using the Actions class in test automation scenarios
7.2 Demonstrating the power and versatility of the Actions class
8. Conclusion

1.1. What is Actions Class in Selenium WebDriver?

Actions class is used to handle Keyboard and Mouse Events. You need to import org.openqa.selenium.interactions.Actions in order to use Actions class. This class includes keyboard and mouse actions such as double click, right click, drag & drop, mouse hover and clicking multiple elements.

Actions Class commands can be classified in two categories:
  1. Mouse Actions
  2. Keyword Actions

1.2. Benefits of Using the Actions Class in Selenium:

The Actions class in Selenium WebDriver provides several benefits when it comes to performing advanced user interactions and automating complex scenarios. Here are some of the key benefits of using the Actions class:

  1. Support for Mouse and Keyboard Actions: The Actions class allows you to simulate both mouse and keyboard actions. It provides a wide range of methods to handle mouse movements, clicks, hover, and drag-and-drop operations. Additionally, it offers keyboard-related methods for key press, release, and sending keystrokes to web elements.

  2. Enhanced User Interactions: With the Actions class, you can automate user interactions that go beyond simple clicks and text input. It enables you to perform actions like hovering over elements, right-clicking, double-clicking, and handling context menus. These capabilities allow you to simulate real user interactions and thoroughly test the functionality of web applications.

  3. Cross-Browser Compatibility: The Actions class is designed to work seamlessly across different web browsers. It abstracts the underlying browser-specific implementations and provides a consistent way to perform actions across various browsers, including Chrome, Firefox, Safari, and Internet Explorer. This ensures that your tests are reliable and can be executed on different browsers without modifications.

  4. Handling Complex Scenarios: The Actions class is particularly useful when automating complex scenarios that involve multiple user interactions. It allows you to chain multiple actions together, perform actions on nested elements, and wait for specific conditions before performing actions. This flexibility helps in automating scenarios like dropdown menus, sliders, sortable lists, and more.

  5. Improved Test Coverage: By utilizing the Actions class, you can achieve a higher level of test coverage. It enables you to simulate user interactions that are not possible through basic WebDriver commands alone. For example, you can automate scenarios that involve mouse hover, drag-and-drop, or right-click operations, ensuring that your tests cover a wide range of user interactions.

  6. Integration with Explicit Waits: The Actions class can be integrated with explicit waits to synchronize actions with specific conditions. This allows you to wait for elements to be visible, clickable, or have certain attributes before performing actions on them. By combining the Actions class with explicit waits, you can create more robust and reliable test scripts.

  7. Seamless Integration with Page Object Model (POM): The Actions class seamlessly integrates with the Page Object Model (POM) design pattern, which is widely used for creating maintainable and reusable test automation frameworks. You can encapsulate the actions performed on specific elements within respective page objects, making your code more organized and maintainable.


2. Getting Started with Actions Class

2.1. Creating an Instance of Actions class:

  • Before using the Actions class, make sure you have a WebDriver instance set up.
  • Import the necessary classes:

  • arduino
    import org.openqa.selenium.WebDriver; import org.openqa.selenium.chrome.ChromeDriver; import org.openqa.selenium.interactions.Actions;
  • Create a WebDriver instance:

  • java
    WebDriver driver = new ChromeDriver();
  • Instantiate the Actions class using the WebDriver instance:

  • java
    Actions actions = new Actions(driver);
Now, you have an instance of the Actions class (actions) that you can use to perform various mouse actions on web elements.


3. Performing Mouse Actions
 In Selenium WebDriver, the Actions class provides a powerful set of methods to perform mouse actions, allowing you to simulate user interactions with web elements. This tutorial will guide you through the process of performing mouse actions using the Actions class. We will cover various mouse actions such as click, double click, context click (right click), click and hold, drag and drop, and more. Let's get started!

Some of the mouse events that can be performed using Actions class are:
  1. click()
  2. doubleClick()
  3. contextClick()
  4. clickAndHold()
  5. dragAndDrop()
  6. moveToElement()
  7. moveByOffset(x, y)
  8. release()
  1. Clicking on Elements: Clicking on elements is a common interaction in web applications. The Actions class provides the click() method to simulate a left mouse button click on a specific element. Here's an example:
java
Actions actions = new Actions(driver); WebElement element = driver.findElement(By.id("elementId")); actions.click(element).build().perform();
  1. Double Clicking: Double clicking is used when you need to simulate a quick succession of two left mouse button clicks on an element. The Actions class provides the doubleClick() method for this purpose. Here's an example:
java
Actions actions = new Actions(driver); WebElement element = driver.findElement(By.id("elementId")); actions.doubleClick(element).build().perform();
  1. Context Click (Right Click): Simulating a right click on an element can be useful for interacting with context menus or triggering specific actions. The Actions class provides the contextClick() method for right-click simulation. Here's an example:
java
Actions actions = new Actions(driver); WebElement element = driver.findElement(By.id("elementId")); actions.contextClick(element).build().perform();
  1. Click and Hold: Sometimes, you may need to click and hold the mouse button on an element. The Actions class provides the clickAndHold() method to perform this action. Here's an example:
java
Actions actions = new Actions(driver); WebElement element = driver.findElement(By.id("elementId")); actions.clickAndHold(element).build().perform();
  1. Releasing the Mouse Button: To release the mouse button after performing a click and hold action, you can use the release() method of the Actions class. Here's an example:
java
Actions actions = new Actions(driver); WebElement element = driver.findElement(By.id("elementId")); actions.clickAndHold(element).release().build().perform();
  1. Drag and Drop: Dragging and dropping elements is a common interaction in many web applications. The Actions class provides the dragAndDrop() method to simulate this action. Here's an example:
java
Actions actions = new Actions(driver); WebElement sourceElement = driver.findElement(By.id("sourceElementId")); WebElement targetElement = driver.findElement(By.id("targetElementId")); actions.dragAndDrop(sourceElement, targetElement).build().perform();
  1. Moving to an Element: Sometimes, you may need to move the mouse cursor to a specific element without performing any click or action. The moveToElement() method of the Actions class allows you to achieve this. Here's an example:
java
Actions actions = new Actions(driver); WebElement element = driver.findElement(By.id("elementId")); actions.moveToElement(element).build().perform();


8. Mouse Hover and Click:
We usually come across some scenarios in automation of mouse hover like clicking on a sub-menu link which appears only after moving your cursor to menu link. It's quite a tricky thing to perform in automation. Thanks to the Actions Class in Selenium WebDriver.  We already have a Selenium command for it. Here's an example:

java
// Mouse Hover WebElement menuLink = driver.findElement(By.xpath("/html/some/xpath")); // Xpath for Menu WebElement subMenuLink = driver.findElement(By.xpath("/html/some/xpath")); // Xpath for Sub Menu Actions actions = new Actions(driver); // Create object of Actions class actions.moveToElement(menuLink); // Move cursor to Menu link (Mouse hover on menu link so that sub menu is displayed) actions.click(subMenuLink).build().perform(); // Click on Submenu link (which is displayed after mouse hovering cursor on menu link)
The above code snippet demonstrates how to perform a mouse hover and click action using the Actions class in Selenium WebDriver. First, we locate the menu and submenu elements using their Xpaths. Then, we create an object of the Actions class. Next, we use the moveToElement() method to move the cursor to the menu link, triggering the display of the submenu. Finally, we use the click() method to click on the submenu link and the build().perform() methods to build and execute the actions.

4. Performing Keyboard Actions in Selenium WebDriver

Keyboard actions are an essential part of web application testing. With Selenium WebDriver's Actions class, you can simulate various keyboard events and perform keyboard actions on web elements. In this tutorial, we will explore different keyboard actions supported by the Actions class and how to use them in your test scripts.

4.1. Import the Required Classes

To start using the Actions class, you need to import the necessary classes in your Selenium WebDriver test script:

java
import org.openqa.selenium.interactions.Actions; import org.openqa.selenium.Keys;

4.2. Create an Instance of the Actions Class

Next, create an instance of the Actions class using the WebDriver object:

java
Actions actions = new Actions(driver);

Replace driver with your WebDriver instance.

4.3. Performing Keyboard Actions

The Actions class provides several methods to perform keyboard actions. Here are some commonly used methods:

a.keyDown(CharSequence key) - Performs a key press without releasing it.

b.keyUp(CharSequence key) - Releases a key that was pressed using the keyDown method.

c. sendKeys(CharSequence... keysToSend) - Sends a series of keystrokes to the active element.

Let's look at examples of how to use these methods:

i. Press and Release a Key

java
// Press the SHIFT key actions.keyDown(Keys.SHIFT).build().perform(); // Release the SHIFT key actions.keyUp(Keys.SHIFT).build().perform();

In the above example, we press the SHIFT key using the keyDown method and then release it using the keyUp method.

ii. Send Keystrokes to an Element

java
// Locate the text input field WebElement inputField = driver.findElement(By.xpath("//input[@id='input-field']")); // Send "Hello" to the input field actions.sendKeys(inputField, "Hello").build().perform();

In this example, we locate an input field using its XPath and send the keystrokes "Hello" to the field using the sendKeys method.

4.4. Combining Keyboard Actions

You can also combine multiple keyboard actions using the keyDown, keyUp, and sendKeys methods. For example:

java
// Press CTRL + A to select all text actions.keyDown(Keys.CONTROL).sendKeys("a").keyUp(Keys.CONTROL).build().perform();

In this example, we press the CTRL key, send the "a" keystroke, and then release the CTRL key. This combination selects all text in the active element.

4.5. Perform the Keyboard Actions

Finally, to execute the keyboard actions, call the build().perform() method:

java
actions.build().perform();

This ensures that all the actions you've defined are built into a single composite action and then performed.

Example Program for Actions Class Keyboard Actions:

package com.techlistic.selenium;

import java.util.concurrent.TimeUnit;

import org.openqa.selenium.By;
import org.openqa.selenium.Keys;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.openqa.selenium.interactions.Actions;

public class ActionsKeyboard {

 public static void main(String[] args) {
  
  // Set Path of Gecko driver
  System.setProperty("webdriver.gecko.driver", "./src/com/techlistic/utils/geckodriver.exe");
  
  // Launch Forefox
  WebDriver driver = new FirefoxDriver();

  // Open Techlcistic.com's practice form
  driver.get("https://www.techlistic.com/p/selenium-practice-form.html");

  // Set Implicit Wait
  driver.manage().timeouts().implicitlyWait(30, TimeUnit.SECONDS);

  // Maximize Window
  driver.manage().window().maximize();

  // Store Location of Firstname in Webelement
  WebElement FIRSTNAME = driver.findElement(By.name("firstname"));  
  
  /* KeyUP and KeyDown
   */
  
  // Create object of Actions class
  Actions actions = new Actions(driver);
    
  // This will type Username in Uppercase as we are typing using Shift key pressed
  actions.keyDown(Keys.SHIFT)
  .sendKeys(FIRSTNAME, "john snow")
  .keyUp(Keys.SHIFT)
  .build()
  .perform();
  
 }
}


5. Handling Complex User Interactions in Selenium WebDriver

In addition to basic mouse and keyboard actions, the Actions class in Selenium WebDriver provides powerful capabilities for handling complex user interactions on web applications. These interactions involve a combination of mouse and keyboard actions performed in a specific order or based on certain conditions. In this tutorial, we will explore how to handle complex user interactions using the Actions class.

5.1. Chaining Multiple Actions Together

Sometimes, you may need to perform a series of actions in a specific order. The Actions class allows you to chain multiple actions together using the build() and perform() methods. Here's an example:

java
Actions actions = new Actions(driver); actions.moveToElement(element1) .click() .moveToElement(element2) .click() .build() .perform();

In the above example, we chain multiple actions to move the mouse to element1, click it, then move to element2, and click it as well. The build() method builds the composite action, and the perform() method executes the action.

5.2. Performing Actions on Nested Elements

In some cases, you may need to perform actions on nested elements within a web page. You can achieve this by using the moveToElement() method to move the mouse to the parent element and then perform the desired action on the nested element. Here's an example:

java
Actions actions = new Actions(driver); actions.moveToElement(parentElement) .moveToElement(nestedElement) .click() .build() .perform();

In this example, we first move the mouse to the parentElement and then move to the nestedElement to perform a click action.

5.3. Waiting for Specific Conditions Before Performing Actions

There may be scenarios where you need to wait for specific conditions to be met before performing certain actions. In such cases, you can use explicit waits in combination with the Actions class. Here's an example:

java
Actions actions = new Actions(driver); WebDriverWait wait = new WebDriverWait(driver, 10); WebElement element = wait.until(ExpectedConditions.visibilityOfElementLocated(By.id("element-id"))); actions.moveToElement(element) .click() .build() .perform();

In this example, we use an explicit wait to wait for the visibility of the element with the specified ID. Once the element is visible, we perform the desired action using the Actions class.


6. Advanced Techniques with the Actions Class in Selenium WebDriver

The Actions class in Selenium WebDriver provides a wide range of advanced techniques that can enhance your test automation scripts. In this tutorial, we will explore some of these techniques and demonstrate how they can be used to handle complex scenarios and optimize your test scripts.

6.1. Handling Dynamic Elements during Actions

In certain cases, the elements on a web page may change dynamically during the execution of an action. This can cause the action to fail if the element is no longer available. To handle this situation, you can use the moveToElement() method with the offset parameters to perform actions relative to the current mouse position. Here's an example:

java
Actions actions = new Actions(driver); WebElement element = driver.findElement(By.id("dynamic-element")); // Get the current position of the mouse cursor int xOffset = 10; // Adjust the X offset as per your requirements int yOffset = 10; // Adjust the Y offset as per your requirements // Move the mouse cursor to the element with the specified offset actions.moveToElement(element, xOffset, yOffset) .click() .build() .perform();

In this example, we first locate the dynamically changing element using a suitable locator strategy. Then, we use moveToElement() with the desired offset values to move the mouse cursor relative to the element's position. Finally, we perform the desired action, such as a click, on the dynamic element.

6.2. Integrating with Explicit Waits for Synchronization

To ensure that your actions are performed on the correct elements and at the right time, it is important to synchronize your test scripts with the application's behavior. Explicit waits can be used in combination with the Actions class to wait for specific conditions before performing actions. Here's an example:

java
Actions actions = new Actions(driver); WebDriverWait wait = new WebDriverWait(driver, 10); WebElement element = wait.until(ExpectedConditions.elementToBeClickable(By.id("element-id"))); actions.moveToElement(element) .click() .build() .perform();

In this example, an explicit wait is used to wait for the element with the specified ID to be clickable. Once the element is clickable, the action is performed using the Actions class. This ensures that the action is executed only when the element is ready to receive the action.

6.3. Leveraging the Page Object Model (POM) Design Pattern

The Page Object Model (POM) is a widely used design pattern for organizing and maintaining test automation scripts. It promotes the separation of page elements and their associated actions into separate classes, making the code more modular and maintainable. You can integrate the Actions class into your POM-based test scripts by creating methods in the page object classes that perform the desired actions. Here's an example:

java
public class HomePage { private WebDriver driver; private Actions actions; // Constructor public HomePage(WebDriver driver) { this.driver = driver; actions = new Actions(driver); } // Perform mouse hover action on an element public void hoverOnElement(WebElement element) { actions.moveToElement(element) .build() .perform(); } }

In this example, we have a HomePage class that contains a method hoverOnElement() to perform a mouse hover action on a given element. By encapsulating the actions within the page object class, you can easily reuse them across different test cases and keep your code organized.

7. Assignment Time

Now it's time to do a coding assignment, 

8. Conclusion

In conclusion, the Actions class in Selenium WebDriver provides a powerful set of methods to handle complex user interactions involving keyboard and mouse actions. It enables you to perform various actions such as mouse hover, click, drag and drop, and keyboard events like key press and release.

The Actions class offers flexibility and control in automating user interactions, allowing you to simulate real-world scenarios and test the functionality of web applications more effectively. By utilising the Actions class, you can enhance your test automation scripts and improve the overall quality of your web application testing.


Selenium 25+ WebDriver Commands  << Previous   ||   Next >>   Selenium Wait Commands

Author
Vaneesh Behl
Passionately writing and working in Tech Space for more than a decade.

Comments

Popular posts from this blog

17 Best Demo Websites for Automation Testing Practice

Automation Practice: Automate Amazon like E-Commerce Website with Selenium

14 Best Selenium Practice Exercises for Automation Practice

Mastering Selenium Practice: Automating Web Tables with Demo Examples

Mastering Selenium WebDriver: 25+ Essential Commands for Effective Web Testing

Top 10 Websites for Interview Preparation: Features and Benefits for Job Seekers

Top 10 Highly Paid Indian CEOs in the USA

Selenium IDE Tutorial: How to Automate Web Testing with Easy-to-Use Interface

Some Funny Conversations of QA and Developer over Bugs

Top 10 Websites to Learn Excel for Free