In horizontal direction or 100 pixel offset In Vertical direction or both the directions at the same time then you can use dragAndDropBy method of webdriver’s Actions class for drag and drop selenium.
Drag And Drop Selenium Element In Horizontal Direction By 100 Pixel
new Actions(driver).dragAndDropBy(dragElementFrom, 100, 0).build() .perform();
Drag And Drop Element In Vertical Direction By 100 Pixel in Selenium
new Actions(driver).dragAndDropBy(dragElementFrom, 0, 100).build() .perform();
Drag And Drop Element In Horizontal And Vertical Direction By -100 Pixel Selenium
new Actions(driver).dragAndDropBy(dragElementFrom, -100, -100).build() .perform();
Full practical example to perform all above three operations Is as bellow.
drag and drop selenium java Example
package Testing_Pack;
import java.util.concurrent.TimeUnit;
import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.openqa.selenium.interactions.Actions;
import org.testng.annotations.BeforeTest;
import org.testng.annotations.Test;
public class DragAndDrop {
WebDriver driver = null;
@BeforeTest
public void setup() throws Exception {
driver = new FirefoxDriver();
driver.manage().window().maximize();
driver.manage().timeouts().implicitlyWait(20, TimeUnit.SECONDS);
driver.get("http://only-testing-blog.blogspot.com/2014/09/drag-and-drop.html");
}
@Test
public void dragAndDrop() throws InterruptedException {
//Locate element which you wants to drag.
WebElement dragElementFrom = driver.findElement(By.xpath("//div[@id='dragdiv']"));
//To drag and drop element by 100 pixel offset In horizontal direction X.
new Actions(driver).dragAndDropBy(dragElementFrom, 100, 0).build() .perform();
//To generate alert after horizontal direction drag and drop. VIEW EXAMPLE
JavascriptExecutor javascript = (JavascriptExecutor) driver;
javascript.executeScript("alert('Element Is drag and drop by 100 pixel offset In horizontal direction.');");
Thread.sleep(5000);
driver.switchTo().alert().accept();
//To drag and drop element by 100 pixel offset In Vertical direction Y.
new Actions(driver).dragAndDropBy(dragElementFrom, 0, 100).build() .perform();
//To generate alert after Vertical direction drag and drop.
javascript.executeScript("alert('Element Is drag and drop by 100 pixel offset In Vertical direction.');");
Thread.sleep(5000);
driver.switchTo().alert().accept();
//To drag and drop element by -100 pixel offset In horizontal and -100 pixel offset In Vertical direction.
new Actions(driver).dragAndDropBy(dragElementFrom, -100, -100).build() .perform();
//To generate alert after horizontal and vertical direction drag and drop.
javascript.executeScript("alert('Element Is drag and drop by -100 pixel offset In horizontal and -100 pixel offset In Vertical direction.');");
Thread.sleep(5000);
driver.switchTo().alert().accept();
}
}
You can run It In your eclipse and observe the X Y direction movement of software web element using selenium drag and drop java. So this Is another example of selenium webdriver’s advanced user Interactions using Actions class. This way you can perform drag and drop using javascript in selenium webdriver.
Alternatively you can use moveByOffset method of selenium WebDriver’s Advanced User Interactions API to move software web element by given pixel offset. Syntax Is as bellow.
new Actions(driver).clickAndHold(dragElementFrom).moveByOffset(100,100).release().perform();
6 thoughts on “Selenium WebDriver : Drag And Drop Element By Pixel(X, Y) Offset using javascriptexecutor”
Hi,
when I run this Code getting Error Message"org.openqa.selenium.NoAlertPresentException: No alert is active (WARNING: The server did not provide any stacktrace information)". Please give me solution.
How to drag from an item from a list and drop it in selenium webdriver java
How to drag from an item from a list and drop it in selenium webdriver java
finally this site helped…..thanku
drag and drop not working with HTML5….any workaround this.???
Missing something important here: when one drags (50, 100) such point moving RIGHT 50 px and DOWN 100 px on the screen ?