[英]Selenium WebDriver - Unable to drag and drop element in IE11
我正在嘗試將元素從側面板拖放到表單中。 我寫的拖放代碼如下所示。
Actions builder = new Actions(driver);
builder.dragAndDrop(source, target).build().perform();
這在除 IE11 之外的所有瀏覽器中都可以正常工作。
我嘗試了其他方法,例如
方法 1 -
builder.clickAndHold(source)
.moveToElement(target)
.release(target)
.build()
.perform();
方法 2 -
builder.clickAndHold(source)
.pause(Duration.ofSeconds(1))
.moveByOffset(-1, -1)
.pause(Duration.ofSeconds(1))
.moveToElement(target)
.pause(Duration.ofSeconds(1))
.moveToElement(target)
.pause(Duration.ofSeconds(1))
.release(target)
.build()
.perform();
但沒有任何效果。
最重要的是,選項在頁面上什么都不做,但它們正在執行而沒有任何錯誤。 我還嘗試了不同 stackoverflow/gitHub 鏈接中給出的所有 javascript 解決方案,但沒有任何效果。
誰可以幫我這個事?
編輯 1-
正如我之前提到的,我已經嘗試了所有可能/提到的解決方案,但沒有一個有效。 這是我的代碼。
package dragAndDrop;
import java.io.BufferedReader;
import java.io.FileInputStream;
import java.io.IOException;
import java.io.InputStreamReader;
import java.io.Reader;
import java.nio.charset.Charset;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.ie.InternetExplorerDriver;
import org.testng.annotations.Test;
public class DryRunIE{
WebDriver driver;
@Test
public void dragAndDrop() {
System.setProperty("webdriver.ie.driver", System.getProperty("user.dir") + "/Drivers/IEDriverServer.exe");
driver = new InternetExplorerDriver();
driver.get("https://jqueryui.com/droppable/");
driver.manage().window().maximize();
driver.switchTo().frame(0);
try {
//simulateDragAndDrop(driver.findElement(By.id("draggable")), driver.findElement(By.id("droppable")));
//simulateDragDrop(driver.findElement(By.id("draggable")), driver.findElement(By.id("droppable")));
dragAndDropHelper();
} catch (Exception e) {
e.printStackTrace();
}
driver.quit();
try {
Runtime.getRuntime().exec("taskkill /F /IM IEDriverServer.exe");
} catch (IOException e) {
e.printStackTrace();
}
}
private void simulateDragAndDrop(WebElement elementToDrag, WebElement target) throws Exception {
JavascriptExecutor js = (JavascriptExecutor) driver;
String script = "function createEvent(typeOfEvent) {" + "var event = document.createEvent(\"CustomEvent\");"
+ "event.initCustomEvent(typeOfEvent,true, true, null); " + "event.dataTransfer = { " + "data: {}, "
+ "setData: function (key, value) { this.data[key] = value; }, " + "getData: function (key) { "
+ "return this.data[key]; " + "} " + "}; " + "return event;" + "}"
+ "function dispatchEvent(element, event,transferData) { " + "" + "if (transferData !== undefined) { "
+ "event.dataTransfer = transferData; " + "} " + "" + "if (element.dispatchEvent) { "
+ "element.dispatchEvent(event); " + "} " + "" + "else if (element.fireEvent) { "
+ "element.fireEvent(\"on\" + event.type,event); " + "}" + "}" + ""
+ "function simulateHTML5DragAndDrop(element,target) { "
+ "var dragStartEvent =createEvent('dragstart'); " + "dispatchEvent(element, dragStartEvent); "
+ "var dropEvent = createEvent('drop'); "
+ "dispatchEvent(target, dropEvent,dragStartEvent.dataTransfer); "
+ "var dragEndEvent = createEvent('dragend'); "
+ "dispatchEvent(element, dragEndEvent,dropEvent.dataTransfer);" + "}" + ""
+ "var elementToDrag = arguments[0];" + "var targetElem = arguments[1];" + ""
+ "simulateHTML5DragAndDrop(elementToDrag,targetElem);";
js.executeScript(script, elementToDrag, target);
}
private void simulateDragDrop(WebElement ele_source, WebElement ele_target) {
final String JS_DnD =
"var src=arguments[0],tgt=arguments[1];var dataTransfer={dropEffe" +
"ct:'',effectAllowed:'all',files:[],items:{},types:[],setData:fun" +
"ction(format,data){this.items[format]=data;this.types.append(for" +
"mat);},getData:function(format){return this.items[format];},clea" +
"rData:function(format){}};var emit=function(event,target){var ev" +
"t=document.createEvent('Event');evt.initEvent(event,true,false);" +
"evt.dataTransfer=dataTransfer;target.dispatchEvent(evt);};emit('" +
"dragstart',src);emit('dragenter',tgt);emit('dragover',tgt);emit(" +
"'drop',tgt);emit('dragend',src);";
// drag and drop item two into the bin
((JavascriptExecutor)driver).executeScript(JS_DnD, ele_source, ele_target);
}
private void dragAndDropHelper() {
String script = null;
try {
script = readFile(System.getProperty("user.dir") + "\\drag_and_drop_helper.js");
} catch (IOException e) {
e.printStackTrace();
}
JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript(script + "$('#draggable').simulateDragDrop({ dropTarget: '#droppable'});");
System.out.println();
}
// helper method
private static String readFile(String file) throws IOException {
Charset cs = Charset.forName("UTF-8");
FileInputStream stream = new FileInputStream(file);
try {
Reader reader = new BufferedReader(new InputStreamReader(stream, cs));
StringBuilder builder = new StringBuilder();
char[] buffer = new char[8192];
int read;
while ((read = reader.read(buffer, 0, buffer.length)) > 0) {
builder.append(buffer, 0, read);
}
return builder.toString();
} finally {
stream.close();
}
}
}
我已經在 function 下面一一嘗試取消注釋並執行,但所有這些都成功執行,頁面上沒有任何反應。
注意:我從https://gist.github.com/rcorreia/2362544 獲得了 drag_and_drop_helper.js 。
我在這里有什么遺漏或做錯了嗎?
謝謝,錢德雷什帕爾馬
似乎是 IE11 的一個已知問題,沒有人能夠修復。
在 Selenium 存儲庫中打開了一個相關的 GitHub 問題,但由於缺乏工作的、可重現的示例,它已被關閉:
https://github.com/SeleniumHQ/selenium/issues/6354
StackExchange 上的其他用戶自 2016 年以來一直看到此問題,但沒有真正的解決方案:
無法為 IE11 自動拖放:Selenium WebDriver (無工作分辨率)
https://sqa.stackexchange.com/questions/22534/why-drag-and-drop-is-not-working-in-selenium-webdriver/26500 (沒有接受的答案,但有幾個人贊成)
我的猜測是 IE 驅動程序只是不穩定,並且拖放可能在某些網站上有效,但在其他網站上則不能,原因不明。 在 Selenium 存儲庫中打開 GitHub 問題可能會更好,並提供一個工作代碼示例 / URL,其中拖放絕對不起作用,一直。
Selenium 現在拖放是有問題的。 這里描述了拖放的模擬: How to simulation HTML5 Drag and Drop in Selenium Webdriver?
我在這個線程中嘗試了答案: Unable to Automate Drag and Drop for IE11: Selenium WebDriver (Christine 也提到過)。 在IE11中配合代碼中的測試頁面和w3schools的拖放頁面可以很好的工作。 您只需在代碼中將您自己的網站 url 和兩個元素的 id 替換為您自己的即可。
-------------------------------------------------- - - - - - - - 編輯 - - - - - - - - - - - - - - - - - - --------------------------
您提供的網站是關於 jQuery 拖放。 它不同於 HTML5 拖放。 此外,拖放元素位於 iframe 中。 我們首先需要使用switchTo()
來到達 iframe。 您可以檢查下面的代碼,它可以在 IE 中正常工作:
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.ie.InternetExplorerDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.interactions.Actions;
public class IEauto {
public static void main(String[] args) {
//add the IE web driver path here..
System.setProperty("webdriver.ie.driver","C:\\yourpath\\IEDriverServer_x64_3.14.0\\IEDriverServer.exe");
WebDriver driver = new InternetExplorerDriver();
//replace the URL of the web page here..
driver.get("https://jqueryui.com/droppable/");
//int size = driver.findElements(By.tagName("iframe")).size();
driver.switchTo().frame(0);
WebElement ele_source = driver.findElement(By.id("draggable"));
WebElement ele_target = driver.findElement(By.id("droppable"));
Actions builder = new Actions(driver);
builder.dragAndDrop(ele_source, ele_target).build().perform();
}
}
正如我之前提到的,我已經嘗試了所有可能/提到的解決方案,但沒有一個有效。 這是我的代碼。
package dragAndDrop;
import java.io.BufferedReader;
import java.io.FileInputStream;
import java.io.IOException;
import java.io.InputStreamReader;
import java.io.Reader;
import java.nio.charset.Charset;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.ie.InternetExplorerDriver;
import org.testng.annotations.Test;
public class DryRunIE{
WebDriver driver;
@Test
public void dragAndDrop() {
System.setProperty("webdriver.ie.driver", System.getProperty("user.dir") + "/Drivers/IEDriverServer.exe");
driver = new InternetExplorerDriver();
driver.get("https://jqueryui.com/droppable/");
driver.manage().window().maximize();
driver.switchTo().frame(0);
try {
//simulateDragAndDrop(driver.findElement(By.id("draggable")), driver.findElement(By.id("droppable")));
//simulateDragDrop(driver.findElement(By.id("draggable")), driver.findElement(By.id("droppable")));
dragAndDropHelper();
} catch (Exception e) {
e.printStackTrace();
}
driver.quit();
try {
Runtime.getRuntime().exec("taskkill /F /IM IEDriverServer.exe");
} catch (IOException e) {
e.printStackTrace();
}
}
private void simulateDragAndDrop(WebElement elementToDrag, WebElement target) throws Exception {
JavascriptExecutor js = (JavascriptExecutor) driver;
String script = "function createEvent(typeOfEvent) {" + "var event = document.createEvent(\"CustomEvent\");"
+ "event.initCustomEvent(typeOfEvent,true, true, null); " + "event.dataTransfer = { " + "data: {}, "
+ "setData: function (key, value) { this.data[key] = value; }, " + "getData: function (key) { "
+ "return this.data[key]; " + "} " + "}; " + "return event;" + "}"
+ "function dispatchEvent(element, event,transferData) { " + "" + "if (transferData !== undefined) { "
+ "event.dataTransfer = transferData; " + "} " + "" + "if (element.dispatchEvent) { "
+ "element.dispatchEvent(event); " + "} " + "" + "else if (element.fireEvent) { "
+ "element.fireEvent(\"on\" + event.type,event); " + "}" + "}" + ""
+ "function simulateHTML5DragAndDrop(element,target) { "
+ "var dragStartEvent =createEvent('dragstart'); " + "dispatchEvent(element, dragStartEvent); "
+ "var dropEvent = createEvent('drop'); "
+ "dispatchEvent(target, dropEvent,dragStartEvent.dataTransfer); "
+ "var dragEndEvent = createEvent('dragend'); "
+ "dispatchEvent(element, dragEndEvent,dropEvent.dataTransfer);" + "}" + ""
+ "var elementToDrag = arguments[0];" + "var targetElem = arguments[1];" + ""
+ "simulateHTML5DragAndDrop(elementToDrag,targetElem);";
js.executeScript(script, elementToDrag, target);
}
private void simulateDragDrop(WebElement ele_source, WebElement ele_target) {
final String JS_DnD =
"var src=arguments[0],tgt=arguments[1];var dataTransfer={dropEffe" +
"ct:'',effectAllowed:'all',files:[],items:{},types:[],setData:fun" +
"ction(format,data){this.items[format]=data;this.types.append(for" +
"mat);},getData:function(format){return this.items[format];},clea" +
"rData:function(format){}};var emit=function(event,target){var ev" +
"t=document.createEvent('Event');evt.initEvent(event,true,false);" +
"evt.dataTransfer=dataTransfer;target.dispatchEvent(evt);};emit('" +
"dragstart',src);emit('dragenter',tgt);emit('dragover',tgt);emit(" +
"'drop',tgt);emit('dragend',src);";
// drag and drop item two into the bin
((JavascriptExecutor)driver).executeScript(JS_DnD, ele_source, ele_target);
}
private void dragAndDropHelper() {
String script = null;
try {
script = readFile(System.getProperty("user.dir") + "\\drag_and_drop_helper.js");
} catch (IOException e) {
e.printStackTrace();
}
JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript(script + "$('#draggable').simulateDragDrop({ dropTarget: '#droppable'});");
System.out.println();
}
// helper method
private static String readFile(String file) throws IOException {
Charset cs = Charset.forName("UTF-8");
FileInputStream stream = new FileInputStream(file);
try {
Reader reader = new BufferedReader(new InputStreamReader(stream, cs));
StringBuilder builder = new StringBuilder();
char[] buffer = new char[8192];
int read;
while ((read = reader.read(buffer, 0, buffer.length)) > 0) {
builder.append(buffer, 0, read);
}
return builder.toString();
} finally {
stream.close();
}
}
}
我已經在 function 下面一一嘗試取消注釋並執行,但所有這些都成功執行,頁面上沒有任何反應。
注意:我從https://gist.github.com/rcorreia/2362544 獲得了 drag_and_drop_helper.js 。
我在這里有什么遺漏或做錯了嗎?
謝謝,錢德雷什帕爾馬
我也面臨同樣的問題。 請在下面找到自定義 java 腳本 function 進行拖放。
1) 創建 DragDrop.js 文件並在其中粘貼以下代碼
function customEvent(typeOfEvent) {
var event = document.createEvent("CustomEvent");
event.initCustomEvent(typeOfEvent, true, true, null);
event.dataTransfer = {
data: {},
setData: function (key, value) {
this.data[key] = value;
},
getData: function (key) {
return this.data[key];
}
};
return event;
}
function dispatchEvent(element, event, transferData) {
if (transferData !== undefined) {
event.dataTransfer = transferData;
}
if (element.dispatchEvent) {
element.dispatchEvent(event);
} else if (element.fireEvent) {
element.fireEvent("on" + event.type, event);
}
}
function executeDrageAndDrop(element, target) {
var dragStartEvent = customEvent('dragstart');
dispatchEvent(element, dragStartEvent);
var dropEvent = customEvent('drop');
dispatchEvent(target, dropEvent, dragStartEvent.dataTransfer);
var dragEndEvent = customEvent('dragend');
dispatchEvent(element, dragEndEvent, dropEvent.dataTransfer);
}
2)使用下面的代碼我們可以調用上面的自定義函數(下面是C#代碼)
string script = System.IO.File.ReadAllText(@"{filepath of DragDrop.js file}");
script = script + "executeDrageAndDrop(arguments[0], arguments[1])";
IJavaScriptExecutor executor = (IJavaScriptExecutor)driver;
IWebElement source = driver.findElement(By......);
IWebElement target = driver.findElement(By......);
executor.ExecuteScript(script, source, target);
注意:對於 Java - 將上面的 C# 代碼轉換為 Java 並嘗試一下。 我已經嘗試過上面的代碼,它適用於 IE、Edge 和 Chrome 瀏覽器。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.