Recently, I have encountered an issue with the drag and drop functionality in Chrome version 91 while using Selenium Action class or Java script. Despite trying various approaches, including:
- Using a custom JavaScript method for drag and drop.
JavaScript Method 1
// Custom JavaScript function for drag and drop
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 to dispatch the drag and drop events
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 to execute drag and drop operation
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);
}JavaScript Method 2 :
// Another custom JavaScript function for drag and drop
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;
}
// Continuing code here... Attempting drag and drop using jQuery method.
// jQuery simulate plugin code snippet for simulating mouse and keyboard events (function( $, undefined ) { // Code snippet continued here...Exploring drag and drop option through Robot Class.
Locatable element = (Locatable)sourceElement ; Point p= element.getCoordinates().inViewPort(); int sourceX=p.getX(); int sourceY=p.getY(); // Further steps using Robot class for simulation...Utilizing Selenium Touch Actions for drag and drop operations.
TouchActions builder = new TouchActions(driver); builder.longPress(sourceElement).moveToElement(destElement).release(destElement).perform();
Despite these attempts, none of the solutions worked for me. Drag and drop feature was functional on earlier Chrome version 89.
Check out the highlighted source & target elements in the attached screenshot.
If you have any insights or solutions, please feel free to share. Your help would be greatly appreciated!