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