3

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 :

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 dragAndDrop(),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.

2 Answers 2

0

try this out Create object of actions class

Actions act=new Actions(driver);

Find element xpath which we need to drag

WebElement drag=driver.findElement(By.xpath("put x path"));

Find element xpath where we need to drop

WebElement drop=driver.findElement(By.xpath("put x path"));

Drag element to destination

act.dragAndDrop(drag, drop).build().perform();

To use drag and drop in CQ use double click function first and put any component then try above method.

update

int attempts = 0;
    while(attempts < 2) {
        try {
               //do somthing
        } 
        catch(StaleElementException e) {
        }
        attempts++;
    }
11
  • 1
    Hi rao, I tried it's holding the element but not droping it in frame. getting following exception : Exception in thread "main" org.openqa.selenium.StaleElementReferenceException: stale element reference: element is not attached to the page document Jan 1, 2019 at 13:55
  • okay then your frame is either not available or not clickable
    – Rao
    Jan 1, 2019 at 13:57
  • so what you keep your drop function in for loop and try to drop
    – Rao
    Jan 1, 2019 at 13:58
  • builder.doubleClick(frameOne).build().perform(); builder.moveToElement(elementToDrag).clickAndHold().build().perform(); builder.doubleClick(frameTwo).build().perform(); WebElement elementTwo = driver.findElement(By.xpath("//body[@class='frameBody dropFrameBody']")); builder.release(elementTwo).build().perform(); Jan 1, 2019 at 16:02
  • Even after I'm switching to frame I'm not able to do so can you check the code on your end? Jan 1, 2019 at 16:04
0

Below Code worked for me. But not sure how much is feasible.(for different browsers/resolutions/devices) I tried it on chrome browser and it worked for me.

        driver.switchTo().frame(0);
        System.out.println("switched to frame-0");
        Actions builder = new Actions(driver);
        WebElement elementOne = driver.findElement(By.id("dragFrame-0"));
        builder.clickAndHold(elementOne);
        builder.moveToElement(elementOne, 10, 10);
        Action action = builder.build();
        action.perform();
        driver.switchTo().defaultContent();
        System.out.println("switched to default content");

        driver.switchTo().frame("result");
        driver.switchTo().frame(1);
        System.out.println("switched to frame-1");
        WebElement ele = driver.findElement(By.xpath("//body[@class='frameBody dropFrameBody']"));
        System.out.println("element found");
        builder.moveToElement(ele).click(ele).release(ele);
        System.out.println("element released");
        builder.release(ele);
        action = builder.build();
        action.perform();
        WebElement ele2 = driver.findElement(By.xpath("//body[@class='frameBody dropFrameBody']/ul/li[@id='dragFrame-0']"));
        boolean b = ele2.isDisplayed();
        System.out.println(b);
        Thread.sleep(6000);

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.