Drag and Drop not working in selenium code

Question

Drag and Drop is not working in my selenium code below, can anyone help me?

package selenium;

import java.util.concurrent.TimeUnit;

import org.apache.log4j.BasicConfigurator;

import org.openqa.selenium.By;

import org.openqa.selenium.WebDriver;

import org.openqa.selenium.firefox.FirefoxDriver;

import org.openqa.selenium.interactions.Actions;

import org.openqa.selenium.WebElement;


public class draganddrop {

    public static void main(String[] args){

        BasicConfigurator.configure();
        FirefoxDriver driver=new FirefoxDriver();
        driver.get("http://jqueryui.com/droppable/");
        driver.manage().timeouts().implicitlyWait(3,TimeUnit.SECONDS);
        WebElement  from= driver.findElementByXPath("html/body/div[1]");
        WebElement  to=driver.findElementByXPath("html/body/div[2]");
        new Actions(driver).dragAndDrop(from, to).build().perform();


        //Actions mouseoveron=new Actions(driver);
        //mouseoveron.click().dragAndDrop(from, to).build().perform();


    }

}

Answer 1

Your drag and drop element present under iFrame tag. So first you need to switch into frame and then perform drag and drop.

Use below code :

System.setProperty("webdriver.chrome.driver","D:/Application/chromedriver.exe");
driver = new ChromeDriver();        
driver.manage().window().maximize();
driver.get("http://jqueryui.com/droppable/");               
driver.manage().timeouts().implicitlyWait(45, TimeUnit.SECONDS);
driver.switchTo().frame(0); // either use index or frame element
WebElement  from= driver.findElement(By.id("draggable"));
WebElement  to=driver.findElement(By.id("droppable"));
new Actions(driver).dragAndDrop(from, to).build().perform();

Please note : if element id is there then please use id selector instead of xpath

Answer 2

Few things I observed in your code that

You need to first replace

WebElement  from= driver.findElementByXPath("html/body/div[1]");

with

 WebElement from = driver.findElement(By.xpath("html/body/div[1]"))

And

WebElement  to=driver.findElementByXPath("html/body/div[2]");

with

WebElement  to = driver.findElement(By.xpath("html/body/div[2]"));

You can use following code to work out:

driver.navigate().to("http://jqueryui.com/droppable/");
//Wait for the frame to be available and switch to it
WebDriverWait wait = new WebDriverWait(driver, 5);
wait.until(ExpectedConditions.frameToBeAvailableAndSwitchToIt(By.cssSelector(".demo-frame")));
WebElement Sourcelocator = driver.findElement(By.cssSelector(".ui-draggable"));
WebElement Destinationlocator = driver.findElement(By.cssSelector(".ui-droppable"));
dragAndDrop(Sourcelocator,Destinationlocator);

Answer 3

Find your own working code block with some simple tweaks in it:

//BasicConfigurator.configure();
System.setProperty("webdriver.gecko.driver", "C:\\Utility\\BrowserDrivers\\geckodriver.exe");
WebDriver driver=new FirefoxDriver();
driver.get("http://jqueryui.com/droppable/");
driver.manage().timeouts().implicitlyWait(5,TimeUnit.SECONDS);
driver.switchTo().frame(driver.findElement(By.xpath("//iframe[@class='demo-frame']")));
WebElement  from = driver.findElement(By.id("draggable"));
WebElement  to = driver.findElement(By.id("droppable"));
new Actions(driver).dragAndDrop(from, to).build().perform();

Answer 4

You can surely do it using below code. Just ensure that your xpath is correct or else you can't do it using any of the options.

WebElement from = driver.findElement(By.xpath("html/body/div[1]"));
WebElement  to = driver.findElement(By.xpath("html/body/div[2]"));
Actions action1 = new Actions(driver);
action1.clickAndHold(from).moveToElement(to).release(from).build().perform();

Let me know in case of any issues but try this one it will work :)