How to perform Drag Drop operation using selenium WebDriver?

Drag Drop operation can be implemented in Selenium WebDriver by using Actions class.

Using below 4 steps can explain how drag drop can be achieved using actions class.

perform Drag Drop using Actions Class using Selenium WebDriver
Step1: Create object of Actions class
Step2: Find out dragable Element.
Step3: Find out dropable Element.
Step4: Perform Drag and Drop using object of the actions class.
Syntax for drag and drop:
Actions action = new Actions(driver);
action.dragAndDrop(Sourcelocator, Destinationlocator).build().perform();
Observe below screen shot. We have one draggable element and one droppable element.
Below program illustrate drag and drop operation –
package learnAboutActionsClass;

import java.util.concurrent.TimeUnit;

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

public class DragAndDrop {

 public static void main(String[] args) {

  WebDriver driver = new FirefoxDriver();

  driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);


  WebElement draggableElement = driver.findElement(By.xpath("//*[@id='draggable']"));

  WebElement droppableElement = driver.findElement(By.xpath("//*[@id='droppable']"));

  Actions act = new Actions(driver);

  act.dragAndDrop(draggableElement, droppableElement).build().perform();


Drag and Drop is done, refer below screenshot –
Hope this Helps!!!!

Leave Comment

Your email address will not be published. Required fields are marked *

Looking for learning Framework Development from Scratch? Lookout for Detailed Framework Development videos on YouTube here -

Get the Framework code at Github Repo: