Selenium Drag and Drop not working for Java

Question

I need to perform a Drag and Drop using Selenium and Java. I used dragAndDrop() method in Action class for this. but it didn't work. From element is selected but its not moving to the To element. I checked the Xpath of the To element. No problem with the Xpath.

This is the screen that I try to automate.

enter image description here

These are the codes that I tried

    public void dragAndDropUsers(String username) throws InterruptedException {
        //Actions class method to drag and drop
        Actions builder = new Actions(WebDriverHelper.getWebDriver());
        Thread.sleep(2000);
        
        WebElement from = WebDriverHelper.getWebDriver().findElement(By.xpath("//span[contains(text(),'"+username+"')]"));
        WebElement to = WebDriverHelper.getWebDriver().findElement(By.xpath("//h6[text()='Sequential Approval Order']/following-sibling::p-tree"));

        builder.dragAndDrop(from,to).build().perform();

    }

above code selecting the To element. But not move.

    public void dragAndDropUsers(String username) throws InterruptedException {
        //Actions class method to drag and drop
        Actions builder = new Actions(WebDriverHelper.getWebDriver());
        Thread.sleep(2000);
        WebElement from = WebDriverHelper.getWebDriver().findElement(By.xpath("//span[contains(text(),'"+username+"')]"));
        WebElement to = WebDriverHelper.getWebDriver().findElement(By.xpath("//h6[text()='Sequential Approval Order']/following-sibling::p-tree"));

        builder.clickAndHold(from).moveToElement(to).release().perform();
        Thread.sleep(5000);

    }

same result for above code. (selecting the To element. But not move. )

public void dragAndDropUsers(String username) throws InterruptedException {
        //Actions class method to drag and drop
        Actions builder = new Actions(WebDriverHelper.getWebDriver());
        Thread.sleep(2000);
        
        WebElement from = WebDriverHelper.getWebDriver().findElement(By.xpath("//span[contains(text(),'"+username+"')]"));
        WebElement to = WebDriverHelper.getWebDriver().findElement(By.xpath("//h6[text()='Sequential Approval Order']/following-sibling::p-tree"));

        JavascriptExecutor _js = (JavascriptExecutor) WebDriverHelper.getWebDriver();
        _js.executeScript("$(arguments[0]).simulate('drag-n-drop',{dragTarget:arguments[1],interpolation:{stepWidth:100,stepDelay:50}});", from, to);
        Thread.sleep(5000);

    }

Above code displayed an error as "org.openqa.selenium.JavascriptException: javascript error: $(...).simulate is not a function"

public void dragAndDropUsers(String username) throws InterruptedException {
        //Actions class method to drag and drop
        Actions builder = new Actions(WebDriverHelper.getWebDriver());
        Thread.sleep(2000);
        WebElement from = WebDriverHelper.getWebDriver().findElement(By.xpath("//span[contains(text(),'"+username+"')]"));
        WebElement to = WebDriverHelper.getWebDriver().findElement(By.xpath("//h6[text()='Sequential Approval Order']/following-sibling::p-tree"));
        int x = to.getLocation().getX();
        int y = to.getLocation().getY();

        System.out.println("x coordinate: "+x);
        System.out.println("y coordinate: "+y);

       builder.moveToElement(from)
               .pause(Duration.ofSeconds(1))
               .clickAndHold(from)
               .pause(Duration.ofSeconds(1))
               .moveByOffset(x, y)
               .moveToElement(to)
               .pause(Duration.ofSeconds(1))
               .release().build().perform();

       Thread.sleep(5000);

    }

Above code is also selecting the From element. But not moving.

Help me to resolve this issue.

score 0 · Answer 1 · answered Jul 07 '23 at 20:46

Not that super clear in which website you attempted the dragAndDrop functionality.

However as a demonstration within the website Droppable | jQuery UI you can simulate dragAndDrop functionality as follows:

Code block:

ChromeOptions options = new ChromeOptions();
options.addArguments("--start-maximized");
WebDriver driver = new ChromeDriver(options);
driver.get("https://jqueryui.com/droppable/");
WebDriverWait wait = new WebDriverWait(driver, Duration.ofSeconds(5));
wait.until(ExpectedConditions.frameToBeAvailableAndSwitchToIt(By.cssSelector("iframe.demo-frame")));

//Identify the draggable element
WebElement dragMe = wait.until(ExpectedConditions.elementToBeClickable(By.xpath("//p[text()='Drag me to my target']")));

// Identify droppable area
WebElement dropHere = wait.until(ExpectedConditions.elementToBeClickable(By.xpath("//p[text()='Drop here']")));
Actions actions = new Actions(driver);
actions.dragAndDrop(dragMe, dropHere).build().perform();

Browser snapshot:

dragAndDrop

Thank you undetected Selenium. I tried this code block. But it didn't works for me. After executing this "dragMe" element is selected but its not moved and dropped to the "dropHere" element. That is the issue I had previously. — Sasith Bandara, Jul 10 '23 at 04:43

Reyan · Answer 2 · 2023-07-10T12:49:16.763

This is known issue: https://github.com/seleniumhq/selenium-google-code-issue-archive/issues/3604

Why drag and drop is not working in Selenium Webdriver?

You can try workarounds suggested.

You can try below code. Here I have moved the element to 0,0 co-ordinate and then moved it to final destination place :

    Rectangle fromRec = fromEle.getRect();
    Rectangle toRec = toEle.getRect();
    int sX = fromRec.getX() + fromRec.width / 2;
    int sY = fromRec.getY() + fromRec.height / 2;
    int eX = toRec.getX() + toRec.getWidth() / 2;
    int eY = sY;

    PointerInput input = new PointerInput(Kind.MOUSE, "default mouse");
    Sequence seq = new Sequence(input, 0);
    seq.addAction(
        input.createPointerMove(Duration.ofSeconds(2), PointerInput.Origin.viewport(), sX, sY));
    seq.addAction(input.createPointerDown(PointerInput.MouseButton.LEFT.asArg()));
    seq.addAction(
        input.createPointerMove(Duration.ofSeconds(2), PointerInput.Origin.viewport(), eX, eY));
    seq.addAction(input.createPointerMove(Duration.ofSeconds(2), PointerInput.Origin.viewport(), 0, 0));
    seq.addAction(
        input.createPointerMove(Duration.ofSeconds(2), PointerInput.Origin.viewport(), eX, eY));
    seq.addAction(input.createPointerUp(PointerInput.MouseButton.LEFT.asArg()));

    ((RemoteWebDriver) driver).perform(Collections.singletonList(seq));

Thank you Reyan. I tried these suggested workarounds. But these things didn't work in my case. Some code blocks selecting the draggable element but not moving it to Element that needs to be dropped. — Sasith Bandara, Jul 10 '23 at 07:06

score 0 · Answer 3 · answered Jul 19 '23 at 12:14

public void dragAndDropUsers(String username) throws InterruptedException {
    //Actions class method to drag and drop
    WebDriver driver=new ChromeDriver();
    Actions builder = new Actions(driver);
    Thread.sleep(2000);

    WebElement from = driver.findElement(By.xpath("//span[contains(text(),'"+username+"')]"));
    WebElement to = driver.findElement(By.xpath("//h6[text()='Sequential Approval Order']/following-sibling::p-tree"));

    builder.dragAndDrop(from,to).perform();

} 


try this i will work 
In action class you need to pass webdriver object reference variable

Selenium Drag and Drop not working for Java

3 Answers3