SUBSCRIBE HERE TO GET POST UPDATES VIA EMAIL :

Delivered by FeedBurner

Selenium WebDriver : Drag And Drop Element By Pixel(X, Y) Offset

We can use Advanced User Interactions API of selenium webdriver software testing tool to drag the targeted element and drop It on destination element. I have already described usage of dragAndDrop method with example In THIS POST. Now supposing, You have an element which you wants to drag and drop by 100 pixel offset
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.

Drag And Drop Element In Horizontal Direction By 100 Pixel
If you wants to drag and drop element by 100 pixel offset In horizontal direction then you can use syntax like bellow.
new Actions(driver).dragAndDropBy(dragElementFrom, 100, 0).build() .perform();

Drag And Drop Element In Vertical Direction By 100 Pixel
To drag and drop element by 100 pixel offset In vertical direction, You can use bellow given syntax In your software test case.
new Actions(driver).dragAndDropBy(dragElementFrom, 0, 100).build() .perform();

Drag And Drop Element In Horizontal And Vertical Direction By -100 Pixel
To drag and drop element by -100 pixel offset In horizontal and vertical direction, You can write your software test case code as bellow. Here -X offset represents right to left direction and -Y offset represents bottom to top direction of web page.
new Actions(driver).dragAndDropBy(dragElementFrom, -100, -100).build() .perform();

Full practical example to perform all above three operations Is as bellow.

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.in/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. So this Is another example of selenium webdriver's advanced user Interactions using Actions class.

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();


1 comment:

  1. 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.

    ReplyDelete