Is there any way to drag and drop an element from one frame to another?

Sameer Malhotra :

Hope you doing well,

I'm trying to dragAndDrop an element from FrameOne to FrameTwo but not able to do so.Please help me to understand the concept and what I'm doing wrong here and need to achieve the task by using Actions class only.

Here're the URLs :

1. https://www.w3schools.com/html/html5_draganddrop.asp

Here the element is in a div block I'm able to get all the locaters and do all other actions using Actions class but not able to drag and drop the element.

2.https://codepen.io/rjsmer/full/vvewWp

Here I'm trying to move the element from Frame one to Frame two but I'm not able to do so.

I've tried drangAndDrop(),ClickAndHold() methods,Searched so many solutions, watch videos on the same with no success.

package DragAndDropPracticeFrame;

import io.github.bonigarcia.wdm.WebDriverManager;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.interactions.Action;
import org.openqa.selenium.interactions.Actions;

import static io.github.bonigarcia.wdm.DriverManagerType.CHROME;

public class DragDropFrame {
    public static void main(String[] args) throws InterruptedException {
    WebDriverManager.getInstance(CHROME).setup();
    WebDriver driver = new ChromeDriver();
    driver.manage().window().maximize();
    driver.get("https://codepen.io/rjsmer/full/vvewWp");
    driver.switchTo().frame("result");
    System.out.println("Inside First Frame.");
    WebElement frameOne =         
    driver.findElement(By.cssSelector("iframe.dragFrame.dragDrop"));
    driver.switchTo().frame(frameOne);
    System.out.println("Inside Frame 3");
    WebElement elementOne = driver.findElement(By.id("dragFrame-0"));
    System.out.println("First element found: " + elementOne.getText());
    Actions builder = new Actions(driver);
    driver.switchTo().defaultContent();
    System.out.println("Inside main page");
    driver.switchTo().frame("result");
    //System.out.println("Switched to Frame First");
    WebElement frameThree = 
    driver.findElement(By.xpath("//iframe[@class='dropFrame dragDrop']"));
    Action action =
    builder.clickAndHold(elementOne)
    .moveToElement(frameThree)
    .release(frameThree).build();

    //driver.switchTo().frame(frameTwo);
    //System.out.println("Switched to frame 3");
    action.perform();

    //driver.switchTo().defaultContent();
    //builder.perform();

}
}

Another try :

    WebDriverManager.getInstance(CHROME).setup();
        WebDriver driver = new ChromeDriver();
        driver.get("https://codepen.io/rjsmer/full/vvewWp");
        driver.switchTo().frame(0);
        WebElement frameOne = driver.findElement(By.xpath("//iframe[@class='dragFrame dragDrop']"));
        WebElement frameTwo = driver.findElement(By.xpath("//iframe[@class='dropFrame dragDrop']"));
        driver.switchTo().frame(frameOne);
// identify element in first frame
        WebElement elementOne = driver.findElement(By.id("dragFrame-0"));

// Use Actions class for tap and hold
        Actions actions = new Actions(driver);
        Actions action = actions.clickAndHold(elementOne);
        actions.build();
        action.perform();

// switch to the second frame
        driver.switchTo().frame(frameTwo);

// move element to another frame
        WebElement elementTwo = driver.findElement(By.xpath("//body[@class='frameBody dropFrameBody']"));
        Actions actions2 = new Actions(driver);
        Actions action2 = actions2.moveToElement(elementTwo);
        actions2.release(elementOne);
        actions2.build();
        action2.perform();

Expected: The element should move to Frame 3 Actual: Nothing happened.

Satya :

After many trails using Actions class, I understood that Actions class cannot be used drag and drop elements across frames. So, I switched to using Robot Class and it worked!

//Setting up chrome driver
WebDriverManager.getInstance(CHROME).setup();
WebDriver driver = new ChromeDriver();
driver.manage().window().maximize();

//Redirecting to the website
driver.get("https://codepen.io/rjsmer/full/vvewWp");

Robot robot = new Robot();
robot.mouseMove(120, 300);
robot.mousePress(InputEvent.BUTTON1_DOWN_MASK);

Thread.sleep(2000);
robot.mouseMove(500, 320);

Thread.sleep(2000);
robot.mouseRelease(InputEvent.BUTTON1_DOWN_MASK);

The sleeps here are important as the commands are being implemented in a quick fashion and it helps the Robot class in pacing its commands accurately.

Depending on the dragFrame you want to drag, you can use the respective coordinates.