Trascinare e rilasciare con il selenio WebDriver su Java

Question

Trascinare e rilasciare con il selenio WebDriver su Java

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> 

bersaglio: -

<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> 

sto usando questo codice per trascinare e drop: -

Actions builder = new Actions(driver); 

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

dragAndDrop.perform(); 

Voglio trascinare l'elemento src nell'elemento target (inserire come tag li dentro il tag ol di div). Come posso inserire come tag primo o ultimo o intermedio in ol di div (elemento target).

Voglio creare un tag li (come come li nell'elemento di destinazione) e quindi trascinare l'elemento src sul tag li appena creato all'interno di ol (presente nell'elemento di destinazione).

Come si crea un tag li in selenio?

Answer 1

Usa

Actions builder = new Actions(driver); 

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

Prima di questa Si prega di verificare src e trgt sono correttamente in grado di identificare gli oggetti.

Grazie. Arun

Answer 2

Non è possibile creare elementi utilizzando il selenio. Il selenio è pensato per testare le applicazioni web e non per modificare il codice sorgente.

Sebbene sia un'eccezione, è possibile utilizzare javascript per modificare l'origine.

Answer 3

Webdriver è progettato per l'automazione del browser, non per la modifica del codice lato server o HTML restituito dal server. Tuttavia, se si desidera modificare temporaneamente l'HTML sul lato client, è necessario eseguire ciò che fanno gli altri e eseguire JavaScript nel browser.

è possibile eseguire JavaScript con un'istanza WebDriver gettandola in un JavascriptExecutor:

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

Quindi è possibile utilizzare JavaScript per manipolare il DOM all'interno della pagina viene mostrato sul browser che l'istanza WebDriver è attualmente alla guida .

ho referrred sotto il collegamento: How to create a li tag dynamically using selenium webdriver on java

Answer 4

è possibile all'utente ciclo for per elemento drap da una posizione a posizione multipla.

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"); 
     } 

O

// Spostare elemento da una posizione all'altra posizione.

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 5

Funziona per me ..

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

} 

ho affrontato problemi con azioni Selenio drag and drop. Il codice sopra era la soluzione per me.