Let’s say we have a web application where we need to drag an item from one location to another location. These kinds of complex actions are not available in basic element properties. Automating rich web application is interesting, as it involves advanced user interactions. Thankfully Selenium has provided a separate “Actions” class to handle these advanced user interactions.
How it works:The action chain generator implements the Builder pattern to create a Composite Action containing a group of other actions. This should ease building actions by configuring an Actions chains generator instance and invoking its build( ) method to get the complex action.
It was really very hard for me to search for a website where I can try ‘Drag n drop’ feature of WebDriver. I was lucky to find two website.
Example 1: In this example we will drag the
Thriller folder from the left table on to the
Bestsellers folder of the right side table.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
|
package practiceTestCases;
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.Action;
import org.openqa.selenium.interactions.Actions;
public class DragAndDrop {
public static void main(String[] args) throws InterruptedException {
WebDriver driver = new FirefoxDriver();
String URL = "http://www.dhtmlx.com/docs/products/dhtmlxTree/index.shtml";
driver.get(URL);
// It is always advisable to Maximize the window before performing DragNDrop action
driver.manage().window().maximize();
driver.manage().timeouts().implicitlyWait(10000, TimeUnit.MILLISECONDS);
WebElement From = driver.findElement(By.xpath(".//*[@id='treebox1']/div/table/tbody/tr[2]/td[2]/table/tbody/tr[2]/td[2]/table/tbody/tr[1]/td[4]/span"));
WebElement To = driver.findElement(By.xpath(".//*[@id='treebox2']/div/table/tbody/tr[2]/td[2]/table/tbody/tr[2]/td[2]/table/tbody/tr[2]/td[2]/table/tbody/tr[1]/td[4]/span"));
Actions builder = new Actions(driver);
Action dragAndDrop = builder.clickAndHold(From)
.moveToElement(To)
.release(To)
.build();
dragAndDrop.perform();
}
}
|
Now if you carefully look at the folder, you will notice that the Thrillers folder is been moved to Bestsellers folder. The new folder structure will look like this:

Example 2: In this example there is a Checklist on the left side and there are four sub menus with the name of DragAndDrop-[1-3]. We will login to this website and then drag DragAndDrop-1 to DragAndDrop-4 of the left side sub menu.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
|
package practiceTestCases;
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.Action;
import org.openqa.selenium.interactions.Actions;
public class DragAndDrop {
public static void main(String[] args) throws InterruptedException {
WebDriver driver = new FirefoxDriver();
String URL = "http://sandbox.checklist.com/account/";
driver.get(URL);
driver.findElement(By.name("j_username")).sendKeys("Username");
driver.findElement(By.name("j_password")).sendKeys("Password);
driver.findElement(By.name("login")).click();
driver.manage().window().maximize();
driver.manage().timeouts().implicitlyWait(10000, TimeUnit.MILLISECONDS);
WebElement From = driver.findElement(By.xpath(".//*[@id='userChecklists']/li[1]/a/span"));
WebElement To = driver.findElement(By.xpath(".//*[@id='userChecklists']/li[4]/a/span"));
Actions builder = new Actions(driver);
Action dragAndDrop = builder.clickAndHold(From)
.moveToElement(To)
.release(To)
.build();
dragAndDrop.perform();
}
}
|
Please have a look on the video also and put special attention to it, as drag and drop action happened so swiftly that you might not able to notice it.
No comments:
Post a Comment