有什么方法可以将元素从一帧拖放到另一帧?

时间:2018-12-30 20:10:05

标签: java selenium selenium-webdriver

希望您做得好,

我正在尝试将一个元素从FrameOne拖放到FrameTwo上,但无法做到这一点。请帮助我理解概念和此处做错的事情,并且仅需使用Actions类即可完成任务。< / p>

以下是网址:

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

在此元素位于div块中的情况下,我可以使用Actions类获取所有定位器并执行所有其他操作,但不能拖放该元素。

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

在这里,我试图将元素从第一帧移动到第二帧,但是我无法这样做。

我尝试过drangAndDrop(),ClickAndHold()方法,搜索了很多解决方案,在同一视频上观看视频都没有成功。

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

}
}

另一种尝试:

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

预期:该元素应移至第3帧 实际:什么都没发生。

3 个答案:

答案 0 :(得分:1)

如果首先确定第一帧并使用Actions类,该怎么办。您可以在那里点击并按住。然后切换到另一帧,并使用移至元素。

// move to first frame
driver.switchTo().frame("frameOne");

// identify element in first frame
WebElement elementOne = driver.findElement(By.xpath(XPATH));

// 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
Actions actions2 = new Actions(driver);
Actions action2 = actions2.moveToElement(elementTwo);
actions2.release(elementTwo);
actions2.build();
action2.perform();

答案 1 :(得分:1)

在使用Actions类进行了许多跟踪之后,我了解到不能使用Actions类跨帧拖放元素。因此,我转而使用Robot Class并成功了!

function mapStateToProps({specificDeckReducer}) {
    return {
        deck: specificDeckReducer.deck
    }
}


 componentDidUpdate() { // THE PROBLEM IS HERE.
        const { deck } = this.props
        if (deck != null && deck.id) {
            this.showDeckDetail(deck)
            this.reset()
        }
    }

这里的睡眠很重要,因为命令以快速的方式实现,并且可以帮助Robot类准确地调整其命令节奏。

根据要拖动的dragFrame,可以使用相应的坐标。

答案 2 :(得分:0)

我注意到,在运行上述代码时,如果移动鼠标,则可以看到鼠标附加的拖动元素。尝试使用Robot库并通过Robot库鼠标操作执行此操作。 参见https://www.guru99.com/using-robot-api-selenium.html

我无法对此进行测试,因为机器人库在Mac上存在错误,并且我正在使用Mac,如果您使用的是Windows,则可以尝试:

    Point browserLoc = driver.manage().window().getPosition();

    driver.switchTo().frame(0);

    WebElement frame1 = driver.findElement(By.xpath("//iframe[1]"));        
    Point frameLoc = frame1.getLocation();

    driver.switchTo().frame(frame1);
    Thread.sleep(1000);

    WebElement listElement1 = driver.findElement(By.id("dragFrame-2"));
    Point elementLoc = listElement1.getLocation();
    Dimension elementSize = listElement1.getSize();

    int x = elementLoc.getX() + frameLoc.getX() + browserLoc.getX() + elementSize.getWidth()/2;
    int y = elementLoc.getY() + frameLoc.getY() + browserLoc.getY() + elementSize.getHeight()/2;

    Robot robot = new Robot();
    robot.setAutoDelay(50); 
    robot.mouseMove(x, y);

    Actions action = new Actions(driver);
    action.clickAndHold(listElement1);
    Action a  = action.build();
    a.perform();
    Thread.sleep(1000);

    driver.switchTo().defaultContent();
    driver.switchTo().frame(0);

    WebElement frame2 = driver.findElement(By.xpath("//iframe[2]"));
    Point frameLoc2 = frame2.getLocation();
    driver.switchTo().frame(frame2);

    WebElement frame2Body = driver.findElement(By.xpath("//body")); 
    Point frame2BodyLoc = frame2Body.getLocation();
    Dimension frame2BodySize = frame2Body.getSize();

    int x1 = frame2BodyLoc.getX() + frameLoc2.getX() + browserLoc.getX() + frame2BodySize.getWidth()/2;
    int y1 = frame2BodyLoc.getY() + frameLoc2.getY() + browserLoc.getY() + frame2BodySize.getHeight()/2;

    robot.setAutoDelay(50); 
    robot.mouseMove(x1, y1);

    action.moveToElement(frame2Body);
    action.release();
    a = action.build();
    a.perform();