在Java上使用Selenium WebDriver拖放

Question

在Java上使用Selenium WebDriver拖放

src：-

<div class="dd"><img alt="World" src="test.png" style="margin-top: -5px;width:auto;height:16px;padding-right:5px;"><span>sample</span></div>

目标：-

<div id="hierarchy">
<div class="dd" id="tree_nodes">
<ol class="dd-list" id="ancestor">

<li class="dd-item" ><div class="dd-handle"><img alt="testing" src="test2.png" ><a  name="tree" style="margin:5px;">first page</a></div></li>

<li class="dd-item" ><div class="dd-handle"><img alt="testing" src="test2.png" s><a  name="tree" style="margin:5px;">second page</a></div></li>

<li class="dd-item" ><div class="dd-handle"><img alt="testing" src="test2.png" ><a  name="tree" style="margin:5px;">third page</a></div></li>

<li class="dd-item" ><div class="dd-handle"><img alt="testing" src="test2.png" s><a  name="tree" style="margin:5px;">fourth page</a></div></li>

</ol>
</div>


</div>

我正在使用此代码进行拖放：-

Actions builder = new Actions(driver);

Action dragAndDrop = builder.clickAndHold(src).moveToElement(trgt).release(trgt).build();

dragAndDrop.perform();

我想将src元素拖到目标元素（作为li标签插入div标签的ol中）。 我怎样才能作为div（目标元素）的ol的第一个或最后一个或中间li标签插入。

我想创建一个li标签（就像目标元素中的li一样），然后将src元素拖到ol（存在于目标元素中）中新创建的li标签。

如何在硒中创建li标签？

Answer 1

这个对我有用..

public static void DragAndDropJS(WebElement source, WebElement destination, WebDriver driver) throws Exception 
{
    JavascriptExecutor js = (JavascriptExecutor) driver;
    js.executeScript("function createEvent(typeOfEvent) {\n" +"var event =document.createEvent(\"CustomEvent\");\n" +"event.initCustomEvent(typeOfEvent,true, true, null);\n" +"event.dataTransfer = {\n" +"data: {},\n" +"setData: function (key, value) {\n" +"this.data[key] = value;\n" +"},\n" +"getData: function (key) {\n" +"return this.data[key];\n" +"}\n" +"};\n" +"return event;\n" +"}\n" +"\n" +"function dispatchEvent(element, event,transferData) {\n" +"if (transferData !== undefined) {\n" +"event.dataTransfer = transferData;\n" +"}\n" +"if (element.dispatchEvent) {\n" + "element.dispatchEvent(event);\n" +"} else if (element.fireEvent) {\n" +"element.fireEvent(\"on\" + event.type, event);\n" +"}\n" +"}\n" +"\n" +"function simulateHTML5DragAndDrop(element, destination) {\n" +"var dragStartEvent =createEvent('dragstart');\n" +"dispatchEvent(element, dragStartEvent);\n" +"var dropEvent = createEvent('drop');\n" +"dispatchEvent(destination, dropEvent,dragStartEvent.dataTransfer);\n" +"var dragEndEvent = createEvent('dragend');\n" +"dispatchEvent(element, dragEndEvent,dropEvent.dataTransfer);\n" +"}\n" +"\n" +"var source = arguments[0];\n" +"var destination = arguments[1];\n" +"simulateHTML5DragAndDrop(source,destination);",source, destination);
    Thread.sleep(1500);

}

我遇到Selenium Actions拖放问题。 上面的代码是我的解决方案。

Answer 2

使用

Actions builder = new Actions(driver);

builder.dragAndDrop(src,trgt).build().perform();

在此之前，请检查src和trgt是否能够正确识别对象。

谢谢。 阿伦

Answer 3

您不能使用Selenium创建元素。 Selenium用于测试Web应用程序，而不修改源代码。

尽管作为例外，您可以使用javascript来修改源。

Answer 4

Webdriver设计用于浏览器自动化，而不用于更改服务器端代码或服务器返回的HTML。 但是，如果要在客户端临时更改HTML，则必须执行其他所有人的操作，并在浏览器上运行一些JavaScript。

您可以通过将WebDriver实例转换为JavascriptExecutor来执行JavaScript：

WebDriver driver; // Assigned elsewhere
JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript("return document.title");

然后，您可以使用JavaScript来操纵WebDriver实例当前正在驱动的浏览器上显示的页面内的DOM。

我引用了以下链接： 如何在Java上使用Selenium Webdriver动态创建li标签

Answer 5

您可以使用循环将元素从一个位置悬垂到多个位置。

public static void dragdrop(){
    WebElement slider = driver.findElement(By.id("dragdrop"));
    int width=slider.getSize().getWidth();   // Width of SLider
    Actions move = new Actions(driver);
    move.moveToElement(slider, ((width*10)/100), 0).click();  // move to a specific point on the dragpoint
    move.build().perform();
       System.out.println("Slider moved");
      }

要么

//将元素从一个位置移动到另一位置。

 public void dragdrop(){
     WebElement element = driver.findElement(By.name("source")); 

     WebElement target = driver.findElement(By.name("target"));

   (new Actions(driver)).dragAndDrop(element, target).perform();

}

Answer 6

尝试下面的代码

WebElement LocatorFrom=driver.findElement(By.xpath("(.//*[normalize-space(text()) and 
normalize-space(.)='Items to Drag'])[1]/following::span[1]"));  

 //Element on which need to drop.       
 WebElement LocatorTo=driver.findElement(By.id("mydropzone"));  
 String xto=Integer.toString(LocatorTo.getLocation().x);
String yto=Integer.toString(LocatorTo.getLocation().y);
JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript("function createEvent(typeOfEvent) {\n" +"var event =document.createEvent(\"CustomEvent\");\n" +"event.initCustomEvent(typeOfEvent,true, true, null);\n" +"event.dataTransfer = {\n" +"data: {},\n" +"setData: function (key, value) {\n" +"this.data[key] = value;\n" +"},\n" +"getData: function (key) {\n" +"return this.data[key];\n" +"}\n" +"};\n" +"return event;\n" +"}\n" +"\n" +"function dispatchEvent(element, event,transferData) {\n" +"if (transferData !== undefined) {\n" +"event.dataTransfer = transferData;\n" +"}\n" +"if (element.dispatchEvent) {\n" + "element.dispatchEvent(event);\n" +"} else if (element.fireEvent) {\n" +"element.fireEvent(\"on\" + event.type, event);\n" +"}\n" +"}\n" +"\n" +"function simulateHTML5DragAndDrop(element, destination) {\n" +"var dragStartEvent =createEvent('dragstart');\n" +"dispatchEvent(element, dragStartEvent);\n" +"var dropEvent = createEvent('drop');\n" +"dispatchEvent(destination, dropEvent,dragStartEvent.dataTransfer);\n" +"var dragEndEvent = createEvent('dragend');\n" +"dispatchEvent(element, dragEndEvent,dropEvent.dataTransfer);\n" +"}\n" +"\n" +"var source = arguments[0];\n" +"var destination = arguments[1];\n" +"simulateHTML5DragAndDrop(source,destination);",LocatorFrom, LocatorTo);
Thread.sleep(1500);